Refactor for readability

2021-06-09 22:35:20 -04:00
parent 7f85ecd515
commit 2afb2db7ef
8 changed files with 193 additions and 187 deletions
@@ -0,0 +1,47 @@
+import { SelectInput, useTranslate } from 'react-admin'
+import { useDispatch, useSelector } from 'react-redux'
+import { AUTO_THEME_ID } from '../consts'
+import themes from '../themes'
+import { HelpMsg } from './HelpMsg'
+import { docsUrl, openInNewTab } from '../utils'
+import { changeTheme } from '../actions'
+
+const helpKey = '_help'
+
+export const SelectTheme = (props) => {
+  const translate = useTranslate()
+  const dispatch = useDispatch()
+  const currentTheme = useSelector((state) => state.theme)
+  const themeChoices = [
+    {
+      id: AUTO_THEME_ID,
+      name: 'Auto',
+    },
+  ]
+  themeChoices.push(
+    ...Object.keys(themes).map((key) => {
+      return { id: key, name: themes[key].themeName }
+    })
+  )
+  themeChoices.push({
+    id: helpKey,
+    name: <HelpMsg caption={'Create your own'} />,
+  })
+  return (
+    <SelectInput
+      {...props}
+      source="theme"
+      label={translate('menu.personal.options.theme')}
+      defaultValue={currentTheme}
+      translateChoice={false}
+      choices={themeChoices}
+      onChange={(event) => {
+        if (event.target.value === helpKey) {
+          openInNewTab(docsUrl('/docs/developers/creating-themes/'))
+          return
+        }
+        dispatch(changeTheme(event.target.value))
+      }}
+    />
+  )
+}