feat: simple theme selector. only works with hardcoded light and dark for now

ui/src/layout/AppBar.js

@@ -1,8 +1,27 @@
 import React, { forwardRef } from 'react'
-import { AppBar as RAAppBar, UserMenu, MenuItemLink } from 'react-admin'
+import {
+  AppBar as RAAppBar,
+  UserMenu,
+  MenuItemLink,
+  useTranslate
+} from 'react-admin'
 import InfoIcon from '@material-ui/icons/Info'
+import TuneIcon from '@material-ui/icons/Tune'
 
-const ConfigurationMenu = forwardRef(({ onClick }, ref) => (
+const ConfigurationMenu = forwardRef(({ onClick }, ref) => {
+  const translate = useTranslate()
+  return (
+    <MenuItemLink
+      ref={ref}
+      to="/configuration"
+      primaryText={translate('menu.configuration')}
+      leftIcon={<TuneIcon />}
+      onClick={onClick}
+    />
+  )
+})
+
+const VersionMenu = forwardRef(({ onClick }, ref) => (
   <MenuItemLink
     ref={ref}
     to=""
@@ -15,6 +34,7 @@ const ConfigurationMenu = forwardRef(({ onClick }, ref) => (
 const CustomUserMenu = (props) => (
   <UserMenu {...props}>
     <ConfigurationMenu />
+    <VersionMenu />
   </UserMenu>
 )
 

ui/src/layout/Layout.js

@@ -1,6 +1,14 @@
 import React from 'react'
+import { useSelector } from 'react-redux'
 import { Layout } from 'react-admin'
 import Menu from './Menu'
 import AppBar from './AppBar'
+import { DarkTheme, LightTheme } from '../themes'
 
-export default (props) => <Layout {...props} menu={Menu} appBar={AppBar} />
+export default (props) => {
+  const theme = useSelector((state) =>
+    state.theme === 'dark' ? DarkTheme : LightTheme
+  )
+
+  return <Layout {...props} menu={Menu} appBar={AppBar} theme={theme} />
+}