Initial 1.3.x rework

src/App.tsx

@@ -1,30 +1,17 @@
-import type React from 'react';
+import type React from "react";
 
-import { Connection } from '@components/Connection';
-import { BottomNav } from '@components/menu/BottomNav';
-import { useRoute } from '@core/router';
-import { useAppSelector } from '@hooks/useAppSelector';
-import { Extensions } from '@pages/Extensions/Index';
-import { MapPage } from '@pages/map';
-import { Messages } from '@pages/Messages';
-import { NotFound } from '@pages/NotFound';
+import { Pane } from "evergreen-ui";
+
+import { AppLayout } from "@components/layout/AppLayout.js";
+
+import { PageRouter } from "./PageRouter.js";
 
 export const App = (): JSX.Element => {
-  const route = useRoute();
-  const appState = useAppSelector((state) => state.app);
-
   return (
-    <div className={`h-screen w-screen ${appState.darkMode ? 'dark' : ''}`}>
-      <Connection />
-      <div className="flex h-full flex-col">
-        <div className="flex min-h-0 w-full flex-grow">
-          {route.name === 'messages' && <Messages />}
-          {route.name === 'map' && <MapPage />}
-          {route.name === 'extensions' && <Extensions />}
-          {route.name === false && <NotFound />}
-        </div>
-        <BottomNav />
-      </div>
-    </div>
+    <Pane display="flex">
+      <AppLayout>
+        <PageRouter />
+      </AppLayout>
+    </Pane>
   );
 };