diff --git a/components/AppShell.jsx b/components/AppShell.jsx
index 82eee0f..ee8f3d9 100644
--- a/components/AppShell.jsx
+++ b/components/AppShell.jsx
@@ -1,4 +1,4 @@
-import { IonApp, IonRouterOutlet } from '@ionic/react';
+import { IonApp, IonRouterOutlet, IonSplitPane } from '@ionic/react';
import { IonReactRouter } from '@ionic/react-router';
import { Redirect, Route } from 'react-router-dom';
@@ -6,15 +6,17 @@ import Menu from './Menu';
import Tabs from './pages/Tabs';
-const AppShell = ({ page, pageProps }) => {
+const AppShell = () => {
return (
-
-
- } />
- } />
-
+
+
+
+ } />
+ } />
+
+
);
diff --git a/components/Menu.jsx b/components/Menu.jsx
index 663289b..04f4f7e 100644
--- a/components/Menu.jsx
+++ b/components/Menu.jsx
@@ -1,10 +1,45 @@
import { Plugins, StatusBarStyle } from '@capacitor/core';
-import { IonContent, IonHeader, IonMenu, IonTitle, IonToolbar } from '@ionic/react';
-import { useEffect, useState } from 'react';
+import {
+ IonContent,
+ IonHeader,
+ IonIcon,
+ IonItem,
+ IonLabel,
+ IonList,
+ IonMenu,
+ IonMenuToggle,
+ IonRouterContext,
+ IonTitle,
+ IonToolbar,
+} from '@ionic/react';
+import { useContext, useEffect, useState } from 'react';
+import { cog, flash, list } from 'ionicons/icons';
+import { useHistory, useLocation } from 'react-router-dom';
+
+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 { StatusBar } = Plugins;
+ const ionRouterContext = useContext(IonRouterContext);
+ const location = useLocation();
+
const [isDark, setIsDark] = useState(false);
const handleOpen = async () => {
@@ -33,7 +68,18 @@ const Menu = () => {
Menu
-
+
+
+ {pages.map(p => (
+
+
+
+ {p.title}
+
+
+ ))}
+
+
);
};
diff --git a/components/pages/Lists.jsx b/components/pages/Lists.jsx
index 566211b..b7bdd43 100644
--- a/components/pages/Lists.jsx
+++ b/components/pages/Lists.jsx
@@ -22,8 +22,8 @@ const AllLists = ({ onSelect }) => {
return (
<>
- {lists.map(list => (
-
+ {lists.map((list, i) => (
+
))}
>
);