attempting to resurrect full beans

This commit is contained in:
authentik Default Admin 2026-03-04 18:26:43 -08:00
parent bceee7ecf1
commit a961f387d6
9 changed files with 170 additions and 65 deletions

View file

@ -1,9 +1,12 @@
import { LitElement, html, css } from "lit";
import { store} from "../store/index.js";
import { StoreController } from "../controllers/store-controller.js";
import "./nav-bar.js";
import "./page-home.js";
import "./page-items.js";
class AppRoot extends LitElement {
#hydrated = new StoreController(this, store, s => s._hydrated);
#user = new StoreController(this, store, s => s.user);
#route = new StoreController(this, store, s => s.route);
@ -12,43 +15,30 @@ class AppRoot extends LitElement {
display: block;
min-height: 100vh;
}
.loading {
display: grid;
place-items: center;
height: 100vh;
opacity: 0.4;
}
`;
#navigate(route) {
this.route = route;
}
#addItem(item) {
this.items = [...this.items, item];
}
#removeItem(id) {
this.items = this.items.filter(i => i.id !== id);
}
render() {
if (!this.#hydrated.value) {
return html`<div class="loading">loading...</div>`;
}
return html`
<nav-bar
.user=${this.user}
.route=${this.route}
@navigate=${(e) => this.#navigate(e.detail.route)}
></nav-bar>
<nav-bar .user=${this.#user.value}></nav-bar>
<main>${this.#renderRoute()}</main>
`;
}
#renderRoute() {
switch (this.route) {
case "home":
return html`<page-home .user=${this.user} .items=${this.items}></page-home>`;
case "items":
return html`<page-items
.items=${this.items}
@add-item=${(e) => this.#addItem(e.detail.item)}
@remove-item=${(e) => this.#removeItem(e.detail.id)}
></page-items>`;
default:
return html`<page-home .user=${this.user} .items=${this.items}></page-home>`;
switch (this.#route.value) {
case "home": return html`<page-home></page-home>`;
case "items": return html`<page-items></page-items>`;
default: return html`<page-home></page-home>`;
}
}
}