ekklesiaandClaude Opus 5.5
9afe9376c4
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]>
81 lines
3.1 KiB
TypeScript
81 lines
3.1 KiB
TypeScript
import { installEkklesiaDesignTokens } from "@ekklesia/design-tokens";
|
|
import { EkklesiaUiStyles } from "@ekklesia/ui";
|
|
import { createRoot } from "react-dom/client";
|
|
import { consumeAuthLanding } from "../auth-protocol.js";
|
|
import { type EkklesiaHostConfig, resolveApiOrigin } from "../host-protocol.js";
|
|
import { HostApp } from "./HostApp.js";
|
|
import { createBrowserHostHistory } from "./host-history.js";
|
|
|
|
/**
|
|
* The one place the shell touches a browser global.
|
|
*
|
|
* The API that served this page wrote its own origin into `<meta name="ekklesia-api-origin">`
|
|
* (ADR 0045): empty in the same-origin topology, the API's hostname when the Dashboard and the API
|
|
* live on separate origins. Read at run time, so one built shell serves either topology. Everything
|
|
* downstream receives the resolved origin as a plain argument, so no other file in this package
|
|
* reads `window`.
|
|
*/
|
|
const apiBaseUrl = resolveApiOrigin(
|
|
document.querySelector<HTMLMetaElement>('meta[name="ekklesia-api-origin"]')?.content,
|
|
window.location.origin,
|
|
);
|
|
|
|
/** Read once, before anything renders, and stripped from the address bar in the same step. See
|
|
* `consumeAuthLanding` for why the token must not stay in the URL. */
|
|
const authLanding = consumeAuthLanding(window.location, window.history);
|
|
|
|
/** The address bar, handed to the shell once so no other file reads `window.location` (ADR 0057). */
|
|
const history = createBrowserHostHistory(window);
|
|
|
|
const setDocumentTitle = (title: string): void => {
|
|
document.title = title;
|
|
};
|
|
|
|
const container = document.getElementById("ekklesia-host");
|
|
if (!container) {
|
|
throw new Error("The Ekklesia shell requires a #ekklesia-host element.");
|
|
}
|
|
|
|
/**
|
|
* The host root installs the platform's default theme once, at the document (ADR 0039).
|
|
*
|
|
* This is what makes the tokens available to *everything* on the page, including each module UI
|
|
* artifact mounted inside its own isolated root: CSS custom properties inherit through a shadow
|
|
* boundary, so a module reads `var(--ekklesia-…)` without the host reaching into the artifact or the
|
|
* artifact importing the host. Only the values live here — the platform ships no theme editor, and
|
|
* an installation that wants different values overrides these declarations at its own root.
|
|
*/
|
|
installEkklesiaDesignTokens(document);
|
|
|
|
/**
|
|
* A page whose API origin is not a canonical origin fails closed: it makes no request at all, because
|
|
* every request it would make carries credentials to an address it cannot vouch for. The message is
|
|
* fixed and names no address.
|
|
*/
|
|
function renderHost(config: EkklesiaHostConfig | undefined) {
|
|
if (!config) {
|
|
return (
|
|
<main data-testid="host-configuration-invalid" role="alert">
|
|
This page cannot start: the server address it was given is not valid.
|
|
</main>
|
|
);
|
|
}
|
|
return authLanding ? (
|
|
<HostApp
|
|
authLanding={authLanding}
|
|
config={config}
|
|
history={history}
|
|
setDocumentTitle={setDocumentTitle}
|
|
/>
|
|
) : (
|
|
<HostApp config={config} history={history} setDocumentTitle={setDocumentTitle} />
|
|
);
|
|
}
|
|
|
|
createRoot(container).render(
|
|
<>
|
|
<EkklesiaUiStyles />
|
|
{renderHost(apiBaseUrl === undefined ? undefined : { apiBaseUrl })}
|
|
</>,
|
|
);
|