@volter/twin-github 0.1.2 → 2.0.1

package/dist/client/github-mirror.js

@@ -0,0 +1,485 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useEffect, useMemo, useState } from "react";
+import { createRoot } from "react-dom/client";
+import { GITHUB_MIRROR_STORE_PATH, githubIssuePath, githubPullPath } from "../src/github-shared.js";
+function shortSha(value) {
+    return value ? value.slice(0, 7) : "unknown";
+}
+// CI rollup glyph per PR head_sha (✓ success, ✗ failure, ● pending). Undefined for
+// observed-only PRs with no statuses/check-runs — they show no CI indicator (honesty).
+const CI_GLYPH = { success: "✓", failure: "✗", pending: "●" };
+export function CiStatus({ status }) {
+    if (!status)
+        return null;
+    return _jsx("span", { className: `ci-status ${status}`, title: `checks: ${status}`, children: CI_GLYPH[status] ?? "●" });
+}
+function prKey(pr) {
+    return `${pr.repo}#${pr.number}`;
+}
+// A workflow-run status/conclusion badge (✓ success, ✗ failure, ⊘ cancelled, ● queued/
+// in_progress) — mirrors GitHub's run-list status glyphs. A completed run shows its
+// conclusion; an in-flight one shows its status.
+const RUN_GLYPH = { success: "✓", failure: "✗", cancelled: "⊘", skipped: "–", queued: "●", in_progress: "●", completed: "✓" };
+export function RunStatusBadge({ status, conclusion }) {
+    const effective = status === "completed" ? (conclusion || "completed") : (status || "queued");
+    return _jsxs("span", { className: `run-badge ${effective}`, title: `run: ${effective}`, children: [RUN_GLYPH[effective] ?? "●", " ", effective] });
+}
+function initials(name) {
+    return (name || "?").split(/[-_\s]+/).map((part) => part[0]).join("").slice(0, 2).toUpperCase() || "?";
+}
+function Avatar({ src, label }) {
+    return (_jsx("div", { className: "avatar", children: src ? _jsx("img", { src: src, alt: "", loading: "lazy", referrerPolicy: "no-referrer" }) : initials(label) }));
+}
+const VIEW_NAMES = ["pulls", "issues", "actions", "releases", "discussions", "code", "search", "notifications", "deployments", "projects", "insights", "settings"];
+const DEFAULT_ROUTE = { repo: "all", view: "pulls", selectedKey: "", selectedIssueKey: "" };
+/** `selectedKey`/`selectedIssueKey` are `${repo}#${number}` — split on the LAST `#` (repo
+ *  names never contain one) to recover the PR/issue's OWN repo, independent of whichever
+ *  repo tab is currently selected (opening a PR from the "all repos" list still routes to
+ *  that PR's own `/{owner}/{repo}/pull/{n}`, matching real GitHub). */
+function splitRepoScopedKey(key) {
+    const hashIndex = key.lastIndexOf("#");
+    return { repo: key.slice(0, hashIndex), number: key.slice(hashIndex + 1) };
+}
+function pathFor(route) {
+    const { repo, view, selectedKey, selectedIssueKey } = route;
+    // An opened PR/issue always routes to ITS OWN repo's path, regardless of the "all repos"
+    // vs single-repo tab currently selected (mirrors real GitHub: /pulls can link out to any
+    // repo's /owner/repo/pull/n).
+    // The route grammar is real GitHub's — the same one the twin's mirror store stamps on
+    // each PR/issue `url` (github-shared.ts), so a rendered link and the address bar agree.
+    if (view === "pulls" && selectedKey) {
+        const { repo: prRepo, number } = splitRepoScopedKey(selectedKey);
+        return githubPullPath(prRepo, number);
+    }
+    if (view === "issues" && selectedIssueKey) {
+        const { repo: issueRepo, number } = splitRepoScopedKey(selectedIssueKey);
+        return githubIssuePath(issueRepo, number);
+    }
+    if (repo === "all" || !repo)
+        return `/${view}`;
+    return `/${repo}/${view}`;
+}
+function stateFor(pathname) {
+    const segments = pathname.split("/").filter(Boolean).map((segment) => decodeURIComponent(segment));
+    if (segments.length === 0)
+        return DEFAULT_ROUTE;
+    if (segments.length === 1 && VIEW_NAMES.includes(segments[0])) {
+        return { ...DEFAULT_ROUTE, view: segments[0] };
+    }
+    if (segments.length >= 2) {
+        const repo = `${segments[0]}/${segments[1]}`;
+        if (segments.length === 2)
+            return { ...DEFAULT_ROUTE, repo, view: "pulls" };
+        const tab = segments[2];
+        if (tab === "pull" && segments[3])
+            return { ...DEFAULT_ROUTE, repo, view: "pulls", selectedKey: `${repo}#${segments[3]}` };
+        if (tab === "pulls")
+            return { ...DEFAULT_ROUTE, repo, view: "pulls" };
+        if (tab === "issues" && segments[3])
+            return { ...DEFAULT_ROUTE, repo, view: "issues", selectedIssueKey: `${repo}#${segments[3]}` };
+        if (tab === "issues")
+            return { ...DEFAULT_ROUTE, repo, view: "issues" };
+        if (VIEW_NAMES.includes(tab))
+            return { ...DEFAULT_ROUTE, repo, view: tab };
+        return { ...DEFAULT_ROUTE, repo, view: "pulls" };
+    }
+    return DEFAULT_ROUTE;
+}
+function App() {
+    const [payload, setPayload] = useState(null);
+    const initialRoute = typeof window !== "undefined" ? stateFor(window.location.pathname) : DEFAULT_ROUTE;
+    const [repo, setRepo] = useState(initialRoute.repo);
+    const [selectedKey, setSelectedKey] = useState(initialRoute.selectedKey);
+    const [query, setQuery] = useState("");
+    const [view, setView] = useState(initialRoute.view);
+    const [selectedProjectId, setSelectedProjectId] = useState(undefined);
+    const [selectedRunId, setSelectedRunId] = useState(undefined);
+    const [selectedReleaseId, setSelectedReleaseId] = useState(undefined);
+    const [selectedDiscussionKey, setSelectedDiscussionKey] = useState(undefined);
+    const [selectedIssueKey, setSelectedIssueKey] = useState(initialRoute.selectedIssueKey);
+    const [showFilesDiff, setShowFilesDiff] = useState(false);
+    const [error, setError] = useState("");
+    // Set while applying a popstate-derived route, so the pushState effect below (which reacts
+    // to the same state) skips re-pushing the entry the browser just navigated to.
+    const skipNextPush = React.useRef(false);
+    // The twin's store door (`GET /twin/store/mirror` — the ONE named projection the twin
+    // declares for this console) is the only read of twin state; it is the twin's own
+    // surface on this origin, never a mirror-private endpoint.
+    async function refresh() {
+        try {
+            const response = await fetch(GITHUB_MIRROR_STORE_PATH);
+            const json = await response.json();
+            if (!response.ok)
+                throw new Error(json.error ?? "Failed to load GitHub state");
+            setPayload(json);
+            setError("");
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : String(err));
+        }
+    }
+    useEffect(() => {
+        void refresh();
+        const timer = window.setInterval(() => void refresh(), 1500);
+        return () => window.clearInterval(timer);
+    }, []);
+    // pushState on navigation: any click that changes repo/view/selection updates the address
+    // bar (no reload) to the vendor-faithful path for the new state.
+    useEffect(() => {
+        const path = pathFor({ repo, view, selectedKey, selectedIssueKey });
+        if (skipNextPush.current) {
+            skipNextPush.current = false;
+            return;
+        }
+        if (window.location.pathname !== path)
+            window.history.pushState(null, "", path);
+    }, [repo, view, selectedKey, selectedIssueKey]);
+    // popstate (back/forward): re-derive the view + selection from the restored pathname.
+    useEffect(() => {
+        function onPopState() {
+            const route = stateFor(window.location.pathname);
+            skipNextPush.current = true;
+            setRepo(route.repo);
+            setView(route.view);
+            setSelectedKey(route.selectedKey);
+            setSelectedIssueKey(route.selectedIssueKey);
+        }
+        window.addEventListener("popstate", onPopState);
+        return () => window.removeEventListener("popstate", onPopState);
+    }, []);
+    const repos = useMemo(() => Array.from(new Set((payload?.github.pullRequests ?? []).map((pr) => pr.repo))).sort(), [payload]);
+    const prs = useMemo(() => {
+        const search = query.trim().toLowerCase();
+        return (payload?.github.pullRequests ?? [])
+            .filter((pr) => repo === "all" || !repo || pr.repo === repo)
+            .filter((pr) => {
+            if (!search)
+                return true;
+            return [
+                pr.repo,
+                String(pr.number),
+                pr.title,
+                pr.author,
+                pr.sourceIssue,
+                pr.sourceIssueTitle,
+                pr.state,
+                pr.url,
+            ].filter(Boolean).join(" ").toLowerCase().includes(search);
+        })
+            .sort((a, b) => {
+            const aDate = Date.parse(a.updatedAt || a.mergedAt || a.createdAt || "");
+            const bDate = Date.parse(b.updatedAt || b.mergedAt || b.createdAt || "");
+            if (Number.isFinite(aDate) && Number.isFinite(bDate) && aDate !== bDate)
+                return bDate - aDate;
+            return Number(b.number) - Number(a.number);
+        });
+    }, [payload, query, repo]);
+    const issues = useMemo(() => {
+        const search = query.trim().toLowerCase();
+        return (payload?.github.issues ?? [])
+            .filter((issue) => repo === "all" || !repo || issue.repo === repo)
+            .filter((issue) => {
+            if (!search)
+                return true;
+            return [issue.repo, String(issue.number), issue.title, issue.state, issue.url]
+                .filter(Boolean).join(" ").toLowerCase().includes(search);
+        })
+            .sort((a, b) => {
+            const aDate = Date.parse(a.updatedAt || a.createdAt || "");
+            const bDate = Date.parse(b.updatedAt || b.createdAt || "");
+            if (Number.isFinite(aDate) && Number.isFinite(bDate) && aDate !== bDate)
+                return bDate - aDate;
+            return Number(b.number) - Number(a.number);
+        });
+    }, [payload, query, repo]);
+    const runs = useMemo(() => {
+        const search = query.trim().toLowerCase();
+        return (payload?.github.runs ?? [])
+            .filter((run) => repo === "all" || !repo || run.repo === repo)
+            .filter((run) => {
+            if (!search)
+                return true;
+            return [run.repo, String(run.runNumber), run.workflowName, run.name, run.event, run.headBranch, run.status, run.conclusion]
+                .filter(Boolean).join(" ").toLowerCase().includes(search);
+        })
+            .sort((a, b) => {
+            const aDate = Date.parse(a.updatedAt || a.createdAt || "");
+            const bDate = Date.parse(b.updatedAt || b.createdAt || "");
+            if (Number.isFinite(aDate) && Number.isFinite(bDate) && aDate !== bDate)
+                return bDate - aDate;
+            return Number(b.id) - Number(a.id);
+        });
+    }, [payload, query, repo]);
+    const jobs = payload?.github.jobs ?? [];
+    const releases = useMemo(() => {
+        const search = query.trim().toLowerCase();
+        return (payload?.github.releases ?? [])
+            .filter((rel) => repo === "all" || !repo || rel.repo === repo)
+            .filter((rel) => {
+            if (!search)
+                return true;
+            return [rel.repo, rel.tagName, rel.name, rel.body, rel.draft ? "draft" : "", rel.prerelease ? "prerelease" : ""]
+                .filter(Boolean).join(" ").toLowerCase().includes(search);
+        })
+            .sort((a, b) => {
+            const aDate = Date.parse(a.publishedAt || a.createdAt || "");
+            const bDate = Date.parse(b.publishedAt || b.createdAt || "");
+            if (Number.isFinite(aDate) && Number.isFinite(bDate) && aDate !== bDate)
+                return bDate - aDate;
+            return Number(b.id) - Number(a.id);
+        });
+    }, [payload, query, repo]);
+    const discussions = useMemo(() => {
+        const search = query.trim().toLowerCase();
+        return (payload?.github.discussions ?? [])
+            .filter((d) => repo === "all" || !repo || d.repo === repo)
+            .filter((d) => {
+            if (!search)
+                return true;
+            return [d.repo, String(d.number), d.title, d.body, d.categoryName, d.state, d.isAnswered ? "answered" : ""]
+                .filter(Boolean).join(" ").toLowerCase().includes(search);
+        })
+            .sort((a, b) => {
+            const aDate = Date.parse(a.updatedAt || a.createdAt || "");
+            const bDate = Date.parse(b.updatedAt || b.createdAt || "");
+            if (Number.isFinite(aDate) && Number.isFinite(bDate) && aDate !== bDate)
+                return bDate - aDate;
+            return Number(b.number) - Number(a.number);
+        });
+    }, [payload, query, repo]);
+    const deployments = useMemo(() => {
+        const search = query.trim().toLowerCase();
+        return (payload?.github.deployments ?? [])
+            .filter((d) => repo === "all" || !repo || d.repo === repo)
+            .filter((d) => {
+            if (!search)
+                return true;
+            return [d.repo, d.environment, d.ref, d.state, d.description].filter(Boolean).join(" ").toLowerCase().includes(search);
+        })
+            .sort((a, b) => Number(b.id) - Number(a.id));
+    }, [payload, query, repo]);
+    const environments = useMemo(() => (payload?.github.environments ?? []).filter((e) => repo === "all" || !repo || e.repo === repo), [payload, repo]);
+    // Projects v2 boards are owner-scoped (not repo-scoped) — show all when "all", else those
+    // whose owner matches the selected repo's owner. Insights/Settings are repo-scoped.
+    const projectBoards = useMemo(() => (payload?.github.projectBoards ?? []).filter((p) => repo === "all" || !repo || p.owner === repo.split("/")[0]), [payload, repo]);
+    const insights = useMemo(() => (payload?.github.insights ?? []).filter((i) => repo === "all" || !repo || i.repo === repo), [payload, repo]);
+    const settings = useMemo(() => (payload?.github.settings ?? []).filter((s) => repo === "all" || !repo || s.repo === repo), [payload, repo]);
+    const current = prs.find((pr) => prKey(pr) === selectedKey) ?? prs[0];
+    const currentReviews = current
+        ? (payload?.github.reviews ?? []).filter((review) => review.repo === current.repo && Number(review.number) === Number(current.number))
+        : [];
+    const currentCommits = current
+        ? (payload?.github.commits ?? []).filter((commit) => commit.repo === current.repo && Number(commit.number) === Number(current.number))
+        : [];
+    const currentComments = current
+        ? (payload?.github.comments ?? []).filter((comment) => comment.repo === current.repo && Number(comment.number) === Number(current.number))
+        : [];
+    const currentReviewComments = current
+        ? (payload?.github.reviewComments ?? []).filter((comment) => comment.repo === current.repo && Number(comment.number) === Number(current.number))
+        : [];
+    const currentFiles = current
+        ? (payload?.github.files ?? []).filter((file) => file.repo === current.repo && Number(file.number) === Number(current.number))
+        : [];
+    // NOTE: `selectedKey` is intentionally NOT auto-synced to `current` here (a prior version
+    // did) — `current` falling back to `prs[0]` is purely a display default for the split-pane
+    // preview; auto-writing that fallback into `selectedKey` would immediately pushState the
+    // address bar to `/pull/{n}` on every list view, which is not vendor-faithful (GitHub's
+    // `/pulls` list never auto-navigates into a PR). `selectedKey` only changes on an explicit
+    // row click or a deep link (`stateFor`), so the URL only reflects a PR the user actually
+    // opened. The legacy `?repo=&pr=|number=|url=` query-param deep-link mechanism this effect
+    // used to implement is REPLACED by real path routing (see pathFor/stateFor above) — no
+    // dual/legacy path.
+    return (_jsxs("main", { className: "browser-shell", children: [_jsxs("section", { className: "browser-tabs", "aria-label": "Repository browser tabs", children: [_jsxs("button", { className: `browser-tab ${repo === "all" ? "active" : ""}`, onClick: () => {
+                            setRepo("all");
+                            setSelectedKey("");
+                        }, children: [_jsx("span", { children: "All repositories" }), _jsx("strong", { children: payload?.github.pullRequests?.length ?? 0 })] }), repos.map((name) => {
+                        const count = (payload?.github.pullRequests ?? []).filter((pr) => pr.repo === name).length;
+                        return (_jsxs("button", { className: `browser-tab ${name === repo ? "active" : ""}`, onClick: () => {
+                                setRepo(name);
+                                setSelectedKey("");
+                            }, children: [_jsx("span", { children: name }), _jsx("strong", { children: count })] }, name));
+                    })] }), _jsxs("section", { className: "browser-address", children: [_jsx("span", { className: "browser-dot red" }), _jsx("span", { className: "browser-dot yellow" }), _jsx("span", { className: "browser-dot green" }), _jsxs("div", { className: "address-bar", children: ["github.local", pathFor({ repo, view, selectedKey, selectedIssueKey })] })] }), _jsxs("section", { className: "github-shell", children: [_jsxs("header", { className: "global-header", children: [_jsx("div", { className: "octo", children: "GH" }), _jsx("input", { className: "search", value: "Search or jump to...", readOnly: true }), _jsxs("nav", { className: "global-nav", children: [_jsx("span", { children: "Pull requests" }), _jsx("span", { children: "Issues" }), _jsx("span", { children: "Marketplace" }), _jsx("span", { children: "Explore" })] }), _jsx("div", { className: "global-spacer" }), _jsx("span", { className: "pill-dark", children: "mock github" })] }), _jsxs("section", { className: "repo-head", children: [_jsx("div", { className: "repo-line", children: repo === "all" ? (_jsxs(_Fragment, { children: [_jsx("button", { children: "all" }), _jsx("span", { children: "/" }), _jsx("strong", { children: "repositories" })] })) : (_jsxs(_Fragment, { children: [_jsx("button", { children: repo.split("/")[0] || "owner" }), _jsx("span", { children: "/" }), _jsx("strong", { children: repo.split("/")[1] || "repository" })] })) }), _jsxs("nav", { className: "repo-tabs", children: [_jsx("button", { children: "Code" }), _jsxs("button", { className: view === "issues" ? "active" : "", onClick: () => setView("issues"), children: ["Issues ", _jsx("span", { className: "count", children: issues.length })] }), _jsxs("button", { className: view === "pulls" ? "active" : "", onClick: () => setView("pulls"), children: ["Pull requests ", _jsx("span", { className: "count", children: prs.length })] }), _jsxs("button", { className: view === "actions" ? "active" : "", onClick: () => setView("actions"), children: ["Actions ", _jsx("span", { className: "count", children: runs.length })] }), _jsxs("button", { className: view === "releases" ? "active" : "", onClick: () => setView("releases"), children: ["Releases ", _jsx("span", { className: "count", children: releases.length })] }), _jsxs("button", { className: view === "discussions" ? "active" : "", onClick: () => setView("discussions"), children: ["Discussions ", _jsx("span", { className: "count", children: discussions.length })] }), _jsxs("button", { className: view === "code" ? "active" : "", onClick: () => setView("code"), children: ["Code ", _jsx("span", { className: "count", children: (payload?.github.contents ?? []).length })] }), _jsx("button", { className: view === "search" ? "active" : "", onClick: () => setView("search"), children: "Search" }), _jsxs("button", { className: view === "notifications" ? "active" : "", onClick: () => setView("notifications"), children: ["Notifications ", _jsx("span", { className: "count", children: (payload?.github.notifications ?? []).filter((n) => n.unread).length })] }), _jsxs("button", { className: view === "deployments" ? "active" : "", onClick: () => setView("deployments"), children: ["Deployments ", _jsx("span", { className: "count", children: deployments.length })] }), _jsxs("button", { className: view === "projects" ? "active" : "", onClick: () => setView("projects"), children: ["Projects ", _jsx("span", { className: "count", children: projectBoards.length })] }), _jsx("button", { children: "Security" }), _jsx("button", { className: view === "insights" ? "active" : "", onClick: () => setView("insights"), children: "Insights" }), _jsxs("button", { className: view === "settings" ? "active" : "", onClick: () => setView("settings"), children: ["Settings ", _jsx("span", { className: "count", children: settings.length })] })] })] }), _jsxs("div", { className: "content", children: [error ? _jsx("div", { className: "error", children: error }) : null, _jsxs("div", { className: "toolbar", children: [_jsx("input", { className: "pr-filter", value: query, onChange: (event) => setQuery(event.target.value), placeholder: view === "issues" ? "Search issues by title, number, repo" : view === "actions" ? "Search runs by workflow, number, branch, status" : view === "releases" ? "Search releases by tag, name, draft/prerelease" : view === "discussions" ? "Search discussions by title, category, answered" : "Search PRs by title, number, repo, issue, author" }), _jsx("button", { className: "new-pr", children: view === "issues" ? "New issue" : view === "actions" ? "Run workflow" : view === "releases" ? "Draft a new release" : view === "discussions" ? "New discussion" : "New pull request" })] }), view === "issues" ? (_jsxs("div", { className: "split", children: [_jsx("main", { children: _jsx(IssuesTable, { issues: issues, onSelect: setSelectedIssueKey }) }), _jsx(IssueDetail, { issue: issues.find((i) => `${i.repo}#${i.number}` === selectedIssueKey) ?? issues[0] })] })) : view === "actions" ? (_jsx(ActionsView, { runs: runs, jobs: jobs, selectedRunId: selectedRunId, onSelect: setSelectedRunId })) : view === "releases" ? (_jsx(ReleasesView, { releases: releases, selectedReleaseId: selectedReleaseId, onSelect: setSelectedReleaseId })) : view === "discussions" ? (_jsx(DiscussionsView, { discussions: discussions, selectedKey: selectedDiscussionKey, onSelect: setSelectedDiscussionKey })) : view === "code" ? (_jsx(CodeBrowser, { contents: (payload?.github.contents ?? []).filter((c) => repo === "all" || !repo || c.repo === repo) })) : view === "search" ? (_jsx(SearchView, { query: query, prs: payload?.github.pullRequests ?? [], issues: payload?.github.issues ?? [], contents: payload?.github.contents ?? [] })) : view === "notifications" ? (_jsx(NotificationsView, { notifications: (payload?.github.notifications ?? []).filter((n) => repo === "all" || !repo || n.repo === repo) })) : view === "deployments" ? (_jsx(DeploymentsView, { deployments: deployments, environments: environments })) : view === "projects" ? (_jsx(ProjectBoardView, { boards: projectBoards, selectedId: selectedProjectId, onSelect: setSelectedProjectId })) : view === "insights" ? (_jsx(InsightsView, { insights: insights })) : view === "settings" ? (_jsx(SettingsView, { settings: settings })) : (_jsxs("div", { className: "split", children: [_jsxs("main", { children: [_jsx(PrList, { prs: prs, reviews: payload?.github.reviews ?? [], selectedKey: selectedKey, onSelect: setSelectedKey }), _jsxs("div", { className: "pr-tabs", children: [_jsx("button", { className: showFilesDiff ? "" : "active", onClick: () => setShowFilesDiff(false), children: "Conversation" }), _jsxs("button", { className: showFilesDiff ? "active" : "", onClick: () => setShowFilesDiff(true), children: ["Files changed ", _jsx("span", { className: "count", children: current?.changedFiles ?? currentFiles.length })] })] }), showFilesDiff ? (_jsx(FilesDiff, { files: currentFiles })) : (_jsx(Conversation, { pr: current, reviews: currentReviews, commits: currentCommits, comments: currentComments, reviewComments: currentReviewComments, files: currentFiles }))] }), _jsx(Aside, { pr: current, reviews: currentReviews, commits: currentCommits, files: currentFiles })] }))] })] })] }));
+}
+export function PrList({ prs, reviews, selectedKey, onSelect }) {
+    return (_jsxs("section", { className: "list-box", children: [_jsxs("div", { className: "list-head", children: [_jsx("span", { children: _jsxs("strong", { children: [prs.length, " pull requests"] }) }), _jsx("span", { children: "Updated" })] }), prs.length ? prs.map((pr) => {
+                const approvedCount = reviews.filter((review) => review.repo === pr.repo && Number(review.number) === Number(pr.number) && review.state === "approved").length;
+                const state = pr.merged ? "merged" : (pr.state ?? "open");
+                return (_jsxs("button", { className: `pr-row ${prKey(pr) === selectedKey ? "active" : ""}`, onClick: () => onSelect?.(prKey(pr)), children: [_jsx("span", { className: `status-icon ${state}`, children: "o" }), _jsxs("span", { children: [_jsx("span", { className: "pr-title", children: pr.title || pr.url || `${pr.repo}#${pr.number}` }), _jsxs("div", { className: "pr-meta", children: [pr.repo, " #", pr.number, " \u00B7 ", state, pr.author ? ` · opened by ${pr.author}` : "", pr.updatedAt ? ` · updated ${new Date(pr.updatedAt).toLocaleString()}` : pr.createdAt ? ` · ${new Date(pr.createdAt).toLocaleString()}` : "", pr.sourceIssue ? ` · ${pr.sourceIssue}` : "", pr.changedFiles != null ? ` · ${pr.changedFiles} files` : "", pr.commitsCount != null ? ` · ${pr.commitsCount} commits` : ""] })] }), _jsxs("span", { className: "labels", children: [_jsx(CiStatus, { status: pr.ciStatus }), _jsx("span", { className: `state-badge ${state}`, children: state }), approvedCount ? _jsxs("span", { className: "label approved", children: [approvedCount, " approved"] }) : null, pr.milestone ? _jsxs("span", { className: "label milestone", title: "Milestone", children: ["\uD83C\uDFF7 ", pr.milestone] }) : null, (pr.labels ?? []).slice(0, 2).map((label) => label.name ? _jsx("span", { className: "label", children: label.name }, label.name) : null), (pr.assignees ?? []).slice(0, 2).map((login) => _jsxs("span", { className: "label assignee", children: ["@", login] }, login))] })] }, prKey(pr)));
+            }) : _jsx("div", { className: "empty", children: "No pull requests match this view." })] }));
+}
+export function IssuesTable({ issues, onSelect }) {
+    return (_jsxs("section", { className: "list-box issues-box", children: [_jsxs("div", { className: "list-head", children: [_jsx("span", { children: _jsxs("strong", { children: [issues.length, " issues"] }) }), _jsx("span", { children: "Updated" })] }), issues.length ? issues.map((issue) => {
+                const state = issue.state ?? "open";
+                return (_jsxs("button", { className: "pr-row issue-row", onClick: () => onSelect?.(`${issue.repo}#${issue.number}`), children: [_jsx("span", { className: `status-icon ${state === "closed" ? "closed" : "open"}`, children: "!" }), _jsxs("span", { children: [_jsx("span", { className: "pr-title", children: issue.title || issue.url || `${issue.repo}#${issue.number}` }), _jsxs("div", { className: "pr-meta", children: [issue.repo, " #", issue.number, " \u00B7 ", state, issue.updatedAt ? ` · updated ${new Date(issue.updatedAt).toLocaleString()}` : issue.createdAt ? ` · ${new Date(issue.createdAt).toLocaleString()}` : ""] }), (issue.linked ?? []).length ? (_jsxs("div", { className: "linked-issues", children: ["linked:", " ", (issue.linked ?? []).map((link, idx) => (_jsxs("a", { className: "linked-ref", href: link.url, target: "_blank", rel: "noreferrer", children: [link.type === "pull_request" ? "PR" : "issue", " #", link.number] }, `linked-${idx}`)))] })) : null] }), _jsxs("span", { className: "labels", children: [_jsx("span", { className: `state-badge ${state}`, children: state }), issue.milestone ? _jsxs("span", { className: "label milestone", title: "Milestone", children: ["\uD83C\uDFF7 ", issue.milestone] }) : null, (issue.labels ?? []).slice(0, 3).map((label) => label.name ? _jsx("span", { className: "label", children: label.name }, label.name) : null), (issue.assignees ?? []).slice(0, 2).map((login) => _jsxs("span", { className: "label assignee", children: ["@", login] }, login))] })] }, `${issue.repo}#${issue.number}`));
+            }) : _jsx("div", { className: "empty", children: "No issues match this view." })] }));
+}
+// The PR Files-changed DIFF view: renders each changed file's unified-diff hunks as
+// +/- lines (the GitHub "Files changed" tab). Hunk text comes from the LOCAL PR write's
+// `patch`; observed PRs carry no per-file diff, so a file with no patch shows a summary row
+// only (no fabricated hunks). Each diff line is classed add/del/context so it renders like GitHub.
+export function FilesDiff({ files }) {
+    if (!files.length)
+        return _jsx("div", { className: "empty", children: "No file diffs in this snapshot." });
+    return (_jsxs("section", { className: "files-diff", "data-testid": "files-diff", children: [_jsxs("h3", { children: ["Files changed ", _jsx("span", { className: "count", children: files.length })] }), files.map((file) => (_jsxs("article", { className: "diff-file", children: [_jsxs("div", { className: "diff-file-head", children: [_jsx("span", { className: `diff-status ${file.status ?? "modified"}`, children: file.status ?? "modified" }), _jsx("strong", { className: "diff-filename", children: file.filename }), _jsxs("span", { className: "diff-stat", children: ["+", file.additions ?? 0, " \u2212", file.deletions ?? 0] })] }), file.patch ? (_jsx("pre", { className: "diff-hunk", "data-testid": "diff-hunk", children: file.patch.split("\n").map((line, idx) => {
+                            const cls = line.startsWith("+") && !line.startsWith("+++") ? "diff-line-add"
+                                : line.startsWith("-") && !line.startsWith("---") ? "diff-line-del"
+                                    : line.startsWith("@@") ? "diff-line-hunk" : "diff-line-ctx";
+                            return _jsx("div", { className: cls, children: line || " " }, idx);
+                        }) })) : (_jsx("div", { className: "sha diff-no-patch", children: "No diff hunk in snapshot (observed PRs carry counts only)." }))] }, `${file.repo}#${file.number}#${file.filename}`)))] }));
+}
+// The Issue DETAIL page: the selected issue's header (state/labels/assignees/milestone),
+// its derived state-change Timeline (labeled/assigned/locked/closed events), and its
+// comments feed. Mirrors GitHub's single-issue screen. Observed comments are labelled.
+export function IssueDetail({ issue }) {
+    if (!issue)
+        return _jsx("div", { className: "empty", children: "Select an issue." });
+    const state = issue.state ?? "open";
+    return (_jsxs("section", { className: "issue-detail", "data-testid": "issue-detail", children: [_jsxs("h2", { children: [issue.title || `${issue.repo}#${issue.number}`, " ", _jsxs("span", { children: ["#", issue.number] })] }), _jsxs("div", { className: "state-line", children: [_jsxs("span", { className: `state-badge ${state}`, children: [state, issue.stateReason ? ` (${issue.stateReason})` : ""] }), issue.locked ? _jsx("span", { className: "label", title: "Locked", children: "\uD83D\uDD12 locked" }) : null, _jsx("strong", { children: issue.repo }), issue.milestone ? _jsxs("span", { className: "label milestone", title: "Milestone", children: ["\uD83C\uDFF7 ", issue.milestone] }) : null, issue.url ? _jsx("a", { className: "branch", href: issue.url, target: "_blank", rel: "noreferrer", children: "View on GitHub" }) : null] }), _jsxs("div", { className: "meta-row", children: [(issue.labels ?? []).map((l) => l.name ? _jsx("span", { className: "label", children: l.name }, l.name) : null), (issue.assignees ?? []).map((login) => _jsxs("span", { className: "label assignee", children: ["@", login] }, login))] }), _jsxs("article", { className: "comment", children: [_jsx("div", { className: "comment-head", children: _jsx("strong", { children: "opened this issue" }) }), _jsx("div", { className: "comment-body", children: issue.body || "No issue body in snapshot." })] }), _jsxs("section", { className: "snapshot-section issue-timeline", "data-testid": "issue-timeline", children: [_jsx("h3", { children: "Timeline" }), (issue.timeline ?? []).length ? (issue.timeline ?? []).map((ev, idx) => (_jsxs("div", { className: "timeline-event", children: [_jsx("span", { className: "event-kind", children: ev.event }), ev.detail ? _jsxs("span", { className: "event-detail", children: [" ", ev.detail] }) : null] }, `tl-${idx}`))) : _jsx("p", { className: "sha", children: "No timeline events." })] }), _jsxs("section", { className: "snapshot-section", children: [_jsxs("h3", { children: ["Comments ", _jsx("span", { className: "count", children: (issue.comments ?? []).length })] }), (issue.comments ?? []).length ? (issue.comments ?? []).map((c) => (_jsxs("article", { className: "comment issue-detail-comment", "data-testid": "issue-detail-comment", children: [_jsxs("div", { className: "comment-head", children: [_jsx("strong", { children: c.author || "GitHub user" }), " commented ", c.createdAt ? new Date(c.createdAt).toLocaleString() : ""] }), _jsx("div", { className: "comment-body", children: c.body || "" })] }, `c-${c.id}`))) : _jsx("p", { className: "sha", children: "No comments." })] })] }));
+}
+export function CodeBrowser({ contents }) {
+    if (!contents.length)
+        return _jsx("div", { className: "empty", "data-testid": "code-browser", children: "No files in this snapshot." });
+    const dirs = new Set();
+    for (const c of contents) {
+        const parts = c.path.split("/");
+        for (let i = 1; i < parts.length; i++)
+            dirs.add(parts.slice(0, i).join("/"));
+    }
+    return (_jsxs("section", { className: "code-browser", "data-testid": "code-browser", children: [_jsxs("h3", { children: ["Code ", _jsxs("span", { className: "count", children: [contents.length, " files"] })] }), _jsxs("div", { className: "file-tree", "data-testid": "file-tree", children: [[...dirs].sort().map((d) => (_jsxs("div", { className: "tree-row tree-dir", "data-testid": "tree-dir", children: ["\uD83D\uDCC1 ", d] }, `d-${d}`))), contents.map((c) => (_jsxs("div", { className: "tree-row tree-file", "data-testid": "tree-file", children: [_jsxs("span", { children: ["\uD83D\uDCC4 ", c.path] }), _jsxs("span", { className: "sha", children: [c.size ?? 0, " bytes"] })] }, `${c.repo}#${c.path}`)))] })] }));
+}
+// The global Search results screen — filters PRs/issues/repos files by the query. Mirrors
+// GitHub's search page (a single box over multiple result kinds). Local, over the snapshot.
+export function SearchView({ query, prs, issues, contents }) {
+    const q = query.trim().toLowerCase();
+    const match = (...vals) => q === "" || vals.some((v) => (v ?? "").toLowerCase().includes(q));
+    const prHits = prs.filter((p) => match(p.title, p.repo));
+    const issueHits = issues.filter((i) => match(i.title, i.repo));
+    const codeHits = contents.filter((c) => match(c.path, c.repo));
+    const total = prHits.length + issueHits.length + codeHits.length;
+    return (_jsxs("section", { className: "search-view", "data-testid": "search-view", children: [_jsxs("h3", { children: ["Search results ", _jsx("span", { className: "count", children: total })] }), _jsxs("div", { className: "search-group", "data-testid": "search-prs", children: [_jsxs("h4", { children: ["Pull requests (", prHits.length, ")"] }), prHits.map((p) => _jsxs("div", { className: "search-hit", children: [p.repo, " #", p.number, " \u00B7 ", p.title] }, `p-${p.repo}#${p.number}`))] }), _jsxs("div", { className: "search-group", "data-testid": "search-issues", children: [_jsxs("h4", { children: ["Issues (", issueHits.length, ")"] }), issueHits.map((i) => _jsxs("div", { className: "search-hit", children: [i.repo, " #", i.number, " \u00B7 ", i.title] }, `i-${i.repo}#${i.number}`))] }), _jsxs("div", { className: "search-group", "data-testid": "search-code", children: [_jsxs("h4", { children: ["Code (", codeHits.length, ")"] }), codeHits.map((c) => _jsxs("div", { className: "search-hit", children: [c.repo, " \u00B7 ", c.path] }, `c-${c.repo}#${c.path}`))] })] }));
+}
+export function NotificationsView({ notifications }) {
+    if (!notifications.length)
+        return _jsx("div", { className: "empty", "data-testid": "notifications-view", children: "No notifications." });
+    return (_jsxs("section", { className: "notifications-view", "data-testid": "notifications-view", children: [_jsxs("h3", { children: ["Notifications ", _jsxs("span", { className: "count", children: [notifications.filter((n) => n.unread).length, " unread"] })] }), notifications.map((n) => (_jsxs("div", { className: `notification-row ${n.unread ? "unread" : "read"}`, "data-testid": "notification-row", children: [n.unread ? _jsx("span", { className: "unread-dot", "data-testid": "unread-dot", children: "\u25CF" }) : _jsx("span", { className: "read-dot", children: "\u25CB" }), _jsxs("span", { className: "notif-subject", children: [_jsx("strong", { children: n.title }), " ", _jsx("span", { className: "sha", children: n.type })] }), _jsx("span", { className: "notif-reason label", children: n.reason }), _jsx("span", { className: "sha", children: n.repo })] }, n.id)))] }));
+}
+// The Deployments view (the repo's Deployments/Environments screen). Models the Deployments
+// API objects — each deployment carries its environment, ref, and LATEST status (the
+// deployment's state), plus a per-environment protection summary. Maps GitHub's Environments
+// view: most-recent deployments with their state badge + the environment list.
+export function DeploymentState({ state }) {
+    const s = (state || "pending").toLowerCase();
+    const cls = s === "success" ? "success" : (s === "failure" || s === "error" ? "failure" : (s === "inactive" ? "inactive" : "pending"));
+    return _jsx("span", { className: `deployment-state ${cls}`, "data-testid": "deployment-state", title: `deployment: ${s}`, children: s });
+}
+export function DeploymentsView({ deployments, environments }) {
+    if (!deployments.length && !environments.length)
+        return _jsx("div", { className: "empty", "data-testid": "deployments-view", children: "No deployments." });
+    return (_jsxs("section", { className: "deployments-view", "data-testid": "deployments-view", children: [environments.length ? (_jsxs("div", { className: "environments-list", "data-testid": "environments-list", children: [_jsxs("h3", { children: ["Environments ", _jsx("span", { className: "count", children: environments.length })] }), environments.map((env) => (_jsxs("div", { className: "environment-row", "data-testid": "environment-row", children: [_jsx("span", { className: "environment-name", children: _jsx("strong", { children: env.name }) }), _jsx("span", { className: "sha", children: env.repo }), env.protected ? (_jsxs("span", { className: "environment-protected label", "data-testid": "environment-protected", children: ["protected", env.waitTimer ? ` · ${env.waitTimer}m wait` : "", env.reviewers && env.reviewers.length ? ` · ${env.reviewers.length} reviewers` : ""] })) : _jsx("span", { className: "label", children: "no protection rules" })] }, `${env.repo}#${env.name}`)))] })) : null, _jsxs("div", { className: "deployments-list", children: [_jsxs("h3", { children: ["Deployments ", _jsx("span", { className: "count", children: deployments.length })] }), deployments.length ? deployments.map((d) => (_jsxs("div", { className: "deployment-row", "data-testid": "deployment-row", children: [_jsx(DeploymentState, { state: d.state }), _jsxs("span", { className: "deployment-env label", "data-testid": "deployment-env", children: [d.environment, d.production ? " · production" : ""] }), _jsxs("span", { className: "deployment-ref", children: [_jsx("strong", { children: d.ref }), _jsxs("div", { className: "deployment-meta", children: [d.repo, " \u00B7 deploy #", d.id, d.sha ? ` · ${shortSha(d.sha)}` : "", d.description ? ` · ${d.description}` : ""] })] }), d.environmentUrl ? _jsx("a", { className: "branch", href: d.environmentUrl, target: "_blank", rel: "noreferrer", children: "View deployment" }) : null] }, d.id))) : _jsx("div", { className: "empty", children: "No deployments yet." })] })] }));
+}
+// The Projects v2 board view (GitHub Projects). Renders the selected project's BOARD: its
+// Status field's options as COLUMNS (swim-lanes) with the items grouped into them by their
+// Status value, plus a "No Status" lane. Data-coupled: the column card counts come straight
+// from the modeled project items + their field values (seeding items moves the counts).
+export function ProjectBoardView({ boards, selectedId, onSelect }) {
+    if (!boards.length)
+        return _jsx("div", { className: "empty", "data-testid": "project-board-view", children: "No projects." });
+    const board = boards.find((b) => b.id === selectedId) ?? boards[0];
+    const columns = [...board.columns, board.noStatus];
+    return (_jsxs("section", { className: "project-board-view", "data-testid": "project-board-view", children: [_jsxs("div", { className: "project-list", children: [_jsxs("h3", { children: ["Projects ", _jsx("span", { className: "count", children: boards.length })] }), boards.map((b) => (_jsxs("div", { className: `project-row${b.id === board.id ? " active" : ""}`, "data-testid": "project-row", onClick: () => onSelect(b.id), children: [_jsxs("span", { className: "project-title", children: [_jsx("strong", { children: b.title }), " #", b.number] }), _jsxs("span", { className: "project-item-count label", "data-testid": "project-item-count", children: [b.itemCount, " items"] }), b.closed ? _jsx("span", { className: "label", children: "closed" }) : null, _jsx("span", { className: "sha", children: b.owner })] }, b.id)))] }), _jsxs("div", { className: "project-board", "data-testid": "project-board", children: [_jsx("div", { className: "project-views", children: board.views.map((v) => _jsxs("span", { className: "project-view label", "data-testid": "project-view", children: [v.name, " (", v.layout, ")"] }, v.number)) }), _jsx("div", { className: "board-columns", "data-testid": "board-columns", children: columns.map((col) => (_jsxs("div", { className: "board-column", "data-testid": "board-column", children: [_jsxs("div", { className: "board-column-head", children: [_jsx("strong", { children: col.name }), " ", _jsx("span", { className: "count", "data-testid": "board-column-count", children: col.cards.length })] }), col.cards.map((card) => (_jsxs("div", { className: "board-card", "data-testid": "board-card", children: [_jsx("span", { className: "board-card-title", children: card.title }), _jsx("span", { className: "board-card-type label", children: card.contentType })] }, card.id)))] }, col.name))) })] })] }));
+}
+// The Insights / Pulse / Contributors screen. Pulse summarizes activity (merged/open PRs,
+// opened/closed issues); Contributors is a commit leaderboard. Data-coupled: every count is
+// derived from the modeled PRs/issues/commits the twin tracks (new objects move the numbers).
+export function InsightsView({ insights }) {
+    if (!insights.length)
+        return _jsx("div", { className: "empty", "data-testid": "insights-view", children: "No insights." });
+    return (_jsx("section", { className: "insights-view", "data-testid": "insights-view", children: insights.map((ins) => (_jsxs("div", { className: "insights-repo", "data-testid": "insights-repo", children: [_jsx("h3", { children: ins.repo }), _jsxs("div", { className: "pulse", "data-testid": "pulse", children: [_jsxs("span", { className: "pulse-stat", "data-testid": "pulse-merged-prs", children: [ins.pulse.mergedPrs, " Merged pull requests"] }), _jsxs("span", { className: "pulse-stat", "data-testid": "pulse-open-prs", children: [ins.pulse.openPrs, " Open pull requests"] }), _jsxs("span", { className: "pulse-stat", "data-testid": "pulse-closed-issues", children: [ins.pulse.closedIssues, " Closed issues"] }), _jsxs("span", { className: "pulse-stat", "data-testid": "pulse-open-issues", children: [ins.pulse.openedIssues, " New issues"] })] }), _jsxs("div", { className: "contributors", "data-testid": "contributors", children: [_jsx("h4", { children: "Contributors" }), ins.contributors.length ? ins.contributors.map((c) => (_jsxs("div", { className: "contributor-row", "data-testid": "contributor-row", children: [_jsx("span", { className: "contributor-login", children: _jsx("strong", { children: c.login }) }), _jsxs("span", { className: "contributor-commits label", "data-testid": "contributor-commits", children: [c.commits, " commits"] })] }, c.login))) : _jsx("div", { className: "empty", children: "No commit data." })] })] }, ins.repo))) }));
+}
+// The repo Settings screens (General / Collaborators / Webhooks / Branches). Data-coupled:
+// every row + flag is read from the modeled repo config + collaborators/webhooks/branches
+// (adding a collaborator or webhook moves the rows/counts this screen renders).
+export function SettingsView({ settings }) {
+    if (!settings.length)
+        return _jsx("div", { className: "empty", "data-testid": "settings-view", children: "No repositories." });
+    return (_jsx("section", { className: "settings-view", "data-testid": "settings-view", children: settings.map((s) => (_jsxs("div", { className: "settings-repo", "data-testid": "settings-repo", children: [_jsxs("h3", { children: [s.repo, " settings"] }), _jsxs("div", { className: "settings-general", "data-testid": "settings-general", children: [_jsxs("span", { className: "label", "data-testid": "settings-default-branch", children: ["default branch: ", s.general.defaultBranch ?? "main"] }), _jsx("span", { className: "label", children: s.general.private ? "private" : "public" }), s.general.hasIssues ? _jsx("span", { className: "label", children: "Issues" }) : null, s.general.hasProjects ? _jsx("span", { className: "label", children: "Projects" }) : null, s.general.hasWiki ? _jsx("span", { className: "label", children: "Wiki" }) : null, s.general.hasDiscussions ? _jsx("span", { className: "label", children: "Discussions" }) : null] }), _jsxs("div", { className: "settings-section", "data-testid": "settings-collaborators", children: [_jsxs("h4", { children: ["Manage access ", _jsx("span", { className: "count", "data-testid": "collaborators-count", children: s.collaborators.length })] }), s.collaborators.map((c) => (_jsxs("div", { className: "collaborator-row", "data-testid": "collaborator-row", children: [_jsx("strong", { children: c.login }), " ", _jsx("span", { className: "label", children: c.permission })] }, c.login)))] }), _jsxs("div", { className: "settings-section", "data-testid": "settings-webhooks", children: [_jsxs("h4", { children: ["Webhooks ", _jsx("span", { className: "count", "data-testid": "webhooks-count", children: s.webhooks.length })] }), s.webhooks.map((h) => (_jsxs("div", { className: "webhook-row", "data-testid": "webhook-row", children: [_jsx("span", { className: "webhook-url", children: h.url ?? "(no url)" }), _jsx("span", { className: "label", children: h.active ? "active" : "inactive" }), _jsx("span", { className: "label", children: h.events.join(", ") })] }, h.id)))] }), _jsxs("div", { className: "settings-section", "data-testid": "settings-branches", children: [_jsxs("h4", { children: ["Branches ", _jsx("span", { className: "count", "data-testid": "branches-count", children: s.branches.length })] }), s.branches.map((b) => (_jsxs("div", { className: "branch-row", "data-testid": "branch-row", children: [_jsx("strong", { children: b.name }), " ", b.protected ? _jsx("span", { className: "label", "data-testid": "branch-protected", children: "protected" }) : null] }, b.name)))] })] }, s.repo))) }));
+}
+// The Actions view: a workflow-runs list (status/conclusion badge per run, run number,
+// workflow name, branch, sha) and, on selecting a run, a detail pane with its jobs +
+// each job's steps. Models the Actions API objects — the only Actions non-goal is running
+// real CI, so runs/jobs render with the status/conclusion the twin tracks (no live logs).
+export function ActionsView({ runs, jobs, selectedRunId, onSelect }) {
+    const selected = runs.find((r) => r.id === selectedRunId) ?? runs[0];
+    const selectedJobs = selected ? jobs.filter((j) => j.repo === selected.repo && Number(j.runId) === Number(selected.id)) : [];
+    return (_jsxs("div", { className: "actions-view split", children: [_jsxs("section", { className: "list-box actions-box", children: [_jsxs("div", { className: "list-head", children: [_jsx("span", { children: _jsxs("strong", { children: [runs.length, " workflow runs"] }) }), _jsx("span", { children: "Status" })] }), runs.length ? runs.map((run) => {
+                        const effective = run.status === "completed" ? (run.conclusion || "completed") : (run.status || "queued");
+                        return (_jsxs("button", { className: `run-row ${run.id === (selected?.id) ? "active" : ""}`, onClick: () => onSelect?.(run.id), children: [_jsx(RunStatusBadge, { status: run.status, conclusion: run.conclusion }), _jsxs("span", { children: [_jsx("span", { className: "run-title", children: run.workflowName || run.name || `Run #${run.runNumber}` }), _jsxs("div", { className: "run-meta", children: [run.repo, " \u00B7 run #", run.runNumber, " \u00B7 ", run.event || "workflow_dispatch", run.headBranch ? ` · ${run.headBranch}` : "", run.headSha ? ` · ${shortSha(run.headSha)}` : "", ` · ${effective}`, run.jobCount != null ? ` · ${run.jobCount} jobs` : ""] })] })] }, run.id));
+                    }) : _jsx("div", { className: "empty", children: "No workflow runs in this view." })] }), _jsx("section", { className: "conversation run-detail", children: selected ? (_jsxs(_Fragment, { children: [_jsxs("h2", { children: [selected.workflowName || selected.name || `Run #${selected.runNumber}`, " ", _jsxs("span", { children: ["#", selected.runNumber] })] }), _jsxs("div", { className: "state-line", children: [_jsx(RunStatusBadge, { status: selected.status, conclusion: selected.conclusion }), _jsx("strong", { children: selected.repo }), _jsxs("span", { className: "sha", children: [selected.event || "workflow_dispatch", selected.headBranch ? ` · ${selected.headBranch}` : "", selected.headSha ? ` · ${shortSha(selected.headSha)}` : ""] }), selected.url ? _jsx("a", { className: "branch", href: selected.url, target: "_blank", rel: "noreferrer", children: "View on GitHub" }) : null] }), _jsxs("section", { className: "snapshot-section", children: [_jsx("h3", { children: "Jobs" }), _jsx("div", { className: "job-list", children: selectedJobs.length ? selectedJobs.map((job) => (_jsxs("div", { className: "job-row", children: [_jsxs("div", { className: "job-head", children: [_jsx(RunStatusBadge, { status: job.status, conclusion: job.conclusion }), _jsx("strong", { children: job.name })] }), (job.steps ?? []).length ? (_jsx("ol", { className: "step-list", children: (job.steps ?? []).map((step) => (_jsxs("li", { className: "step-row", children: [_jsx(RunStatusBadge, { status: step.status, conclusion: step.conclusion }), " ", step.name] }, step.number))) })) : null] }, job.id))) : _jsx("p", { className: "sha", children: "No jobs in this run." }) })] })] })) : _jsx("div", { className: "empty", children: "Select a workflow run." }) })] }));
+}
+function fmtBytes(size) {
+    if (!size)
+        return "0 B";
+    if (size < 1024)
+        return `${size} B`;
+    if (size < 1024 * 1024)
+        return `${(size / 1024).toFixed(1)} KB`;
+    return `${(size / (1024 * 1024)).toFixed(1)} MB`;
+}
+// A release-channel badge: a draft release, a prerelease, or the published "Latest"/release.
+export function ReleaseBadge({ draft, prerelease }) {
+    const kind = draft ? "draft" : prerelease ? "prerelease" : "release";
+    const label = draft ? "Draft" : prerelease ? "Pre-release" : "Release";
+    return _jsx("span", { className: `release-badge ${kind}`, title: `release channel: ${kind}`, children: label });
+}
+// The Releases view: a list of releases (tag + name + draft/prerelease badge) and, on
+// selecting one, a detail pane with the release body + its ASSET catalog (name, type,
+// size, downloads). Models the Releases API objects — the only Non-goal is the asset
+// binary BYTES (declared), so assets render as metadata rows, never downloadable content.
+export function ReleasesView({ releases, selectedReleaseId, onSelect }) {
+    const selected = releases.find((r) => r.id === selectedReleaseId) ?? releases[0];
+    const assets = selected?.assets ?? [];
+    return (_jsxs("div", { className: "releases-view split", children: [_jsxs("section", { className: "list-box releases-box", children: [_jsxs("div", { className: "list-head", children: [_jsx("span", { children: _jsxs("strong", { children: [releases.length, " releases"] }) }), _jsx("span", { children: "Published" })] }), releases.length ? releases.map((rel) => (_jsxs("button", { className: `release-row ${rel.id === (selected?.id) ? "active" : ""}`, onClick: () => onSelect?.(rel.id), children: [_jsxs("span", { className: "release-tag", children: ["\uD83C\uDFF7 ", rel.tagName] }), _jsxs("span", { children: [_jsx("span", { className: "release-title", children: rel.name || rel.tagName }), _jsxs("div", { className: "release-meta", children: [rel.repo, rel.publishedAt ? ` · published ${new Date(rel.publishedAt).toLocaleString()}` : rel.createdAt ? ` · created ${new Date(rel.createdAt).toLocaleString()}` : "", (rel.assets ?? []).length ? ` · ${(rel.assets ?? []).length} assets` : ""] })] }), _jsx("span", { className: "labels", children: _jsx(ReleaseBadge, { draft: rel.draft, prerelease: rel.prerelease }) })] }, rel.id))) : _jsx("div", { className: "empty", children: "No releases in this view." })] }), _jsx("section", { className: "conversation release-detail", children: selected ? (_jsxs(_Fragment, { children: [_jsxs("h2", { children: [selected.name || selected.tagName, " ", _jsx("span", { children: selected.tagName })] }), _jsxs("div", { className: "state-line", children: [_jsx(ReleaseBadge, { draft: selected.draft, prerelease: selected.prerelease }), _jsx("strong", { children: selected.repo }), _jsxs("span", { className: "sha", children: ["target: ", selected.targetCommitish || "main", selected.publishedAt ? ` · published ${new Date(selected.publishedAt).toLocaleString()}` : selected.draft ? " · unpublished draft" : ""] }), selected.url ? _jsx("a", { className: "branch", href: selected.url, target: "_blank", rel: "noreferrer", children: "View on GitHub" }) : null] }), _jsx("div", { className: "timeline-item", children: _jsxs("article", { className: "comment", children: [_jsx("div", { className: "comment-head", children: _jsx("strong", { children: "Release notes" }) }), _jsx("div", { className: "comment-body", children: selected.body || "No release notes." })] }) }), _jsxs("section", { className: "snapshot-section", children: [_jsx("h3", { children: "Assets" }), _jsx("div", { className: "asset-list", children: assets.length ? assets.map((asset) => (_jsxs("div", { className: "asset-row", children: [_jsx("strong", { className: "asset-name", children: asset.name }), _jsx("span", { className: "asset-type", children: asset.contentType || "application/octet-stream" }), _jsx("span", { className: "asset-size", children: fmtBytes(asset.size) }), _jsxs("span", { className: "asset-downloads", children: [asset.downloadCount ?? 0, " downloads"] })] }, asset.id))) : _jsx("p", { className: "sha", children: "No assets on this release (asset bytes are a declared Non-goal \u2014 metadata only)." }) })] })] })) : _jsx("div", { className: "empty", children: "Select a release." }) })] }));
+}
+// A discussion category chip (emoji + name). Q&A categories are answerable.
+export function DiscussionCategoryBadge({ name, emoji, answerable }) {
+    if (!name)
+        return null;
+    return _jsxs("span", { className: `discussion-category ${answerable ? "answerable" : ""}`, title: answerable ? "answerable (Q&A) category" : "category", children: [emoji ? `${emoji} ` : "", name] });
+}
+// An "answered"/"unanswered" status badge for a Q&A discussion (only shown for answerable
+// categories). Mirrors the green check GitHub shows once a discussion has an accepted answer.
+export function DiscussionAnswerBadge({ answerable, answered }) {
+    if (!answerable)
+        return null;
+    return _jsx("span", { className: `answer-badge ${answered ? "answered" : "unanswered"}`, title: answered ? "marked answered" : "awaiting an answer", children: answered ? "✓ Answered" : "Unanswered" });
+}
+// The Discussions view: a list of discussions (category + title + answered badge) and, on
+// selecting one, a detail pane with the opening post + the comment/reply thread, marking
+// the accepted answer. Models the Discussions objects (modeled over REST in the twin — a
+// declared deviation from GitHub's GraphQL Discussions API).
+export function DiscussionsView({ discussions, selectedKey, onSelect }) {
+    const keyOf = (d) => `${d.repo}#${d.number}`;
+    const selected = discussions.find((d) => keyOf(d) === selectedKey) ?? discussions[0];
+    const comments = selected?.comments ?? [];
+    const answer = comments.find((c) => c.isAnswer);
+    return (_jsxs("div", { className: "discussions-view split", children: [_jsxs("section", { className: "list-box discussions-box", children: [_jsxs("div", { className: "list-head", children: [_jsx("span", { children: _jsxs("strong", { children: [discussions.length, " discussions"] }) }), _jsx("span", { children: "Updated" })] }), discussions.length ? discussions.map((d) => (_jsxs("button", { className: `discussion-row ${keyOf(d) === (selected ? keyOf(selected) : "") ? "active" : ""}`, onClick: () => onSelect?.(keyOf(d)), children: [_jsx("span", { className: `status-icon ${d.state === "closed" ? "closed" : "open"}`, children: "\uD83D\uDCAC" }), _jsxs("span", { children: [_jsx("span", { className: "discussion-title", children: d.title || `${d.repo}#${d.number}` }), _jsxs("div", { className: "discussion-meta", children: [d.repo, " #", d.number, d.categoryName ? ` · ${d.categoryName}` : "", d.commentsCount != null ? ` · ${d.commentsCount} comments` : "", d.updatedAt ? ` · updated ${new Date(d.updatedAt).toLocaleString()}` : d.createdAt ? ` · ${new Date(d.createdAt).toLocaleString()}` : ""] })] }), _jsxs("span", { className: "labels", children: [_jsx(DiscussionCategoryBadge, { name: d.categoryName, emoji: d.categoryEmoji, answerable: d.isAnswerable }), _jsx(DiscussionAnswerBadge, { answerable: d.isAnswerable, answered: d.isAnswered }), d.locked ? _jsx("span", { className: "label locked", title: "locked", children: "\uD83D\uDD12" }) : null] })] }, keyOf(d)))) : _jsx("div", { className: "empty", children: "No discussions in this view." })] }), _jsx("section", { className: "conversation discussion-detail", children: selected ? (_jsxs(_Fragment, { children: [_jsxs("h2", { children: [selected.title || `${selected.repo}#${selected.number}`, " ", _jsxs("span", { children: ["#", selected.number] })] }), _jsxs("div", { className: "state-line", children: [_jsx(DiscussionCategoryBadge, { name: selected.categoryName, emoji: selected.categoryEmoji, answerable: selected.isAnswerable }), _jsx(DiscussionAnswerBadge, { answerable: selected.isAnswerable, answered: selected.isAnswered }), _jsx("strong", { children: selected.repo }), _jsxs("span", { className: "sha", children: [selected.state, selected.locked ? " · locked" : ""] }), selected.url ? _jsx("a", { className: "branch", href: selected.url, target: "_blank", rel: "noreferrer", children: "View on GitHub" }) : null] }), _jsx("div", { className: "timeline-item", children: _jsxs("article", { className: "comment", children: [_jsx("div", { className: "comment-head", children: _jsx("strong", { children: "Opening post" }) }), _jsx("div", { className: "comment-body", children: selected.body || "No description." })] }) }), answer ? (_jsx("div", { className: "timeline-item answer-highlight", children: _jsxs("article", { className: "comment accepted-answer", children: [_jsxs("div", { className: "comment-head", children: [_jsx("strong", { children: "\u2713 Marked as answer" }), " ", _jsxs("span", { className: "sha", children: ["comment #", answer.id] })] }), _jsx("div", { className: "comment-body", children: answer.body || "" })] }) })) : null, _jsxs("section", { className: "snapshot-section", children: [_jsx("h3", { children: "Comments" }), _jsx("div", { className: "comment-thread", children: comments.length ? comments.map((c) => (_jsxs("div", { className: `thread-comment ${c.parentId != null ? "reply" : ""} ${c.isAnswer ? "is-answer" : ""}`, children: [_jsxs("div", { className: "comment-head", children: [_jsxs("strong", { children: ["comment #", c.id] }), c.parentId != null ? _jsxs("span", { className: "sha", children: [" \u00B7 reply to #", c.parentId] }) : null, c.isAnswer ? _jsx("span", { className: "answer-badge answered", children: " \u2713 answer" }) : null, c.createdAt ? _jsxs("span", { className: "sha", children: [" \u00B7 ", new Date(c.createdAt).toLocaleString()] }) : null] }), _jsx("div", { className: "comment-body", children: c.body || "" })] }, c.id))) : _jsx("p", { className: "sha", children: "No comments yet." }) })] })] })) : _jsx("div", { className: "empty", children: "Select a discussion." }) })] }));
+}
+export function Conversation({ pr, reviews, commits, comments, reviewComments, files }) {
+    if (!pr)
+        return _jsx("div", { className: "empty", children: "Select a pull request." });
+    const state = pr.merged ? "merged" : (pr.state ?? "open");
+    const labels = pr.labels ?? [];
+    const assignees = pr.assignees ?? [];
+    return (_jsxs("section", { className: "conversation", children: [_jsxs("h2", { children: [pr.title || pr.url || `${pr.repo}#${pr.number}`, " ", _jsxs("span", { children: ["#", pr.number] })] }), _jsxs("div", { className: "state-line", children: [_jsx("span", { className: `state-badge ${state}`, children: state }), _jsx(CiStatus, { status: pr.ciStatus }), _jsx("strong", { children: pr.repo }), _jsxs("span", { className: "sha", children: [pr.changedFiles ?? 0, " files changed \u00B7 ", pr.commitsCount ?? 0, " commits \u00B7 ", pr.reviewCount ?? 0, " reviews \u00B7 ", pr.commentsCount ?? 0, " comments \u00B7 ", pr.reviewCommentsCount ?? 0, " review comments"] }), pr.milestone ? _jsxs("span", { className: "label milestone", title: "Milestone", children: ["\uD83C\uDFF7 ", pr.milestone] }) : null, pr.mergedAt ? _jsxs("span", { className: "sha", children: ["merged ", new Date(pr.mergedAt).toLocaleString()] }) : null, pr.url ? _jsx("a", { className: "branch", href: pr.url, target: "_blank", rel: "noreferrer", children: "View on GitHub" }) : null] }), labels.length || assignees.length ? (_jsxs("div", { className: "meta-row", children: [labels.map((label) => label.name ? _jsx("span", { className: "label", children: label.name }, `l-${label.name}`) : null), assignees.map((login) => _jsxs("span", { className: "label assignee", children: ["@", login] }, `a-${login}`))] })) : null, _jsxs("div", { className: "timeline-item", children: [_jsx(Avatar, { src: pr.authorAvatarUrl, label: pr.author || "PR" }), _jsxs("article", { className: "comment", children: [_jsxs("div", { className: "comment-head", children: [_jsx("strong", { children: pr.author || "GitHub" }), " opened this pull request"] }), _jsxs("div", { className: "comment-body", children: [pr.body || "No real PR body was included in the synced seed.", pr.sourceIssue ? _jsxs("div", { className: "sha", children: ["source issue: ", pr.sourceIssue, pr.sourceIssueTitle ? ` ${pr.sourceIssueTitle}` : ""] }) : null, pr.mergeCommit ? _jsxs("div", { className: "sha", children: ["merge commit: ", pr.mergeCommit] }) : null] })] })] }), commits.length ? (_jsxs("section", { className: "snapshot-section", children: [_jsx("h3", { children: "Commits" }), commits.map((commit) => (_jsxs("div", { className: "timeline-item", children: [_jsx(Avatar, { src: commit.authorAvatarUrl, label: commit.authorLogin || commit.author }), _jsxs("article", { className: "comment", children: [_jsxs("div", { className: "comment-head", children: [_jsx("strong", { children: commit.authorLogin || commit.author || "Git author" }), " committed ", commit.date ? new Date(commit.date).toLocaleString() : ""] }), _jsxs("div", { className: "comment-body", children: [commit.message || commit.sha, _jsx("div", { className: "sha", children: shortSha(commit.sha) })] })] })] }, commit.sha)))] })) : null, comments.map((comment, index) => (_jsxs("div", { className: "timeline-item", children: [_jsx(Avatar, { src: comment.authorAvatarUrl, label: comment.author }), _jsxs("article", { className: "comment", children: [_jsxs("div", { className: "comment-head", children: [_jsx("strong", { children: comment.author || "GitHub user" }), " commented ", comment.createdAt ? new Date(comment.createdAt).toLocaleString() : ""] }), _jsx("div", { className: "comment-body", children: comment.body || "" })] })] }, `comment-${comment.url || index}`))), reviews.map((review, index) => (_jsxs("div", { className: "timeline-item", children: [_jsx(Avatar, { src: review.reviewerAvatarUrl, label: review.reviewer }), _jsxs("article", { className: "review-card", children: [_jsxs("div", { className: "review-head", children: [review.reviewer || "GitHub user", " ", review.state || "reviewed", " ", review.submittedAt ? new Date(review.submittedAt).toLocaleString() : ""] }), _jsx("div", { className: "review-body", children: review.body || "No review body." })] })] }, `${review.reviewer}-${index}`))), reviewComments.map((comment, index) => (_jsxs("div", { className: "timeline-item", children: [_jsx(Avatar, { src: comment.authorAvatarUrl, label: comment.author }), _jsxs("article", { className: "comment", children: [_jsxs("div", { className: "comment-head", children: [_jsx("strong", { children: comment.author || "GitHub user" }), " commented on ", comment.path || "a file"] }), _jsx("div", { className: "comment-body", children: comment.body || "" })] })] }, `review-comment-${comment.url || index}`))), files.length ? (_jsxs("section", { className: "snapshot-section", children: [_jsx("h3", { children: "Files changed" }), _jsx("div", { className: "file-list", children: files.map((file) => (_jsxs("div", { className: "file-row", children: [_jsx("span", { children: file.status || "modified" }), _jsx("strong", { children: file.filename }), _jsxs("span", { children: ["+", file.additions ?? 0, " -", file.deletions ?? 0] })] }, file.filename))) })] })) : null] }));
+}
+export function Aside({ pr, reviews, commits, files }) {
+    if (!pr)
+        return _jsx("aside", { className: "sidebar" });
+    return (_jsxs("aside", { className: "sidebar", children: [_jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Reviewers" }), reviews.length ? reviews.map((review, index) => _jsxs("div", { className: `label ${review.observed ? "" : "approved"}`, children: [review.state, " ", review.reviewer] }, `${review.reviewer}-${index}`)) : _jsx("p", { className: "sha", children: "No reviews in snapshot." }), (pr.requestedReviewers ?? []).length ? (_jsx("div", { className: "requested-reviewers", children: (pr.requestedReviewers ?? []).map((login) => _jsxs("span", { className: "label requested", title: "Requested reviewer", children: ["@", login, " (requested)"] }, `req-${login}`)) })) : null] }), _jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Checks" }), pr.ciStatus ? _jsxs("div", { className: `ci-line ${pr.ciStatus}`, children: [_jsx(CiStatus, { status: pr.ciStatus }), " ", pr.ciStatus] }) : _jsx("p", { className: "sha", children: "No CI checks in snapshot." })] }), _jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Milestone" }), pr.milestone ? _jsxs("span", { className: "label milestone", children: ["\uD83C\uDFF7 ", pr.milestone] }) : _jsx("p", { className: "sha", children: "No milestone." })] }), _jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Labels" }), (pr.labels ?? []).length ? (pr.labels ?? []).map((label) => label.name ? _jsx("span", { className: "label", children: label.name }, label.name) : null) : _jsx("p", { className: "sha", children: "None." })] }), _jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Assignees" }), (pr.assignees ?? []).length ? (pr.assignees ?? []).map((login) => _jsxs("div", { className: "label assignee", children: ["@", login] }, login)) : _jsx("p", { className: "sha", children: "No one assigned." })] }), _jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Development" }), pr.baseBranch ? _jsxs("div", { className: "branch", children: ["base: ", pr.baseBranch] }) : null, pr.headBranch ? _jsxs("div", { className: "branch", children: ["head: ", pr.headBranch] }) : null, pr.headSha ? _jsx("p", { className: "sha", children: shortSha(pr.headSha) }) : _jsx("p", { className: "sha", children: "No branch or commit list in synced seed." })] }), _jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Repository" }), _jsx("p", { children: pr.repo })] }), _jsxs("section", { className: "side-section", children: [_jsx("h3", { children: "Snapshot Counts" }), _jsxs("p", { className: "sha", children: [commits.length, " commits"] }), _jsxs("p", { className: "sha", children: [files.length, " files"] }), _jsxs("p", { className: "sha", children: [pr.additions ?? 0, " additions / ", pr.deletions ?? 0, " deletions"] })] })] }));
+}
+// Guard the top-level mount: the browser bundle has a DOM and mounts exactly as before,
+// but importing this module in a non-DOM test (for renderToStaticMarkup of the exported
+// presentational components) must not touch `document`.
+if (typeof document !== "undefined") {
+    createRoot(document.getElementById("root")).render(_jsx(App, {}));
+}