diff --git a/components/AppShell.jsx b/components/AppShell.jsx
index 240c8c4..d3b5f28 100644
--- a/components/AppShell.jsx
+++ b/components/AppShell.jsx
@@ -1,11 +1,14 @@
-import { IonApp, IonRouterOutlet, IonSplitPane, setupIonicReact  } from '@ionic/react';
+import { IonApp, IonLabel, IonRouterOutlet, setupIonicReact, IonTabs, IonTabBar, IonTabButton, IonIcon  } from '@ionic/react';
+import { cog, flash, list } from 'ionicons/icons';
 import { StatusBar, Style } from '@capacitor/status-bar';
 
 import { IonReactRouter } from '@ionic/react-router';
 import { Redirect, Route } from 'react-router-dom';
-import Menu from './Menu';
 
-import Tabs from './pages/Tabs';
+import Feed from './pages/Feed';
+import Lists from './pages/Lists';
+import ListDetail from './pages/ListDetail';
+import Settings from './pages/Settings';
 
 setupIonicReact({});
 
@@ -21,13 +24,37 @@ const AppShell = () => {
   return (
     <IonApp>
       <IonReactRouter>
-        <IonSplitPane contentId="main">
-          <Menu />
-          <IonRouterOutlet id="main">
-            <Route path="/tabs" render={() => <Tabs />} />
-            <Route exact path="/" render={() => <Redirect to="/tabs" />} />
+        <IonTabs>
+          <IonRouterOutlet>
+            <Route path="/tabs/feed" exact={true}>
+              <Feed />
+            </Route>
+            <Route path="/tabs/lists" exact={true}>
+              <Lists />
+            </Route>
+            <Route path="/tabs/lists/:listId" exact={true}>
+              <ListDetail />
+            </Route>
+            <Route path="/tabs/settings" exact={true}>
+              <Settings />
+            </Route>
+            <Route path="/" render={() => <Redirect to="/tabs/feed" />} exact={true} />
           </IonRouterOutlet>
-        </IonSplitPane>
+          <IonTabBar slot="bottom">
+            <IonTabButton tab="tab1" href="/tabs/feed">
+              <IonIcon icon={flash} />
+              <IonLabel>Feed</IonLabel>
+            </IonTabButton>
+            <IonTabButton tab="tab2" href="/tabs/lists">
+              <IonIcon icon={list} />
+              <IonLabel>Lists</IonLabel>
+            </IonTabButton>
+            <IonTabButton tab="tab3" href="/tabs/settings">
+              <IonIcon icon={cog} />
+              <IonLabel>Settings</IonLabel>
+            </IonTabButton>
+          </IonTabBar>
+        </IonTabs>
       </IonReactRouter>
     </IonApp>
   );
diff --git a/components/Menu.jsx b/components/Menu.jsx
deleted file mode 100644
index ed1f18d..0000000
--- a/components/Menu.jsx
+++ /dev/null
@@ -1,80 +0,0 @@
-import { StatusBar, Style } from '@capacitor/status-bar';
-import {
-  IonContent,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonMenu,
-  IonMenuToggle,
-  IonTitle,
-  IonToolbar,
-} from '@ionic/react';
-import { useEffect, useState } from 'react';
-import { cog, flash, list } from 'ionicons/icons';
-
-const pages = [
-  {
-    title: 'Feed',
-    icon: flash,
-    url: '/tabs/feed',
-  },
-  {
-    title: 'Lists',
-    icon: list,
-    url: '/tabs/lists',
-  },
-  {
-    title: 'Settings',
-    icon: cog,
-    url: '/tabs/settings',
-  },
-];
-
-const Menu = () => {
-  const [isDark, setIsDark] = useState(false);
-
-  const handleOpen = async () => {
-    try {
-      await StatusBar.setStyle({
-        style: isDark ? Style.Dark : Style.Light,
-      });
-    } catch {}
-  };
-  const handleClose = async () => {
-    try {
-      await StatusBar.setStyle({
-        style: isDark ? Style.Dark : Style.Light,
-      });
-    } catch {}
-  };
-
-  useEffect(() => {
-    setIsDark(window.matchMedia('(prefers-color-scheme: dark)').matches);
-  }, []);
-
-  return (
-    <IonMenu side="start" contentId="main" onIonDidOpen={handleOpen} onIonDidClose={handleClose}>
-      <IonHeader>
-        <IonToolbar>
-          <IonTitle>Menu</IonTitle>
-        </IonToolbar>
-      </IonHeader>
-      <IonContent>
-        <IonList>
-          {pages.map((p, k) => (
-            <IonMenuToggle autoHide={false} key={k}>
-              <IonItem routerLink={p.url} routerDirection="none" detail={false} lines="none">
-                <IonIcon icon={p.icon} slot="start" />
-                <IonLabel>{p.title}</IonLabel>
-              </IonItem>
-            </IonMenuToggle>
-          ))}
-        </IonList>
-      </IonContent>
-    </IonMenu>
-  );
-};
-
-export default Menu;
diff --git a/components/pages/ListDetail.jsx b/components/pages/ListDetail.jsx
index 04c18a6..acebadc 100644
--- a/components/pages/ListDetail.jsx
+++ b/components/pages/ListDetail.jsx
@@ -11,6 +11,7 @@ import {
   IonTitle,
   IonToolbar,
 } from '@ionic/react';
+import { useParams } from 'react-router-dom';
 
 import Store from '../../store';
 import * as actions from '../../store/actions';
@@ -35,14 +36,13 @@ const ListItemEntry = ({ list, item }) => (
 
 const ListDetail = ({ match }) => {
   const lists = Store.useState(selectors.getLists);
-  const {
-    params: { listId },
-  } = match;
+  const params = useParams();
+  const { listId } = params;
   const loadedList = lists.find(l => l.id === listId);
 
   return (
     <IonPage>
-      <IonHeader>
+      <IonHeader translucent>
         <IonToolbar>
           <IonButtons slot="start">
             <IonBackButton defaultHref="/tabs/lists" />
diff --git a/components/pages/Lists.jsx b/components/pages/Lists.jsx
index 3ca13d5..3cb6dfa 100644
--- a/components/pages/Lists.jsx
+++ b/components/pages/Lists.jsx
@@ -9,6 +9,7 @@ import {
   IonContent,
   IonItem,
   IonLabel,
+  IonList,
 } from '@ionic/react';
 
 const ListEntry = ({ list, ...props }) => (
@@ -43,7 +44,9 @@ const Lists = () => {
             <IonTitle size="large">Lists</IonTitle>
           </IonToolbar>
         </IonHeader>
-        <AllLists />
+        <IonList>
+          <AllLists />
+        </IonList>
       </IonContent>
     </IonPage>
   );
diff --git a/components/pages/Tabs.jsx b/components/pages/Tabs.jsx
deleted file mode 100644
index a1fa947..0000000
--- a/components/pages/Tabs.jsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import { Redirect, Route } from 'react-router-dom';
-import { IonRouterOutlet, IonTabs, IonTabBar, IonTabButton, IonIcon, IonLabel } from '@ionic/react';
-import { IonReactRouter } from '@ionic/react-router';
-import { cog, flash, list } from 'ionicons/icons';
-
-import Home from './Feed';
-import Lists from './Lists';
-import ListDetail from './ListDetail';
-import Settings from './Settings';
-
-const Tabs = () => {
-  return (
-    <IonTabs>
-      <IonRouterOutlet>
-        <Route path="/tabs/feed" component={Home} exact={true} />
-        <Route path="/tabs/lists" component={Lists} exact={true} />
-        <Route path="/tabs/lists/:listId" component={ListDetail} exact={true} />
-        <Route path="/tabs/settings" component={Settings} exact={true} />
-        <Route path="/tabs" render={() => <Redirect to="/tabs/feed" />} exact={true} />
-      </IonRouterOutlet>
-      <IonTabBar slot="bottom">
-        <IonTabButton tab="tab1" href="/tabs/feed">
-          <IonIcon icon={flash} />
-          <IonLabel>Feed</IonLabel>
-        </IonTabButton>
-        <IonTabButton tab="tab2" href="/tabs/lists">
-          <IonIcon icon={list} />
-          <IonLabel>Lists</IonLabel>
-        </IonTabButton>
-        <IonTabButton tab="tab3" href="/tabs/settings">
-          <IonIcon icon={cog} />
-          <IonLabel>Settings</IonLabel>
-        </IonTabButton>
-      </IonTabBar>
-    </IonTabs>
-  );
-};
-
-export default Tabs;
diff --git a/next.config.js b/next.config.js
index 1d6e3c0..bf03c0f 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,7 +1,14 @@
-module.exports = {
+const withTM = require('next-transpile-modules')([
+  '@ionic/react',
+  '@ionic/core',
+  '@stencil/core',
+  'ionicons',
+]);
+
+module.exports = withTM({
   basePath: '',
   images: {
     domains: ['images.unsplash.com'],
   },
   swcMinify: true,
-};
+});
diff --git a/package-lock.json b/package-lock.json
index 11558c9..13cd1d2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,8 +12,8 @@
         "@capacitor/core": "^4.0.0",
         "@capacitor/ios": "^4.0.0",
         "@capacitor/status-bar": "^4.0.0",
-        "@ionic/react": "^6.1.12",
-        "@ionic/react-router": "^6.1.12",
+        "@ionic/react": "^6.2.9",
+        "@ionic/react-router": "^6.2.9",
         "autoprefixer": "^10.2.6",
         "classnames": "^2.2.6",
         "next": "^12.2.0",
@@ -28,7 +28,8 @@
         "@capacitor/cli": "^4.0.0",
         "eslint": "^7.28.0",
         "eslint-config-next": "^11.0.0",
-        "ionicons": "^5.2.3",
+        "ionicons": "^6.0.3",
+        "next-transpile-modules": "^9.0.0",
         "prettier": "^2.2.1",
         "pullstate": "1.24",
         "react-use-gesture": "^9.1.3",
@@ -224,46 +225,26 @@
       "dev": true
     },
     "node_modules/@ionic/core": {
-      "version": "6.1.12",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.1.12.tgz",
-      "integrity": "sha512-CISprIpbGJHMjxsx0OAQ6grnsbBuhcImaiL5rRBI7MtncIW56nge4IO064n86bwhxRqvoXCA6EGq9D1S5Cn45g==",
+      "version": "6.2.9",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.9.tgz",
+      "integrity": "sha512-d2KBXYUKBND2AD8aMgash3O/t04IDc/DHHMshcOydfNJ5qqAxwJYzZR7hs96UknCcIlhHk1pb5C29epkv7gOcQ==",
       "dependencies": {
-        "@stencil/core": "^2.16.0",
-        "ionicons": "^6.0.2",
+        "@stencil/core": "^2.18.0",
+        "ionicons": "^6.0.3",
         "tslib": "^2.1.0"
       }
     },
-    "node_modules/@ionic/core/node_modules/@stencil/core": {
-      "version": "2.16.1",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.16.1.tgz",
-      "integrity": "sha512-s/UJp9qxExL3DyQPT70kiuWeb3AdjbUZM+5lEIXn30I2DLcLYPOPXfsoWJODieQywq+3vPiLZeIdkoqjf6jcSw==",
-      "bin": {
-        "stencil": "bin/stencil"
-      },
-      "engines": {
-        "node": ">=12.10.0",
-        "npm": ">=6.0.0"
-      }
-    },
-    "node_modules/@ionic/core/node_modules/ionicons": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.2.tgz",
-      "integrity": "sha512-AyKfFaUKVoBz4eB8XkU7H1R5HFnVsgq5ijqSdbXC0lES9PDK/J6LUQz6XUJq0mVVQF5k9kczSPOLMW3mszG0mQ==",
-      "dependencies": {
-        "@stencil/core": "~2.16.0"
-      }
-    },
     "node_modules/@ionic/core/node_modules/tslib": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
       "integrity": "sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ=="
     },
     "node_modules/@ionic/react": {
-      "version": "6.1.12",
-      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.1.12.tgz",
-      "integrity": "sha512-k5Nv63fRCcEXOXl+LBeoO8HoqLHJFRoLj+vRBdlaQm660WYd5wu5MGfrzJq+d/1bd7ZzRJaQxz/jNwYOFThqMw==",
+      "version": "6.2.9",
+      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.2.9.tgz",
+      "integrity": "sha512-zQdzdfLvhJX9lnjAO5sAQfUqy2pqk5v5qpHKQLCzDv+JxwCkrnfIAd1maQDsnEmDaJHvMCBY+/yj5VdZOJrqCA==",
       "dependencies": {
-        "@ionic/core": "^6.1.12",
+        "@ionic/core": "^6.2.9",
         "ionicons": "^6.0.2",
         "tslib": "*"
       },
@@ -273,11 +254,11 @@
       }
     },
     "node_modules/@ionic/react-router": {
-      "version": "6.1.12",
-      "resolved": "https://registry.npmjs.org/@ionic/react-router/-/react-router-6.1.12.tgz",
-      "integrity": "sha512-PxD6luLT6g0zpSN6tRUtrt7UkWaVkBgEL1zRwM/1uK3ZMAYlDTYuRhftTURsEmHUIdXedl3UMehpQYWYvoMRUA==",
+      "version": "6.2.9",
+      "resolved": "https://registry.npmjs.org/@ionic/react-router/-/react-router-6.2.9.tgz",
+      "integrity": "sha512-IrwnwnHhPWrwJZefBaW6myijEmNmgEtVdi/zI7nJPgwoH4O0MhxVM2yOsV3Q+v88ICEW29P+boX/paQ1bntvpA==",
       "dependencies": {
-        "@ionic/react": "^6.1.12",
+        "@ionic/react": "^6.2.9",
         "tslib": "*"
       },
       "peerDependencies": {
@@ -287,26 +268,6 @@
         "react-router-dom": "^5.0.1"
       }
     },
-    "node_modules/@ionic/react/node_modules/@stencil/core": {
-      "version": "2.16.1",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.16.1.tgz",
-      "integrity": "sha512-s/UJp9qxExL3DyQPT70kiuWeb3AdjbUZM+5lEIXn30I2DLcLYPOPXfsoWJODieQywq+3vPiLZeIdkoqjf6jcSw==",
-      "bin": {
-        "stencil": "bin/stencil"
-      },
-      "engines": {
-        "node": ">=12.10.0",
-        "npm": ">=6.0.0"
-      }
-    },
-    "node_modules/@ionic/react/node_modules/ionicons": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.2.tgz",
-      "integrity": "sha512-AyKfFaUKVoBz4eB8XkU7H1R5HFnVsgq5ijqSdbXC0lES9PDK/J6LUQz6XUJq0mVVQF5k9kczSPOLMW3mszG0mQ==",
-      "dependencies": {
-        "@stencil/core": "~2.16.0"
-      }
-    },
     "node_modules/@ionic/utils-array": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@ionic/utils-array/-/utils-array-2.1.5.tgz",
