feat: load themes dynamically

ui/src/layout/Layout.js

@@ -4,7 +4,7 @@ import { Layout } from 'react-admin'
 import { makeStyles } from '@material-ui/core/styles'
 import Menu from './Menu'
 import AppBar from './AppBar'
-import { DarkTheme, LightTheme } from '../themes'
+import themes from '../themes'
 
 const useStyles = makeStyles({
   root: { paddingBottom: '80px' }
@@ -12,19 +12,15 @@ const useStyles = makeStyles({
 
 export default (props) => {
   const classes = useStyles()
-  const theme = useSelector((state) =>
-    state.theme === 'dark' ? DarkTheme : LightTheme
-  )
+  const theme = useSelector((state) => themes[state.theme] || themes.DarkTheme)
 
   return (
-    <>
-      <Layout
-        {...props}
-        className={classes.root}
-        menu={Menu}
-        appBar={AppBar}
-        theme={theme}
-      />
-    </>
+    <Layout
+      {...props}
+      className={classes.root}
+      menu={Menu}
+      appBar={AppBar}
+      theme={theme}
+    />
   )
 }

ui/src/layout/Login.js

@@ -14,7 +14,7 @@ import LockIcon from '@material-ui/icons/Lock'
 
 import { Notification, useLogin, useNotify, useTranslate } from 'react-admin'
 
-import { LightTheme } from '../themes'
+import LightTheme from '../themes/light'
 
 const useStyles = makeStyles((theme) => ({
   main: {