Moving to more workable v1 solution

components/pages/Settings.jsx

@@ -1,38 +1,23 @@
 import Store from '../../store';
 import * as selectors from '../../store/selectors';
-import * as actions from '../../store/actions';
-
-import Content from '../ui/Content';
-import List from '../ui/List';
-import ListItem from '../ui/ListItem';
-import Toggle from '../ui/Toggle';
-import usePage from '../../hooks/usePage';
-
-const Settings = ({ selected }) => {
-  usePage({
-    title: 'Settings',
-  });
 
+const Settings = () => {
   const enableNotifications = Store.useState();
   const settings = Store.useState(selectors.getSettings);
 
   return (
-    <Content className="p-4 dark:bg-black">
-      <List>
-        <ListItem className="flex">
-          <span className="text-md flex-1 dark:text-gray-200">Enable Notifications</span>
-          <Toggle
-            checked={settings.enableNotifications}
-            onChange={e =>
-              actions.setSettings({
-                ...settings,
-                enableNotifications: e.target.checked,
-              })
-            }
-          />
-        </ListItem>
-      </List>
-    </Content>
+    <IonPage>
+      <IonHeader>
+        <IonToolbar>
+          <IonTitle>Settings</IonTitle>
+        </IonToolbar>
+      </IonHeader>
+      <IonContent>
+        <List className="h-full w-full">
+          <AllLists />
+        </List>
+      </IonContent>
+    </IonPage>
   );
 };