chore: clean up admin dashboard navigation

* Remove all v1 screen tables except Solari, since we should no longer
  have any active screens of these types

* Split nav items into groups and improve styling a bit

* Refactor to generate nav links and routes from a constant instead of
  repeating everything

* Remove "admin layout" which was an exact duplicate of the v2 layout

assets/css/admin.scss

@@ -1,16 +1,53 @@
+#app {
+  font-family: sans-serif;
+  font-size: 14px;
+}
+
 .admin__textarea {
   width: 90vw;
   height: 90vh;
 }
 
 .admin-navbar {
+  display: flex;
+  flex-wrap: wrap;
+  row-gap: 0.5em;
   padding: 1em;
+  margin-bottom: 0.5em;
+  background-color: #eee;
+}
+
+.admin-navbar__group {
+  display: flex;
+
+  &:not(:first-child) {
+    padding-left: 1em;
+    margin-left: 1em;
+    border-left: 1px solid gray;
+  }
+}
+
+.admin-navbar a {
+  padding: 2px;
+  padding: 3px 5px 2px;
+  color: black;
+  text-decoration: none;
+  background-color: white;
+  border: 2px outset gray;
+  border-radius: 2px;
+
+  &.active {
+    background-color: lightgray;
+    border: 2px inset gray;
+  }
+
+  &:not(:first-child) {
+    margin-left: 0.5em;
+  }
 }
 
 .admin-table {
   padding-bottom: 3em;
-  font-family: sans-serif;
-  font-size: 14px;
 
   tbody {
     input,

assets/src/apps/admin.tsx

@@ -1,97 +1,69 @@
 require("../../css/admin.scss");
 
-import React from "react";
+import React, { ComponentType } from "react";
 import ReactDOM from "react-dom";
-import { HashRouter as Router, Route, Switch } from "react-router-dom";
+import { HashRouter as Router, NavLink, Route, Switch } from "react-router-dom";
+import weakKey from "weak-key";
 
-import AdminNavbar from "Components/admin/admin_navbar";
 import {
   AllScreensTable,
-  BusScreensTable,
-  GLSingleScreensTable,
-  GLDoubleScreensTable,
   SolariScreensTable,
-  SolariLargeScreensTable,
-  DupScreensTable,
   BusEinkV2ScreensTable,
   GLEinkV2ScreensTable,
   BuswayV2ScreensTable,
-  SolariLargeV2ScreensTable,
   BusShelterV2ScreensTable,
   PreFareV2ScreensTable,
   DupV2ScreensTable,
   TriptychV2ScreensTable,
 } from "Components/admin/admin_tables";
+import AdminScreenConfigForm from "Components/admin/admin_screen_config_form";
 import AdminTriptychPlayerForm from "Components/admin/admin_triptych_player_form";
 import ImageManager from "Components/admin/admin_image_manager";
 import Devops from "Components/admin/devops";
-import AdminScreenConfigForm from "Components/admin/admin_screen_config_form";
+
+const routes: [string, string, ComponentType][][] = [
+  [["", "All Screens", AllScreensTable]],
+  [
+    ["bus-eink-v2-screens", "Bus E-ink", BusEinkV2ScreensTable],
+    ["bus-shelter-v2-screens", "Bus Shelter", BusShelterV2ScreensTable],
+    ["dup-v2-screens", "DUP", DupV2ScreensTable],
+    ["gl-eink-v2-screens", "GL E-ink", GLEinkV2ScreensTable],
+    ["pre-fare-v2-screens", "Pre-Fare", PreFareV2ScreensTable],
+    ["busway-v2-screens", "Sectional", BuswayV2ScreensTable],
+    ["triptych-v2-screens", "Triptych", TriptychV2ScreensTable],
+  ],
+  [["solari-screens", "Solari (v1)", SolariScreensTable]],
+  [
+    ["screens-json-editor", "Config Editor", AdminScreenConfigForm],
+    ["triptych-player-json-editor", "Triptych Editor", AdminTriptychPlayerForm],
+  ],
+  [["image-manager", "Image Manager", ImageManager]],
+  [["devops", "Devops", Devops]],
+];
 
 const App = (): JSX.Element => {
   return (
     <Router>
-      <AdminNavbar />
+      <div className="admin-navbar">
+        {routes.map((group) => (
+          <div key={weakKey(group)} className="admin-navbar__group">
+            {group.map(([path, label]) => (
+              <NavLink exact to={"/" + path} key={path}>
+                {label}
+              </NavLink>
+            ))}
+          </div>
+        ))}
+      </div>
+
       <Switch>
-        <Route exact path="/">
-          <AllScreensTable />
-        </Route>
-        <Route exact path="/all-screens">
-          <AllScreensTable />
-        </Route>
-        <Route exact path="/bus-screens">
-          <BusScreensTable />
-        </Route>
-        <Route exact path="/gl_single-screens">
-          <GLSingleScreensTable />
-        </Route>
-        <Route exact path="/gl_double-screens">
-          <GLDoubleScreensTable />
-        </Route>
-        <Route exact path="/solari-screens">
-          <SolariScreensTable />
-        </Route>
-        <Route exact path="/solari-large-screens">
-          <SolariLargeScreensTable />
-        </Route>
-        <Route exact path="/dup-screens">
-          <DupScreensTable />
-        </Route>
-        <Route exact path="/dup-v2-screens">
-          <DupV2ScreensTable />
-        </Route>
-        <Route exact path="/bus-eink-v2-screens">
-          <BusEinkV2ScreensTable />
-        </Route>
-        <Route exact path="/gl-eink-v2-screens">
-          <GLEinkV2ScreensTable />
-        </Route>
-        <Route exact path="/busway-v2-screens">
-          <BuswayV2ScreensTable />
-        </Route>
-        <Route exact path="/solari-large-v2-screens">
-          <SolariLargeV2ScreensTable />
-        </Route>
-        <Route exact path="/bus-shelter-v2-screens">
-          <BusShelterV2ScreensTable />
-        </Route>
-        <Route exact path="/pre-fare-v2-screens">
-          <PreFareV2ScreensTable />
-        </Route>
-        <Route exact path="/triptych-v2-screens">
-          <TriptychV2ScreensTable />
-        </Route>
-        <Route exact path="/screens-json-editor">
-          <AdminScreenConfigForm />
-        </Route>
-        <Route exact path="/triptych-player-json-editor">
-          <AdminTriptychPlayerForm />
-        </Route>
-        <Route exact path="/image-manager">
-          <ImageManager />
-        </Route>
-        <Route exact path="/devops">
-          <Devops />
-        </Route>
+        {routes.map((group) =>
+          group.map(([path, , Component]) => (
+            <Route exact path={"/" + path} key={path}>
+              <Component />
+            </Route>
+          )),
+        )}
       </Switch>
     </Router>
   );