2sys/phonograph
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

spruce up workspace navigation

Browse source
This commit is contained in:
Brent Schroeter 2025-09-25 14:51:09 -07:00
parent 9bb7dcca7c
commit f2d5f9fd01
9 changed files with 179 additions and 103 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
interim-server/src/routes/mod.rs
View file

@ -43,7 +43,7 @@ pub(crate) fn new_router(app: App) -> Router<()> {
),
)
.nest("/workspaces", workspaces_multi::new_router())
.nest("/w/{workspace_id}", workspaces_single::new_router())
.nest("/w", workspaces_single::new_router())
.nest("/auth", auth::new_router())
.route("/__dev-healthz", any(dev_healthz_handler))
.layer(SetResponseHeaderLayer::if_not_present(

32
interim-server/src/routes/workspaces_single/mod.rs
View file

@ -1,21 +1,43 @@
use axum::{
Router,
extract::{Path, State},
response::Redirect,
routing::{get, post},
};
use axum_extra::routing::RouterExt as _;
use serde::Deserialize;
use uuid::Uuid;
use crate::app::App;
use crate::{Settings, app::App};
use super::relations_single;
mod add_table_handler;
mod nav_handler;
#[derive(Clone, Debug, Deserialize)]
struct PathParams {
workspace_id: Uuid,
}
pub(super) fn new_router() -> Router<App> {
Router::<App>::new()
.route("/", get(|| async move { Redirect::to("nav/") }))
.route("/add-table", post(add_table_handler::post))
.route_with_tsr("/nav/", get(nav_handler::get))
.nest("/r/{rel_oid}", relations_single::new_router())
.route_with_tsr(
"/{workspace_id}",
get(
|State(Settings { root_path, .. }): State<Settings>,
Path(PathParams { workspace_id }): Path<PathParams>| async move {
Redirect::to(&format!(
"{root_path}/w/{workspace_id}/nav/",
workspace_id = workspace_id.simple()
))
},
),
)
.route("/{workspace_id}/add-table", post(add_table_handler::post))
.route_with_tsr("/{workspace_id}/nav/", get(nav_handler::get))
.nest(
"/{workspace_id}/r/{rel_oid}",
relations_single::new_router(),
)
}

4
interim-server/templates/portal_table.html
View file

@ -7,7 +7,9 @@
<filter-menu identifier-hints="{{ attr_names | json }}" initial-value="{{ filter | json }}"></filter-menu>
</div>
<div class="page-grid__sidebar">
{{ navbar | safe }}
<div style="padding: 1rem;">
{{ navbar | safe }}
</div>
</div>
<main class="page-grid__main">
<table-viewer columns="{{ attr_names | json }}" root-path="{{ settings.root_path }}"></table-viewer>

101
interim-server/templates/workspace_nav.html
View file

@ -1,6 +1,6 @@
<nav class="navbar">
<nav class="workspace-nav">
<section>
<div class="navbar__heading">
<div class="workspace-nav__heading">
<h2>Tables</h2>
<form
action="{{ navigator.get_root_path() -}}
@ -9,18 +9,14 @@
method="post"
>
<!-- FIXME: CSRF -->
<button type="submit">+</button>
<button class="workspace-nav__aux-button" type="submit">+</button>
</form>
</div>
<menu class="navbar__menu">
<menu class="workspace-nav__menu">
{%- for rel in relations %}
<li class="navbar__menu-item
{%- if current == Some(NavLocation::Rel(rel.oid.to_owned(), None)) -%}
{# preserve space #} navbar__menu-item--active
{%- endif -%}
">
<li>
<collapsible-menu
class="navbar__collapsible-menu"
class="workspace-nav__menu-item"
expanded="
{%- if let Some(NavLocation::Rel(rel_oid, _)) = current -%}
{%- if rel_oid.to_owned() == rel.oid -%}
@ -29,22 +25,24 @@
{%- endif -%}
"
>
<h4 slot="summary" class="navbar__heading navbar__heading--entity">
{{ rel.name }}
</h4>
<menu slot="content" class="navbar__menu">
<li class="navbar__menu-item">
<a
href="{{ navigator.get_root_path() }}/r/{{ rel.oid.0 }}/rbac"
class="navbar__menu-link"
>
Sharing
</a>
</li>
<li class="navbar__menu-item">
<collapsible-menu class="navbar__collapsible-menu">
<div slot="summary" class="navbar__heading">
<h5>Portals</h5>
<div class="workspace-nav__heading" slot="summary">
<h3>{{ rel.name }}</h3>
<a
href="{{ navigator.get_root_path() -}}
/w/{{ workspace.id.simple() -}}
/r/{{ rel.oid.0 -}}
/settings/"
class="workspace-nav__aux-button"
role="button"
>
Settings
</a>
</div>
<menu class="workspace-nav__menu" slot="content">
<li class="workspace-nav__menu-item">
<collapsible-menu class="workspace-nav__collapsible-menu">
<div slot="summary" class="workspace-nav__heading">
<h4>Portals</h4>
<form
action="{{ navigator.get_root_path() -}}
/w/{{ workspace.id.simple() -}}
@ -53,28 +51,41 @@
method="post"
>
<!-- FIXME: CSRF -->
<button type="submit">+</button>
<button class="workspace-nav__aux-button" type="submit">+</button>
</form>
</div>
<menu slot="content" class="navbar__menu">
<menu slot="content" class="workspace-nav__menu">
{% for portal in rel.portals %}
<li class="navbar__menu-item
">
<a
href="
{{- navigator.get_root_path() -}}
/w/{{ workspace.id.simple() -}}
/r/{{ rel.oid.0 -}}
/p/{{ portal.id.simple() -}}
"
class="navbar__menu-link navbar__menu-link--entity
{%- if current == Some(NavLocation::Rel(rel.oid.to_owned(), Some(RelLocation::Portal(portal.id.to_owned())))) -%}
{# preserve space #} navbar__menu-link--current
{%- endif -%}
"
>
{{ portal.name }}
</a>
<li class="workspace-nav__menu-item">
<div class="workspace-nav__menu-leaf
{%- if current == Some(NavLocation::Rel(rel.oid.to_owned(), Some(RelLocation::Portal(portal.id.to_owned())))) -%}
{# preserve space #} workspace-nav__menu-leaf--current
{%- endif -%}
">
<a
href="
{{- navigator.get_root_path() -}}
/w/{{ workspace.id.simple() -}}
/r/{{ rel.oid.0 -}}
/p/{{ portal.id.simple() -}}
"
class="workspace-nav__menu-link
"
>
{{ portal.name }}
</a>
<a
href="{{ navigator.get_root_path() -}}
/w/{{ workspace.id.simple() -}}
/r/{{ rel.oid.0 -}}
/p/{{ portal.id.simple() -}}
/form/"
class="workspace-nav__aux-button"
role="button"
>
Form
</a>
</div>
</li>
{% endfor %}
</menu>

2
interim-server/templates/workspaces_single/nav.html
View file

@ -1,7 +1,7 @@
{% extends "base.html" %}
{% block main %}
<main>
<main style="position: relative; margin: 0 auto; max-width: 32rem;">
<h1>{{ workspace.name }}</h1>
{{ workspace_nav | safe }}
</main>

17
sass/_globals.scss
View file

@ -2,10 +2,11 @@
$button-primary-background: #07f;
$button-primary-color: #fff;
$button-shadow: 0 0.15rem 0.15rem #3331;
$default-border-color: #ccc;
$default-border: solid 1px $default-border-color;
$font-family-default: 'Averia Serif Libre', 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
$font-family-data: 'Funnel Sans', 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
$font-family-default: 'Funnel Sans', 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
$font-family-data: Menlo, 'Courier New', 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
$font-family-mono: Menlo, 'Courier New', Courier, mono;
$popover-border: $default-border;
$popover-shadow: 0 0.5rem 0.5rem #3333;
@ -30,13 +31,17 @@ $hover-lightness-scale-factor: -10%;
@mixin button-base {
@include reset-button;
@include rounded;
box-shadow: $button-shadow;
font-family: $font-family-default;
font-weight: 500;
padding: 0.5rem 1rem;
transition: background 0.2s ease;
}
@mixin button-primary {
@include button-base;
background: $button-primary-background;
color: $button-primary-color;
@ -67,6 +72,7 @@ $hover-lightness-scale-factor: -10%;
@mixin button-secondary {
@include button-base;
background: #fff;
color: #000;
border: $default-border;
@ -83,11 +89,18 @@ $hover-lightness-scale-factor: -10%;
@mixin button-clear {
@include button-base;
box-shadow: none;
&:hover {
background: #0000001f;
}
}
@mixin button-small {
padding: 0.25rem 0.5rem;
font-size: 0.9rem;
}
@mixin reset-input {
appearance: none;
background: none;

4
sass/main.scss
View file

@ -4,10 +4,10 @@
@use 'modern-normalize';
@use 'forms';
@use 'collapsible_menu';
@use 'navbar';
@use 'workspace-nav';
html {
font-family: "Averia Serif Libre", "Open Sans", "Helvetica Neue", Arial, sans-serif;
font-family: globals.$font-family-default;
}
button, input[type="submit"] {

46
sass/navbar.scss
View file

@ -1,46 +0,0 @@
@use 'globals';
@use 'collapsible_menu';
$background-current-item: #0001;
.navbar {
padding: 2rem;
&__menu {
list-style-type: none;
padding: 0;
margin-bottom: 0;
}
&__heading {
font-size: inherit;
margin: 0;
padding: 0.5rem;
&--entity {
font-family: globals.$font-family-data;
}
}
&__menu-link {
@include globals.rounded-sm;
display: block;
padding: 0.5rem;
color: globals.$link-color;
text-decoration: none;
&--entity {
font-family: globals.$font-family-data;
}
&--current {
background: $background-current-item;
}
}
}
.base-switcher {
@include globals.reset-button;
font-family: globals.$font-family-data;
padding: 1rem;
}

74
sass/workspace-nav.scss Normal file
View file

@ -0,0 +1,74 @@
@use 'globals';
$background-current-item: #0001;
.workspace-nav {
& h1, h2, h3, h4, h5, h6 {
margin: 0;
font-weight: 600;
}
& h2 {
font-size: 1.25rem;
}
& h3 {
font-size: 1.125rem;
}
& h4, h5, h6 {
font-size: 1rem;
}
&__menu {
list-style-type: none;
padding: 0;
margin-bottom: 0;
}
&__heading {
align-items: center;
display: flex;
font-size: inherit;
justify-content: space-between;
margin: 0;
padding: 0.5rem;
}
&__aux-button {
@include globals.button-secondary;
@include globals.button-small;
text-decoration: none;
}
&__menu-item {
padding-top: 0.5rem;
padding-left: 0.5rem;
}
&__menu-leaf {
@include globals.rounded-sm;
align-items: center;
display: flex;
justify-content: space-between;
padding: 0 0.5rem;
&--current, &:hover {
background: $background-current-item;
}
}
&__menu-link {
color: globals.$link-color;
flex: 1;
padding: 0.75rem 0;
text-decoration: none;
}
}
.base-switcher {
@include globals.reset-button;
font-family: globals.$font-family-data;
padding: 1rem;
}