ankka-console 0.10.0

package/dist/ui/status.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * A service's lifecycle as a word and a shape. The shape carries the state as well as the colour
+ * does, so nothing depends on seeing colour: filled for running, half for partly, hollow for not
+ * yet, a bar for stopped on purpose, a triangle for trouble.
+ */
+const known = {
+    Ready: { mark: "●", tone: "ready", words: "Ready" },
+    PartiallyReady: { mark: "◐", tone: "partial", words: "Partially ready" },
+    UpdateInProgress: { mark: "◌", tone: "moving", words: "Updating" },
+    NotDeployed: { mark: "○", tone: "idle", words: "Not deployed" },
+    Paused: { mark: "▮▮", tone: "stopped", words: "Paused" },
+    Suspended: { mark: "▮▮", tone: "stopped", words: "Suspended" },
+    Unavailable: { mark: "▲", tone: "trouble", words: "Unavailable" },
+    Failed: { mark: "▲", tone: "trouble", words: "Failed" },
+};
+export function lifecycleWords(lifecycle) {
+    return known[lifecycle]?.words ?? lifecycle;
+}
+export function Lifecycle({ lifecycle, confirmed = true }) {
+    const k = known[lifecycle] ?? { mark: "○", tone: "idle", words: lifecycle };
+    return (_jsxs("span", { className: `ac-status ac-status-${k.tone}`, "data-lifecycle": lifecycle, children: [_jsx("span", { className: "ac-status-mark", "aria-hidden": "true", children: k.mark }), k.words, confirmed ? null : _jsx("span", { className: "ac-status-note", children: " (last known)" })] }));
+}

package/dist/ui/use-stream.d.ts

@@ -0,0 +1,59 @@
+import type { ServiceStatus } from "../client/schemas.ts";
+export type StreamState = "connecting" | "live" | "gone" | "off";
+export declare function useProjectStream(projectId: string, initial: ServiceStatus[]): {
+    services: {
+        name: string;
+        projectId: string;
+        lifecycle: string;
+        generation: number;
+        image: string;
+        readyInstances: number;
+        desiredInstances: number;
+        detail: string | undefined;
+        confirmed: boolean;
+        database: string | undefined;
+        hostname: string | undefined;
+        exposed: boolean;
+        suspended: boolean;
+        paused: boolean;
+        hosting: string;
+        protocol: string | undefined;
+    }[];
+    state: StreamState;
+};
+export interface LogsState {
+    byInstance: Record<string, {
+        lines: string[];
+        error?: string;
+    }>;
+}
+export declare function useServiceStream(projectId: string, name: string, initial: ServiceStatus, logs?: {
+    follow: boolean;
+    query: string;
+    tail: number;
+    initial: LogsState["byInstance"];
+}): {
+    status: {
+        name: string;
+        projectId: string;
+        lifecycle: string;
+        generation: number;
+        image: string;
+        readyInstances: number;
+        desiredInstances: number;
+        detail: string | undefined;
+        confirmed: boolean;
+        database: string | undefined;
+        hostname: string | undefined;
+        exposed: boolean;
+        suspended: boolean;
+        paused: boolean;
+        hosting: string;
+        protocol: string | undefined;
+    };
+    byInstance: Record<string, {
+        lines: string[];
+        error?: string;
+    }>;
+    state: StreamState;
+};

package/dist/ui/use-stream.js

