From 9818df10f75cf5ea5050d3212c260ff22bb64b65 Mon Sep 17 00:00:00 2001
From: Brent Schroeter <contact@brentsch.com>
Date: Thu, 27 Nov 2025 07:24:41 +0000
Subject: [PATCH] improve navigation

---
 .../src/routes/workspaces_single/mod.rs       |  2 +-
 phono-server/templates/list_bases.html        | 17 -----
 phono-server/templates/portal_table.html      |  9 ++-
 phono-server/templates/workspace_nav.html     |  4 +-
 .../templates/workspaces_multi/list.html      | 69 +++++++++++++------
 .../templates/workspaces_single/nav.html      | 16 +++--
 sass/workspace-nav.scss                       |  6 --
 7 files changed, 70 insertions(+), 53 deletions(-)
 delete mode 100644 phono-server/templates/list_bases.html

diff --git a/phono-server/src/routes/workspaces_single/mod.rs b/phono-server/src/routes/workspaces_single/mod.rs
index 8574e5d..d1a2e03 100644
--- a/phono-server/src/routes/workspaces_single/mod.rs
+++ b/phono-server/src/routes/workspaces_single/mod.rs
@@ -45,7 +45,7 @@ pub(super) fn new_router() -> Router<App> {
             post(update_name_handler::post),
         )
         .route(
-            "/{workspace_id}/add-service-credential",
+            "/{workspace_id}/service-credentials/add-service-credential",
             post(add_service_credential_handler::post),
         )
         .route("/{workspace_id}/add-table", post(add_table_handler::post))
diff --git a/phono-server/templates/list_bases.html b/phono-server/templates/list_bases.html
deleted file mode 100644
index 57ea2ba..0000000
--- a/phono-server/templates/list_bases.html
+++ /dev/null
@@ -1,17 +0,0 @@
-{% extends "base.html" %}
-
-{% block main %}
-<table>
-  <tbody>
-    {% for base in bases %}
-    <tr>
-      <td>
-        <a href="{{ settings.root_path }}/d/{{ base.id.simple() }}/config">
-          {{ base.name }}
-        </a>
-      </td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
-{% endblock %}
diff --git a/phono-server/templates/portal_table.html b/phono-server/templates/portal_table.html
index c61c67f..8375225 100644
--- a/phono-server/templates/portal_table.html
+++ b/phono-server/templates/portal_table.html
@@ -1,7 +1,12 @@
 {% extends "base.html" %}
 
-{% block main %}
+{% block head_extras %}
 <link rel="stylesheet" href="{{ settings.root_path }}/css_dist/viewer.css">
+<script type="module" src="{{ settings.root_path }}/js_dist/table-viewer.webc.mjs"></script>
+<script type="module" src="{{ settings.root_path }}/js_dist/filter-menu.webc.mjs"></script>
+{% endblock %}
+
+{% block main %}
 <div class="page-grid">
   <div class="page-grid__toolbar">
     <div class="page-grid__toolbar-utilities">
@@ -24,6 +29,4 @@
     <table-viewer columns="{{ columns | json }}"></table-viewer>
   </main>
 </div>
-<script type="module" src="{{ settings.root_path }}/js_dist/table-viewer.webc.mjs"></script>
-<script type="module" src="{{ settings.root_path }}/js_dist/filter-menu.webc.mjs"></script>
 {% endblock %}
diff --git a/phono-server/templates/workspace_nav.html b/phono-server/templates/workspace_nav.html
index 5f1758e..9bf3abb 100644
--- a/phono-server/templates/workspace_nav.html
+++ b/phono-server/templates/workspace_nav.html
@@ -47,8 +47,8 @@
         method="post"
       >
         <!-- FIXME: CSRF -->
-        <button aria-label="Add table" class="button--secondary button--small" type="submit">
-          <i class="ti ti-database-plus"></i>
+        <button class="button--secondary button--small" type="submit">
+          <i class="ti ti-database-plus"><div class="sr-only">Add table</div></i>
         </button>
       </form>
     </div>