@@ -703,6 +664,18 @@
       "integrity": "sha512-Myxw//kzromB9yWgS8qYGuGVf91oBUUJpNvy5eM50sqvmKLbKjwLxohJnkWGTeeI9v9IBMtPLxz5Gc60FIfvCA==",
       "dev": true
     },
+    "node_modules/@stencil/core": {
+      "version": "2.18.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.18.0.tgz",
+      "integrity": "sha512-NLEY8Jq59smyiivBAxHKipsp9YkkW/K/Vm90zAyXQqukb12i2SFucWHJ1Ik7ropVlhmMVvigyxXgRfQ9quIqtg==",
+      "bin": {
+        "stencil": "bin/stencil"
+      },
+      "engines": {
+        "node": ">=12.10.0",
+        "npm": ">=6.0.0"
+      }
+    },
     "node_modules/@swc/helpers": {
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.4.2.tgz",
@@ -1590,6 +1563,19 @@
       "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
       "dev": true
     },
+    "node_modules/enhanced-resolve": {
+      "version": "5.10.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.10.0.tgz",
+      "integrity": "sha512-T0yTFjdpldGY8PmuXXR0PyQ1ufZpEGiHVrp7zHKB7jdR4qlmZHhONVM5AQOAWXuF/w3dnHbEQVrNptJgt7F+cQ==",
+      "dev": true,
+      "dependencies": {
+        "graceful-fs": "^4.2.4",
+        "tapable": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
     "node_modules/enquirer": {
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/enquirer/-/enquirer-2.3.6.tgz",
@@ -2848,10 +2834,24 @@
       }
     },
     "node_modules/ionicons": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-5.3.0.tgz",
-      "integrity": "sha512-HU8g9fnuoBF3GUBXq4GcWYoOZ6mjMRUL2X1s/QyPsbZjGRrwBcsK+I20kxdho+YDPBqa+BQM0h+gzh4H4c9P2A==",
-      "dev": true
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.3.tgz",
+      "integrity": "sha512-kVOWER991EMqLiVShrCSWKMHkgHZP7XfVdyN6YPMuoO33W7pc5CPNVNfR8OMe/I8rYEbaunyBs6dXNYpR6gGZw==",
+      "dependencies": {
+        "@stencil/core": "~2.16.0"
+      }
+    },
+    "node_modules/ionicons/node_modules/@stencil/core": {
+      "version": "2.16.1",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.16.1.tgz",
+      "integrity": "sha512-s/UJp9qxExL3DyQPT70kiuWeb3AdjbUZM+5lEIXn30I2DLcLYPOPXfsoWJODieQywq+3vPiLZeIdkoqjf6jcSw==",
+      "bin": {
+        "stencil": "bin/stencil"
+      },
+      "engines": {
+        "node": ">=12.10.0",
+        "npm": ">=6.0.0"
+      }
     },
     "node_modules/is-arrayish": {
       "version": "0.3.2",
@@ -3440,6 +3440,16 @@
         }
       }
     },
