Feat: Replace profile dock with server dock
This commit is contained in:
46
Frontend/src/components/shell/ServerDock/ServerDock.tsx
Normal file
46
Frontend/src/components/shell/ServerDock/ServerDock.tsx
Normal file
@@ -0,0 +1,46 @@
|
||||
// Path: Frontend/src/components/shell/ServerDock/ServerDock.tsx
|
||||
|
||||
import { For, Show, type JSX } from "solid-js";
|
||||
import { activeServer } from "../data/shell.data";
|
||||
import styles from "./ServerDock.module.scss";
|
||||
|
||||
export const ServerDock = (): JSX.Element => {
|
||||
return (
|
||||
<section class={styles.panel} aria-label="Server dock">
|
||||
<div class={styles.identity}>
|
||||
<div class={styles.glyph} aria-hidden="true">
|
||||
{activeServer.abbreviation}
|
||||
</div>
|
||||
<div class={styles.copy}>
|
||||
<span class={styles.name}>{activeServer.name}</span>
|
||||
<Show
|
||||
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>
|
||||
</Show>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Show when={activeServer.dockActions.length > 0}>
|
||||
<div class={styles.actions}>
|
||||
<For each={activeServer.dockActions}>
|
||||
{(item): JSX.Element => {
|
||||
const Icon = item.icon;
|
||||
|
||||
return (
|
||||
<button type="button" class={styles.action} aria-label={item.label} title={item.label}>
|
||||
<Icon size={16} strokeWidth={2} />
|
||||
<span class={styles.actionLabel}>{item.label}</span>
|
||||
</button>
|
||||
);
|
||||
}}
|
||||
</For>
|
||||
</div>
|
||||
</Show>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user