CI / verify (pull_request) Successful in 1m7s
CI / infrastructure-smoke (pull_request) Successful in 34s
CI / package-release (pull_request) Successful in 49s
CI / migration-smoke (pull_request) Successful in 2m17s
CI / image-build (pull_request) Successful in 1m10s
CI / deploy-smoke (same-origin) (pull_request) Successful in 45s
CI / package-publication (pull_request) Successful in 57s
CI / deploy-smoke (split) (pull_request) Successful in 2m37s
The Dashboard had one address. The API served the page only at `/`, both reference proxies forwarded only `/`, and the open module lived in React state, so a refresh went back to the first module, nothing could be bookmarked, and Back left the Dashboard (DESIGN.md §2.7). ADR 0057 makes the address bar the source of truth: - `/` is a host-owned Overview, now the landing page; `/modules/<id>` mounts that module. An id the server's navigation does not list shows "This page isn't available" and loads nothing; any other Dashboard address is a host-owned "Page not found". - `/modules`, `/settings`, and `/account` are reserved whole, from one list (`@ekklesia/shell/dashboard-routes`) that the shell's router and the API's page routes both read. The API serves the same frozen page, ETag, and security headers anywhere inside them; look-alikes and other methods stay the sanitized 404. - A small host-owned history replaces the selected-module state, built in the entry point so it stays the only file touching `window`. Navigation items are real links; modified clicks are left to the browser. Focus moves to the page after an in-place change, and the tab is named after the page. - Sign-in still happens in place with no return value (ADR 0034), so a deep link opens its own page after sign-in. - Both reference Caddyfiles forward the new paths; the deploy smoke now reloads a module's address through the real proxy and requires it to mount again. Co-Authored-By: Claude Opus 5.5 <[email protected]>
67 lines
2.3 KiB
TypeScript
67 lines
2.3 KiB
TypeScript
import { EmptyState, PageHeader } from "@ekklesia/ui";
|
||
import type { ReactElement } from "react";
|
||
import { DashboardLink } from "./DashboardLink.js";
|
||
import type { HostHistory } from "./host-history.js";
|
||
|
||
/**
|
||
* The Dashboard's landing page (DESIGN.md §5, ADR 0057).
|
||
*
|
||
* The Overview is where the Dashboard opens. Its cards will come from modules through a contract
|
||
* that does not exist yet, so for now it honestly says it is empty rather than inventing content.
|
||
*/
|
||
export function OverviewPage(): ReactElement {
|
||
return (
|
||
<div data-testid="host-overview">
|
||
<PageHeader title="Overview" />
|
||
<EmptyState
|
||
description="Summaries from your modules will appear here as they become available. Choose a module in the navigation to open it."
|
||
title="Nothing to show yet"
|
||
/>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
/**
|
||
* A module page whose module is not available to this Dashboard: it was disabled or removed, it
|
||
* provides no user interface, or the address was mistyped. The server's navigation is the only
|
||
* authority on what exists, and it does not say which of these applies, so neither does this page.
|
||
* It never echoes the address back.
|
||
*/
|
||
export function ModuleUnavailablePage(props: { readonly history: HostHistory }): ReactElement {
|
||
return (
|
||
<div data-testid="host-module-unavailable">
|
||
<PageHeader
|
||
actions={<OverviewAction history={props.history} />}
|
||
description="The module it belongs to may have been turned off or removed. If you expected to see it, ask an administrator."
|
||
title="This page isn’t available"
|
||
/>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
/** Any other address inside the Dashboard. */
|
||
export function NotFoundPage(props: { readonly history: HostHistory }): ReactElement {
|
||
return (
|
||
<div data-testid="host-not-found">
|
||
<PageHeader
|
||
actions={<OverviewAction history={props.history} />}
|
||
description="There is nothing at this address. Check it, or start again from the Overview."
|
||
title="Page not found"
|
||
/>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
function OverviewAction(props: { readonly history: HostHistory }): ReactElement {
|
||
return (
|
||
<DashboardLink
|
||
data-testid="host-go-to-overview"
|
||
history={props.history}
|
||
to={{ kind: "overview" }}
|
||
variant="action"
|
||
>
|
||
Go to Overview
|
||
</DashboardLink>
|
||
);
|
||
}
|