+    "node_modules/next-transpile-modules": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/next-transpile-modules/-/next-transpile-modules-9.0.0.tgz",
+      "integrity": "sha512-VCNFOazIAnXn1hvgYYSTYMnoWgKgwlYh4lm1pKbSfiB3kj5ZYLcKVhfh3jkPOg1cnd9DP+pte9yCUocdPEUBTQ==",
+      "dev": true,
+      "dependencies": {
+        "enhanced-resolve": "^5.7.0",
+        "escalade": "^3.1.1"
+      }
+    },
     "node_modules/node-emoji": {
       "version": "1.10.0",
       "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.10.0.tgz",
@@ -5013,6 +5023,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/tapable": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
+      "integrity": "sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/tar": {
       "version": "6.1.11",
       "resolved": "https://registry.npmjs.org/tar/-/tar-6.1.11.tgz",
@@ -5542,28 +5561,15 @@
       }
     },
     "@ionic/core": {
-      "version": "6.1.12",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.1.12.tgz",
-      "integrity": "sha512-CISprIpbGJHMjxsx0OAQ6grnsbBuhcImaiL5rRBI7MtncIW56nge4IO064n86bwhxRqvoXCA6EGq9D1S5Cn45g==",
+      "version": "6.2.9",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.2.9.tgz",
+      "integrity": "sha512-d2KBXYUKBND2AD8aMgash3O/t04IDc/DHHMshcOydfNJ5qqAxwJYzZR7hs96UknCcIlhHk1pb5C29epkv7gOcQ==",
       "requires": {
-        "@stencil/core": "^2.16.0",
-        "ionicons": "^6.0.2",
+        "@stencil/core": "^2.18.0",
+        "ionicons": "^6.0.3",
         "tslib": "^2.1.0"
       },
       "dependencies": {
-        "@stencil/core": {
-          "version": "2.16.1",
-          "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.16.1.tgz",
-          "integrity": "sha512-s/UJp9qxExL3DyQPT70kiuWeb3AdjbUZM+5lEIXn30I2DLcLYPOPXfsoWJODieQywq+3vPiLZeIdkoqjf6jcSw=="
-        },
-        "ionicons": {
-          "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.2.tgz",
-          "integrity": "sha512-AyKfFaUKVoBz4eB8XkU7H1R5HFnVsgq5ijqSdbXC0lES9PDK/J6LUQz6XUJq0mVVQF5k9kczSPOLMW3mszG0mQ==",
-          "requires": {
-            "@stencil/core": "~2.16.0"
-          }
-        },
         "tslib": {
           "version": "2.4.0",
           "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",
@@ -5572,36 +5578,21 @@
       }
     },
     "@ionic/react": {
-      "version": "6.1.12",
-      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.1.12.tgz",
-      "integrity": "sha512-k5Nv63fRCcEXOXl+LBeoO8HoqLHJFRoLj+vRBdlaQm660WYd5wu5MGfrzJq+d/1bd7ZzRJaQxz/jNwYOFThqMw==",
+      "version": "6.2.9",
+      "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.2.9.tgz",
+      "integrity": "sha512-zQdzdfLvhJX9lnjAO5sAQfUqy2pqk5v5qpHKQLCzDv+JxwCkrnfIAd1maQDsnEmDaJHvMCBY+/yj5VdZOJrqCA==",
       "requires": {
-        "@ionic/core": "^6.1.12",
+        "@ionic/core": "^6.2.9",
         "ionicons": "^6.0.2",
         "tslib": "*"
-      },
-      "dependencies": {
-        "@stencil/core": {
-          "version": "2.16.1",
-          "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.16.1.tgz",
-          "integrity": "sha512-s/UJp9qxExL3DyQPT70kiuWeb3AdjbUZM+5lEIXn30I2DLcLYPOPXfsoWJODieQywq+3vPiLZeIdkoqjf6jcSw=="
-        },
-        "ionicons": {
-          "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.2.tgz",
-          "integrity": "sha512-AyKfFaUKVoBz4eB8XkU7H1R5HFnVsgq5ijqSdbXC0lES9PDK/J6LUQz6XUJq0mVVQF5k9kczSPOLMW3mszG0mQ==",
-          "requires": {
-            "@stencil/core": "~2.16.0"
-          }
-        }
       }
     },
     "@ionic/react-router": {
-      "version": "6.1.12",
-      "resolved": "https://registry.npmjs.org/@ionic/react-router/-/react-router-6.1.12.tgz",
-      "integrity": "sha512-PxD6luLT6g0zpSN6tRUtrt7UkWaVkBgEL1zRwM/1uK3ZMAYlDTYuRhftTURsEmHUIdXedl3UMehpQYWYvoMRUA==",
+      "version": "6.2.9",
+      "resolved": "https://registry.npmjs.org/@ionic/react-router/-/react-router-6.2.9.tgz",
+      "integrity": "sha512-IrwnwnHhPWrwJZefBaW6myijEmNmgEtVdi/zI7nJPgwoH4O0MhxVM2yOsV3Q+v88ICEW29P+boX/paQ1bntvpA==",
       "requires": {
-        "@ionic/react": "^6.1.12",
+        "@ionic/react": "^6.2.9",
         "tslib": "*"
       }
     },
@@ -5868,6 +5859,11 @@
       "integrity": "sha512-Myxw//kzromB9yWgS8qYGuGVf91oBUUJpNvy5eM50sqvmKLbKjwLxohJnkWGTeeI9v9IBMtPLxz5Gc60FIfvCA==",
       "dev": true
     },
