fix(frontend/settings): use category name from settings as title

shabados · May 15, 2020 · 6cf79e3 · 6cf79e3
1 parent 2ebc5b5
commit 6cf79e3
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 7 deletions.
diff --git a/app/frontend/src/Settings/DynamicOptions.js b/app/frontend/src/Settings/DynamicOptions.js
@@ -4,16 +4,12 @@ import { string, shape, node, bool } from 'prop-types'
 import { Typography, Grid } from '@material-ui/core'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 
-import { OPTIONS, DEFAULT_OPTIONS, PRIVACY_TYPES, OPTION_GROUPS } from '../lib/options'
+import { OPTIONS, DEFAULT_OPTIONS, PRIVACY_TYPES, OPTION_GROUPS, FLAT_OPTION_GROUPS } from '../lib/options'
 import controller from '../lib/controller'
 import { SettingsContext } from '../lib/contexts'
 
 import SettingComponentFactory, { Button } from './SettingComponents'
 
-const FLAT_OPTION_GROUPS = Object
-  .values( OPTION_GROUPS )
-  .reduce( ( groups, section ) => ( { ...groups, ...section } ), {} )
-
 export const slotSizes = {
   icon: { xs: 2, sm: 1 },
   name: { xs: 5, sm: 5, md: 4, lg: 4 },

diff --git a/app/frontend/src/Settings/index.js b/app/frontend/src/Settings/index.js
@@ -35,7 +35,7 @@ import {
   SETTINGS_OVERLAY_URL,
   SETTINGS_ABOUT_URL,
 } from '../lib/consts'
-import { OPTIONS, OPTION_GROUPS } from '../lib/options'
+import { OPTIONS, OPTION_GROUPS, FLAT_OPTION_GROUPS } from '../lib/options'
 import SHORTCUTS from '../lib/keyMap'
 import { SettingsContext } from '../lib/contexts'
 
@@ -53,6 +53,7 @@ import './index.css'
 const Settings = () => {
   const { pathname } = useLocation()
   const group = pathname.split( '/' ).pop()
+  const { name } = FLAT_OPTION_GROUPS[ group ] || { name: group }
 
   const [ mobileOpen, setMobileOpen ] = useState( false )
   const [ device, setDevice ] = useState( 'local' )
@@ -194,7 +195,7 @@ const Settings = () => {
             <FontAwesomeIcon className="menu icon" icon={faBars} />
           </IconButton>
         </Hidden>
-        <Typography className="title" align="center" variant="h6">{group}</Typography>
+        <Typography className="title" align="center" variant="h6">{name}</Typography>
       </Toolbar>
     </AppBar>
   )

diff --git a/app/frontend/src/lib/options.js b/app/frontend/src/lib/options.js
@@ -201,6 +201,10 @@ export const OPTION_GROUPS = {
   },
 }
 
+export const FLAT_OPTION_GROUPS = Object
+  .values( OPTION_GROUPS )
+  .reduce( ( groups, section ) => ( { ...groups, ...section } ), {} )
+
 // Options with default values
 export const DEFAULT_OPTIONS = {
   local: {