diff --git a/phono-server/templates/workspaces_multi/list.html b/phono-server/templates/workspaces_multi/list.html
index 13e57a3..e5ac3f7 100644
--- a/phono-server/templates/workspaces_multi/list.html
+++ b/phono-server/templates/workspaces_multi/list.html
@@ -1,23 +1,52 @@
 {% extends "base.html" %}
 
-{% block main %}
-<main>
-  <h1>Workspaces</h1>
-  <form method="post" action="add">
-    <button class="button--primary" type="submit">+</button>
-  </form>
-  <ul>
-    {% for workspace_perm in workspace_perms %}
-    <li>
-      <a href="{{ navigator.workspace_page().workspace_id(*workspace_perm.workspace_id).build()?.get_path() }}">
-        {% if workspace_perm.workspace_display_name.is_empty() %}
-        [Untitled Workspace]
-        {% else %}
-        {{ workspace_perm.workspace_display_name }}
-        {% endif %}
-      </a>
-    </li>
-    {% endfor %}
-  </ul>
-</main>
+{% block head_extras %}
+{% endblock %}
+
+{% block main %}
+<div class="page-grid">
+  <div class="page-grid__toolbar">
+    {% include "toolbar_user.html" %}
+  </div>
+  <main class="page-grid__main">
+    <nav class="workspace-nav" style="position: relative; margin: 0 auto; max-width: 540px;">
+      <section class="workspace-nav__section">
+        <div class="workspace-nav__heading">
+          <h1>My Workspaces</h1>
+          <form method="post" action="add">
+            <button class="button--secondary button--small" type="submit">
+              <i class="ti ti-plus"><div class="sr-only">Add workspace</div></i>
+            </button>
+          </form>
+        </div>
+        <menu class="workspace-nav__menu">
+          {% for workspace_perm in workspace_perms %}
+          <li class="workspace-nav__menu-item">
+            <div class="workspace-nav__menu-leaf">
+              <a href="
+              {{- navigator
+                .workspace_page()
+                .workspace_id(*workspace_perm.workspace_id)
+                .build()?
+                .get_path() -}}
+              " class="workspace-nav__menu-link">
+                {% if workspace_perm.workspace_display_name.is_empty() %}
+                [Untitled Workspace]
+                {% else %}
+                {{ workspace_perm.workspace_display_name }}
+                {% endif %}
+              </a>
+            </div>
+          </li>
+          {% endfor %}
+        </menu>
+      </section>
+      <section class="workspace-nav__section">
+        <div class="workspace-nav__heading">
+          <h1>Shared With Me</h1>
+        </div>
+      </section>
+    </nav>
+  </main>
+</div>
 {% endblock %}
diff --git a/phono-server/templates/workspaces_single/nav.html b/phono-server/templates/workspaces_single/nav.html
index b1e4cdd..a726850 100644
--- a/phono-server/templates/workspaces_single/nav.html
+++ b/phono-server/templates/workspaces_single/nav.html
@@ -1,8 +1,16 @@
 {% extends "base.html" %}
 
 {% block main %}
-<main style="position: relative; margin: 0 auto; max-width: 32rem;">
-  <h1>{{ workspace.display_name }}</h1>
-  {{ workspace_nav | safe }}
-</main>
+<div class="page-grid">
+  <div class="page-grid__toolbar">
+    {% include "toolbar_user.html" %}
+  </div>
+  <div class="page-grid__sidebar">
+    <div style="padding: 1rem;">
+      {{ workspace_nav | safe }}
+    </div>
+  </div>
+  <main class="page-grid__main">
+  </main>
+</div>
 {% endblock %}
diff --git a/sass/workspace-nav.scss b/sass/workspace-nav.scss
index 576467b..6371785 100644
--- a/sass/workspace-nav.scss
+++ b/sass/workspace-nav.scss
@@ -78,9 +78,3 @@ $background-current-item: #0001;
     text-decoration: none;
   }
 }
-
-.base-switcher {
-  @include globals.reset-button;
-  font-family: globals.$font-family-data;
-  padding: 1rem;
-}