+    "@stencil/core": {
+      "version": "2.18.0",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.18.0.tgz",
+      "integrity": "sha512-NLEY8Jq59smyiivBAxHKipsp9YkkW/K/Vm90zAyXQqukb12i2SFucWHJ1Ik7ropVlhmMVvigyxXgRfQ9quIqtg=="
+    },
     "@swc/helpers": {
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.4.2.tgz",
@@ -6505,6 +6501,16 @@
       "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
       "dev": true
     },
+    "enhanced-resolve": {
+      "version": "5.10.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.10.0.tgz",
+      "integrity": "sha512-T0yTFjdpldGY8PmuXXR0PyQ1ufZpEGiHVrp7zHKB7jdR4qlmZHhONVM5AQOAWXuF/w3dnHbEQVrNptJgt7F+cQ==",
+      "dev": true,
+      "requires": {
+        "graceful-fs": "^4.2.4",
+        "tapable": "^2.2.0"
+      }
+    },
     "enquirer": {
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/enquirer/-/enquirer-2.3.6.tgz",
@@ -7473,10 +7479,19 @@
       }
     },
     "ionicons": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-5.3.0.tgz",
-      "integrity": "sha512-HU8g9fnuoBF3GUBXq4GcWYoOZ6mjMRUL2X1s/QyPsbZjGRrwBcsK+I20kxdho+YDPBqa+BQM0h+gzh4H4c9P2A==",
-      "dev": true
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.3.tgz",
+      "integrity": "sha512-kVOWER991EMqLiVShrCSWKMHkgHZP7XfVdyN6YPMuoO33W7pc5CPNVNfR8OMe/I8rYEbaunyBs6dXNYpR6gGZw==",
+      "requires": {
+        "@stencil/core": "~2.16.0"
+      },
+      "dependencies": {
+        "@stencil/core": {
+          "version": "2.16.1",
+          "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.16.1.tgz",
+          "integrity": "sha512-s/UJp9qxExL3DyQPT70kiuWeb3AdjbUZM+5lEIXn30I2DLcLYPOPXfsoWJODieQywq+3vPiLZeIdkoqjf6jcSw=="
+        }
+      }
     },
     "is-arrayish": {
       "version": "0.3.2",
@@ -7895,6 +7910,16 @@
         "use-sync-external-store": "1.1.0"
       }
     },
