Feat: Hydrate shell from app state

This commit is contained in:
MangoPig
2026-06-19 17:39:39 +01:00
parent 913825f596
commit 6ba04effcf
15 changed files with 1258 additions and 131 deletions

View File

@@ -1,33 +1,36 @@
// Path: Frontend/src/components/shell/ServerDock/ServerDock.tsx
import { For, Show, type JSX } from "solid-js";
import { activeServer } from "../data/shell.data";
import { useAppShellData } from "../data/app-shell.context";
import styles from "./ServerDock.module.scss";
export const ServerDock = (): JSX.Element => {
const appShellData = useAppShellData();
const activeServer = () => appShellData.activeServer();
return (
<section class={styles.panel} aria-label="Server dock" data-ui="server-dock" data-server-kind={activeServer.kind}>
<section class={styles.panel} aria-label="Server dock" data-ui="server-dock" data-server-kind={activeServer().kind}>
<div class={styles.identity} data-slot="server-dock-identity">
<div class={styles.glyph} aria-hidden="true">
{activeServer.abbreviation}
{activeServer().abbreviation}
</div>
<div class={styles.copy} data-slot="server-dock-copy">
<span class={styles.name}>{activeServer.name}</span>
<span class={styles.name}>{activeServer().name}</span>
<Show
when={activeServer.kind === "organization"}
fallback={<span class={styles.subtitle}>{activeServer.subtitle}</span>}
when={activeServer().kind === "organization"}
fallback={<span class={styles.subtitle}>{activeServer().subtitle}</span>}
>
<span class={styles.status}>
<span class={styles.statusDot} aria-hidden="true" />
<span>{activeServer.connectedLabel}</span>
<span>{activeServer().connectedLabel}</span>
</span>
</Show>
</div>
</div>
<Show when={activeServer.dockActions.length > 0}>
<Show when={activeServer().dockActions.length > 0}>
<div class={styles.actions} data-slot="server-dock-actions">
<For each={activeServer.dockActions}>
<For each={activeServer().dockActions}>
{(item): JSX.Element => {
const Icon = item.icon;