5 files changed, 20 insertions, 17 deletions
diff --git a/modern/.eslintrc.js b/modern/.eslintrc.js
index d6380a85..a4cf3053 100644
--- a/modern/.eslintrc.js
+++ b/modern/.eslintrc.js
@@ -1,5 +1,8 @@
 module.exports = {
   extends: 'airbnb',
+  parserOptions: {
+    ecmaVersion: 2020,
+  },
   plugins: [
     'react',
   ],
diff --git a/modern/package.json b/modern/package.json
index 365d9865..2ae229c6 100644
--- a/modern/package.json
+++ b/modern/package.json
@@ -49,7 +49,7 @@
     ]
   },
   "devDependencies": {
-    "eslint": "^6.8.0",
+    "eslint": "^7.30.0",
     "eslint-config-airbnb": "^18.2.1",
     "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-react": "^7.24.0",
diff --git a/modern/src/components/SideNav.js b/modern/src/components/SideNav.js
index aa078084..bcf8ecd5 100644
--- a/modern/src/components/SideNav.js
+++ b/modern/src/components/SideNav.js
@@ -9,7 +9,7 @@ const SideNav = ({ routes }) => {
 
   return (
     <List disablePadding style={{ paddingTop: '16px' }}>
-      {routes.map((route, index) => (route.subheader ? (
+      {routes.map((route) => (route.subheader ? (
         <>
           <Divider />
           <ListSubheader>{route.subheader}</ListSubheader>
diff --git a/modern/src/selectors.js b/modern/src/selectors.js
index f0b08f5f..44a0c547 100644
--- a/modern/src/selectors.js
+++ b/modern/src/selectors.js
@@ -1,3 +1,3 @@
-export const getIsAdmin = state => state.session.user?.administrator;
+export const getIsAdmin = (state) => state.session.user?.administrator;
 
-export const getUserId = state => state.session.user?.id;
+export const getUserId = (state) => state.session.user?.id;
diff --git a/modern/src/settings/OptionsLayout/index.js b/modern/src/settings/OptionsLayout/index.js
index 61a94cff..1184465b 100644
--- a/modern/src/settings/OptionsLayout/index.js
+++ b/modern/src/settings/OptionsLayout/index.js
@@ -6,7 +6,7 @@ import {
   Drawer,
   makeStyles,
   IconButton,
-  Hidden
+  Hidden,
 } from '@material-ui/core';
 
 import ArrowBackIcon from '@material-ui/icons/ArrowBack';
@@ -16,38 +16,38 @@ import NavBar from '../../components/NavBar';
 import t from '../../common/localization';
 import useRoutes from './useRoutes';
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   root: {
     display: 'flex',
-    height: '100%'
+    height: '100%',
   },
   drawerContainer: {
-    width: theme.dimensions.drawerWidthDesktop
+    width: theme.dimensions.drawerWidthDesktop,
   },
   drawer: {
     width: theme.dimensions.drawerWidthDesktop,
     [theme.breakpoints.down('md')]: {
-      width: theme.dimensions.drawerWidthTablet
-    }
+      width: theme.dimensions.drawerWidthTablet,
+    },
   },
   content: {
     flex: 1,
     padding: theme.spacing(5, 3, 3, 3),
     [theme.breakpoints.down('md')]: {
-      paddingTop: theme.spacing(10)
-    }
+      paddingTop: theme.spacing(10),
+    },
   },
   drawerHeader: {
     ...theme.mixins.toolbar,
     display: 'flex',
     alignItems: 'center',
-    padding: theme.spacing(0, 1)
+    padding: theme.spacing(0, 1),
   },
   toolbar: {
     [theme.breakpoints.down('md')]: {
-      ...theme.mixins.toolbar
-    }
-  }
+      ...theme.mixins.toolbar,
+    },
+  },
 }));
 
 const OptionsLayout = ({ children }) => {
@@ -59,7 +59,7 @@ const OptionsLayout = ({ children }) => {
 
   useEffect(() => {
     const activeRoute = routes.find(
-      route => route.href && location.pathname.match(route.match || route.href)
+      (route) => route.href && location.pathname.match(route.match || route.href),
     );
     setOptionTitle(activeRoute?.name);
   }, [location, routes]);