+    "next-transpile-modules": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/next-transpile-modules/-/next-transpile-modules-9.0.0.tgz",
+      "integrity": "sha512-VCNFOazIAnXn1hvgYYSTYMnoWgKgwlYh4lm1pKbSfiB3kj5ZYLcKVhfh3jkPOg1cnd9DP+pte9yCUocdPEUBTQ==",
+      "dev": true,
+      "requires": {
+        "enhanced-resolve": "^5.7.0",
+        "escalade": "^3.1.1"
+      }
+    },
     "node-emoji": {
       "version": "1.10.0",
       "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.10.0.tgz",
@@ -9048,6 +9073,12 @@
         }
       }
     },
+    "tapable": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
+      "integrity": "sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==",
+      "dev": true
+    },
     "tar": {
       "version": "6.1.11",
       "resolved": "https://registry.npmjs.org/tar/-/tar-6.1.11.tgz",
diff --git a/package.json b/package.json
index 4f13b2e..eb3dd80 100644
--- a/package.json
+++ b/package.json
@@ -16,8 +16,8 @@
     "@capacitor/core": "^4.0.0",
     "@capacitor/ios": "^4.0.0",
     "@capacitor/status-bar": "^4.0.0",
-    "@ionic/react": "^6.1.12",
-    "@ionic/react-router": "^6.1.12",
+    "@ionic/react": "^6.2.9",
+    "@ionic/react-router": "^6.2.9",
     "autoprefixer": "^10.2.6",
     "classnames": "^2.2.6",
     "next": "^12.2.0",
@@ -32,10 +32,11 @@
     "@capacitor/cli": "^4.0.0",
     "eslint": "^7.28.0",
     "eslint-config-next": "^11.0.0",
-    "ionicons": "^5.2.3",
+    "ionicons": "^6.0.3",
+    "next-transpile-modules": "^9.0.0",
     "prettier": "^2.2.1",
     "pullstate": "1.24",
     "react-use-gesture": "^9.1.3",
     "reselect": "^4.0.0"
   }
-}
\ No newline at end of file
+}
diff --git a/pages/_app.js b/pages/_app.js
index 8cf8401..9995179 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -1,8 +1,17 @@
 import Head from 'next/head';
 import Script from 'next/script';
+import { setupIonicReact } from '@ionic/react';
 
 import 'tailwindcss/tailwind.css';
+/* Core CSS required for Ionic components to work properly */
 import '@ionic/react/css/core.css';
+
+/* Basic CSS for apps built with Ionic */
+import '@ionic/react/css/normalize.css';
+import '@ionic/react/css/structure.css';
+import '@ionic/react/css/typography.css';
+
+/* Optional CSS utils that can be commented out */
 import '@ionic/react/css/padding.css';
 import '@ionic/react/css/float-elements.css';
 import '@ionic/react/css/text-alignment.css';