@@ -0,0 +1,67 @@
+/**
+ * The browser's side of the update streams. A stream opens only after hydration, in an effect, so a
+ * page with scripts off opens none and shows the state as of its last request. `EventSource`
+ * reconnects on its own when an instance closes the stream, and every stream starts by sending the
+ * current state, so nothing has to be carried across.
+ */
+import { useEffect, useRef, useState } from "react";
+import { useConsole } from "./console.js";
+function useEvents(path, handlers) {
+    const { mount } = useConsole();
+    const [state, setState] = useState(path ? "connecting" : "off");
+    const ref = useRef(handlers);
+    ref.current = handlers;
+    useEffect(() => {
+        if (!path) {
+            setState("off");
+            return;
+        }
+        const href = (p) => mount + p.replace(/^\/+/, "");
+        const source = new EventSource(href(path));
+        setState("connecting");
+        source.onopen = () => setState("live");
+        const on = (name, f) => source.addEventListener(name, (e) => f(JSON.parse(e.data)));
+        for (const name of ["status", "services", "logs"])
+            on(name, (d) => ref.current[name]?.(d));
+        on("session-ended", () => {
+            source.close();
+            window.location.assign(href(`auth/sign-in?returnTo=${encodeURIComponent(window.location.pathname + window.location.search)}`));
+        });
+        on("gone", () => {
+            source.close();
+            setState("gone");
+        });
+        on("server-closing", () => setState("connecting"));
+        source.onerror = () => setState(source.readyState === EventSource.CLOSED ? "off" : "connecting");
+        return () => source.close();
+    }, [path, mount]);
+    return state;
+}
+export function useProjectStream(projectId, initial) {
+    const [services, setServices] = useState(initial);
+    useEffect(() => setServices(initial), [initial]);
+    const state = useEvents(`stream/projects/${encodeURIComponent(projectId)}`, {
+        services: (d) => setServices(d),
+    });
+    return { services, state };
+}
+export function useServiceStream(projectId, name, initial, logs) {
+    const [status, setStatus] = useState(initial);
+    useEffect(() => setStatus(initial), [initial]);
+    const [byInstance, setByInstance] = useState(logs?.initial ?? {});
+    useEffect(() => setByInstance(logs?.initial ?? {}), [logs?.initial]);
+    const base = `stream/services/${encodeURIComponent(projectId)}/${encodeURIComponent(name)}`;
+    const path = logs?.follow ? `${base}?logs&${logs.query}` : base;
+    const state = useEvents(path, {
+        status: (d) => setStatus(d),
+        logs: (d) => {
+            const e = d;
+            setByInstance((prev) => {
+                const kept = e.reset ? [] : (prev[e.instance]?.lines ?? []);
+                const next = e.error ? { lines: kept, error: e.error } : { lines: [...kept, ...(e.lines ?? [])].slice(-(logs?.tail ?? 200)) };
+                return { ...prev, [e.instance]: next };
+            });
+        },
+    });
+    return { status, byInstance, state };
+}

package/package.json

@@ -0,0 +1,79 @@
+{
+  "name": "ankka-console",
+  "version": "0.10.0",
+  "description": "The ankka console as a package: the control plane client, sign-in and sessions, and the pages as routes a React Router host mounts.",
+  "license": "Apache-2.0",
+  "type": "module",
+  "engines": {
+    "node": ">=24"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "*.css"
+  ],
+  "exports": {
+    ".": {
+      "ankka-source": "./src/index.ts",
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./client": {
+      "ankka-source": "./src/client/index.ts",
+      "types": "./dist/client/index.d.ts",
+      "default": "./dist/client/index.js"
+    },
+    "./server": {
+      "ankka-source": "./src/server/index.ts",
+      "types": "./dist/server/index.d.ts",
+      "default": "./dist/server/index.js"
+    },
+    "./testing": {
+      "ankka-source": "./src/testing/index.ts",
+      "types": "./dist/testing/index.d.ts",
+      "default": "./dist/testing/index.js"
+    },
+    "./styles.css": "./dist/styles.css"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/thinkmorestupidless/ankka.git",
+    "directory": "console/package"
+  },
+  "homepage": "https://docs.ankka.cloud/",
+  "scripts": {
+    "build": "node scripts/build.ts",
+    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "test": "node --conditions=ankka-source --test 'test/**/*.test.ts'"
+  },
+  "dependencies": {
+    "jose": "^6.2.12",
+    "openid-client": "^6.8.8",
+    "zod": "^4.6.5"
+  },
+  "peerDependencies": {
+    "@react-router/dev": "^8.4.0",
+    "@react-router/node": "^8.4.0",
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7",
+    "react-router": "^8.4.0"
+  },
+  "peerDependenciesMeta": {
+    "@react-router/dev": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@react-router/dev": "^8.4.0",
+    "@react-router/node": "^8.4.0",
+    "@types/node": "^26.6.3",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
+    "react-router": "^8.4.0",
+    "typescript": "^7.0.2",
+    "vite": "^8.3.1"
+  }
+}