@kortix/ui 0.0.0-stage → 0.14.4

package/dist/workspace/projects/policies-panel.js

@@ -0,0 +1,270 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Project-wide approval rules for tool calls. Source of truth = `kortix.yaml`;
+ * this panel CRUDs the same file via the admin endpoint, then the gateway
+ * enforces on every Connector call.
+ *
+ * Rendered in two places: the Global rules sheet on the Connectors page
+ * (`capabilities/connectors/connectors-page.tsx`), and the Connectors section
+ * of the customize panel. Both are narrow columns, so
+ * the layout is a single stack of `Label` + `bg-popover rounded-md border`
+ * panels — the `settings-view.tsx` dialect. No `SectionCard`, no `List`.
+ *
+ * Plain-language framing (the UI never says the wire value):
+ *   • "Ask first" = require_approval
+ *   • "Allow"     = always_run
+ *   • "Block"     = block (also hidden from agent tool search)
+ *   • Default behavior: "Ask before risky actions" (risk) vs "Run everything"
+ *     (allow_all, legacy).
+ */
+import { useLocalizedUiCatalog } from '../../i18n/ui-catalog/use-localized-ui-catalog.js';
+import { useTranslations } from '../../i18n/index.js';
+import { CheckIcon, PlusIcon, ShieldCheckIcon, TrashIcon } from '@phosphor-icons/react';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { useEffect, useMemo, useState } from 'react';
+import { Button } from '../../primitives/button.js';
+import { InfoBanner } from '../../primitives/info-banner.js';
+import { Input } from '../../primitives/input.js';
+import { Label } from '../../primitives/label.js';
+import Loading from '../../primitives/loading.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../primitives/select.js';
+import { Skeleton } from '../../primitives/skeleton.js';
+import { errorToast, successToast } from '../../primitives/toast.js';
+import { EmptyState } from '../../primitives/empty-state.js';
+import { cn } from '../../internal/lib/utils.js';
+import { listProjectPolicies, setProjectPolicies, } from '@kortix/sdk';
+import { contract, qk } from '@kortix/sdk/react';
+/**
+ * Label + description are separate so the trigger can show the label alone.
+ * Putting the description in the trigger is what previously forced a
+ * `min-w-[16rem]` select and squeezed the pattern input beside it.
+ */
+const ACTION_META = {
+    always_run: { label: 'Allow', description: 'Runs without asking', tint: 'text-foreground' },
+    require_approval: {
+        label: 'Ask first',
+        description: 'Waits for your approval',
+        tint: 'text-kortix-orange',
+    },
+    block: {
+        label: 'Block',
+        description: 'Never runs, and agents cannot see it',
+        tint: 'text-kortix-red',
+    },
+};
+const ACTION_ORDER = ['always_run', 'require_approval', 'block'];
+const DEFAULT_OPTIONS = [
+    {
+        value: 'risk',
+        label: 'Ask before risky actions',
+        description: 'Reads run on their own. Writes and deletes wait for your approval.',
+    },
+    {
+        value: 'allow_all',
+        label: 'Run everything',
+        description: 'Every tool runs without asking. Only the rules below can stop one.',
+    },
+];
+/** Wire value ↔ the two plain-language options in the condition select. */
+const CONDITION_MATCHES = 'matches';
+const CONDITION_EXCLUDES = 'excludes';
+function newRuleId() {
+    return Math.random().toString(36).slice(2, 10);
+}
+/**
+ * Seeded draft rules + default mode + canonical server signature derived from a
+ * `listProjectPolicies` response.
+ *
+ * Extracted as a pure helper so the exact prod failure shape
+ * (Better Stack pattern `236e88fb…` — `Cannot read properties of undefined
+ * (reading 'map')` in the project layout's `?c=global` → `GlobalRulesPanel` →
+ * `PoliciesPanel` path) can be unit-tested directly without a react-query
+ * harness. `listProjectPolicies` is typed to always return `policies` /
+ * `defaultMode`, but a 200 with a missing/`null` `policies` field (empty/new
+ * project, a backend shape gap, a partial response) is a valid HTTP outcome; the
+ * prior `if (!query.data) return` guard only covered `query.data` itself, so
+ * `query.data`'s `policies` field accessed via `.map` threw. The `?? []` / `?? 'allow_all'`
+ * absorb that without changing the happy path. Mirrors the chunk-22256
+ * `toArray()` guard (#4542).
+ */
+export function seedDraft(data) {
+    const policies = data.policies ?? [];
+    const defaultMode = data.defaultMode ?? 'allow_all';
+    return {
+        draft: policies.map((p) => ({
+            id: newRuleId(),
+            match: p.match,
+            action: p.action,
+            conditions: (p.conditions ?? []).map((c) => ({ ...c, id: newRuleId() })),
+        })),
+        defaultMode,
+        // `JSON.stringify` drops `undefined` values to `null`, so coercing here
+        // keeps the signature `[]`-stable (a subsequent save would otherwise write
+        // `policies: null`).
+        serverSig: JSON.stringify({ policies, defaultMode }),
+    };
+}
+export function PoliciesPanel({ projectId }) {
+    const tI18nHardcoded = useTranslations('hardcodedUi');
+    const defaultOptions = useLocalizedUiCatalog(DEFAULT_OPTIONS);
+    const queryClient = useQueryClient();
+    // qk.project.executorPolicies — sandbox tool-execution allow/deny rules
+    // (`listProjectPolicies`, `/executor/projects/:id/policies`). NOT
+    // qk.project.policies, the unrelated account-IAM role-policy family
+    // members-view.tsx reads: both used to share the literal
+    // ['project-policies', id] pre-migration, so whichever fetch resolved
+    // last clobbered the other's cache entry with an incompatible shape.
+    const queryKey = useMemo(() => qk.project.executorPolicies(projectId), [projectId]);
+    const query = useQuery({
+        queryKey,
+        queryFn: () => listProjectPolicies(projectId),
+        ...contract('config'),
+    });
+    const [draft, setDraft] = useState([]);
+    const [defaultMode, setDefaultMode] = useState('allow_all');
+    const [serverSig, setServerSig] = useState('');
+    useEffect(() => {
+        if (!query.data)
+            return;
+        const seeded = seedDraft(query.data);
+        setDraft(seeded.draft);
+        setDefaultMode(seeded.defaultMode);
+        setServerSig(seeded.serverSig);
+    }, [query.data]);
+    const currentSig = JSON.stringify({
+        policies: draft.map((d) => toPayloadRule(d)),
+        defaultMode,
+    });
+    const dirty = currentSig !== serverSig;
+    const save = useMutation({
+        mutationFn: async () => {
+            const payload = [];
+            for (const d of draft) {
+                const p = toPayloadRule(d);
+                if (p.match.length > 0)
+                    payload.push(p);
+            }
+            return setProjectPolicies(projectId, payload, defaultMode);
+        },
+        onSuccess: () => {
+            successToast(tI18nHardcoded.raw('i18nComplete.text0c6dfc87dc2f'));
+            queryClient.invalidateQueries({ queryKey });
+        },
+        onError: (error) => errorToast(error.message || tI18nHardcoded.raw('i18nComplete.text9cb1843add48')),
+    });
+    const isForbidden = query.isError && /403|forbidden/i.test(query.error?.message ?? '');
+    function updateRule(id, patch) {
+        setDraft((rows) => rows.map((r) => (r.id === id ? { ...r, ...patch } : r)));
+    }
+    function updateCondition(ruleId, index, patch) {
+        setDraft((rows) => rows.map((r) => r.id === ruleId
+            ? { ...r, conditions: r.conditions.map((c, i) => (i === index ? { ...c, ...patch } : c)) }
+            : r));
+    }
+    function addCondition(ruleId) {
+        setDraft((rows) => rows.map((r) => r.id === ruleId
+            ? { ...r, conditions: [...r.conditions, { id: newRuleId(), arg: '', match: '' }] }
+            : r));
+    }
+    function removeCondition(ruleId, index) {
+        setDraft((rows) => rows.map((r) => r.id === ruleId ? { ...r, conditions: r.conditions.filter((_, i) => i !== index) } : r));
+    }
+    // Draft-only edits — nothing leaves the browser until Save changes. That is
+    // why removing a rule needs no ConfirmDialog: Revert is one click away.
+    function removeRule(id) {
+        setDraft((rows) => rows.filter((r) => r.id !== id));
+    }
+    function addRule() {
+        setDraft((rows) => [
+            ...rows,
+            { id: newRuleId(), match: '', action: 'require_approval', conditions: [] },
+        ]);
+    }
+    function revert() {
+        if (!query.data)
+            return;
+        const seeded = seedDraft(query.data);
+        setDraft(seeded.draft);
+        setDefaultMode(seeded.defaultMode);
+    }
+    if (isForbidden) {
+        return (_jsx(InfoBanner, { tone: "warning", title: tI18nHardcoded.raw('autoComponentsProjectsPoliciesPanelJsxAttrTitleAdminAccessRequired34f66101'), children: tI18nHardcoded.raw('autoComponentsProjectsPoliciesPanelJsxTextOnlyProjectManagersCan603f67fc') }));
+    }
+    const parseErrors = query.data?.errors ?? [];
+    return (_jsxs("div", { className: "flex h-full w-full flex-1 grow flex-col space-y-8", children: [_jsxs("section", { className: "space-y-4", children: [_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { children: tI18nHardcoded.raw('i18nComplete.texta98b3578d57b') }), _jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: tI18nHardcoded.raw('i18nComplete.text39839e17c1cd') })] }), query.isLoading ? (_jsxs("div", { className: "grid gap-2 sm:grid-cols-2", children: [_jsx(Skeleton, { className: "h-18 rounded-md" }), _jsx(Skeleton, { className: "h-18 rounded-md" })] })) : (_jsx("div", { className: "grid gap-2 sm:grid-cols-2", children: defaultOptions.map((opt) => {
+                            const selected = defaultMode === opt.value;
+                            return (_jsxs("button", { type: "button", onClick: () => setDefaultMode(opt.value), "aria-pressed": selected, className: cn('flex cursor-pointer flex-col items-start gap-1 rounded-md border px-4 py-3 text-left', 
+                                // Never `transition-all` — `scale` is listed so the press
+                                // feedback below actually eases instead of snapping.
+                                'transition-[background-color,border-color,scale] duration-150 ease-out', 'motion-safe:active:scale-[0.99]', selected
+                                    ? 'border-primary/40 bg-primary/[0.06]'
+                                    : 'bg-popover hover:bg-foreground/[0.03]'), children: [_jsxs("span", { className: "flex w-full items-center justify-between gap-2", children: [_jsx("span", { className: "text-foreground text-sm font-medium", children: opt.label }), selected ? _jsx(CheckIcon, { className: "text-foreground size-4 shrink-0" }) : null] }), _jsx("span", { className: "text-muted-foreground text-xs text-pretty", children: opt.description })] }, opt.value));
+                        }) }))] }), _jsxs("section", { className: "space-y-4", children: [_jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-start sm:justify-between", children: [_jsxs("div", { className: "space-y-1", children: [_jsx(Label, { children: tI18nHardcoded.raw('i18nComplete.text4228aeb07c41') }), _jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: tI18nHardcoded.raw('i18nComplete.texteb35a8dd49a7') })] }), draft.length > 0 && (_jsxs(Button, { size: "sm", variant: "secondary", className: "shrink-0 gap-1.5 self-start sm:self-auto", onClick: addRule, disabled: query.isLoading, children: [_jsx(PlusIcon, { className: "size-4 shrink-0" }), tI18nHardcoded.raw('i18nComplete.texta27cff51a2e0')] }))] }), parseErrors.length > 0 && (_jsx(InfoBanner, { tone: "warning", title: tI18nHardcoded.raw('autoComponentsProjectsPoliciesPanelJsxAttrTitleKortixTomlHad8db85c74'), children: _jsx("ul", { className: "space-y-1", children: parseErrors.map((e) => (_jsxs("li", { className: "text-xs", children: [_jsx("span", { className: "font-mono", children: e.path }), ": ", e.error] }, `${e.path}:${e.error}`))) }) })), query.isLoading ? (_jsx("div", { className: "space-y-2", children: [0, 1].map((i) => (_jsx(Skeleton, { className: "h-28 rounded-md" }, i))) })) : draft.length === 0 ? (_jsx("div", { className: "bg-popover rounded-md border", children: _jsx(EmptyState, { icon: ShieldCheckIcon, size: "sm", className: "p-8 md:p-10", title: tI18nHardcoded.raw('autoComponentsProjectsPoliciesPanelJsxAttrTitleNoRulesYet795c2fb5'), description: tI18nHardcoded.raw('autoComponentsProjectsPoliciesPanelJsxAttrDescriptionRequireApprovalFor7e7b9477'), action: _jsxs(Button, { size: "sm", variant: "outline", className: "gap-1.5", onClick: addRule, children: [_jsx(PlusIcon, { className: "size-4 shrink-0" }), tI18nHardcoded.raw('i18nComplete.texta27cff51a2e0')] }) }) })) : (_jsx("ul", { className: "space-y-2", children: draft.map((rule, idx) => (_jsx(RuleRow, { rule: rule, index: idx, onChange: (patch) => updateRule(rule.id, patch), onRemove: () => removeRule(rule.id), onAddCondition: () => addCondition(rule.id), onChangeCondition: (cIdx, patch) => updateCondition(rule.id, cIdx, patch), onRemoveCondition: (cIdx) => removeCondition(rule.id, cIdx) }, rule.id))) }))] }), dirty && (_jsxs("div", { className: "bg-popover z-10 mt-auto flex flex-wrap items-center justify-between gap-3 rounded-md border px-4 py-3", children: [_jsxs("p", { className: "text-muted-foreground min-w-0 text-xs text-pretty", children: [tI18nHardcoded.raw('i18nComplete.text53121d4517f7'), ' ', _jsx("code", { className: "bg-muted text-foreground rounded-sm px-1 py-0.5 font-mono text-xs", children: "kortix.yaml" }), "."] }), _jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: revert, disabled: save.isPending, children: tI18nHardcoded.raw('i18nComplete.text0026c5053478') }), _jsxs(Button, { size: "sm", onClick: () => save.mutate(), disabled: save.isPending, children: [save.isPending ? _jsx(Loading, { className: "size-4 shrink-0" }) : null, tI18nHardcoded.raw('i18nComplete.textdd0ae7a5cbcf')] })] })] }))] }));
+}
+/**
+ * One rule: which tool it covers, what to do, and any argument conditions.
+ *
+ * Padding sits on the row itself because the row hosts no flush children — the
+ * conditions group is inset with a left hairline rather than a full-width seam,
+ * which keeps a rule reading as one object instead of a stack of cards.
+ */
+function RuleRow({ rule, index, onChange, onRemove, onAddCondition, onChangeCondition, onRemoveCondition, }) {
+    const tI18nHardcoded = useTranslations('hardcodedUi');
+    const actionMeta = useLocalizedUiCatalog(ACTION_META);
+    const position = index + 1;
+    return (_jsxs("li", { className: "bg-popover space-y-3 rounded-md border px-4 py-3", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsx("span", { className: "text-muted-foreground flex h-9 w-4 shrink-0 items-center justify-end font-mono text-xs tabular-nums", children: position }), _jsxs("div", { className: "min-w-0 flex-1 space-y-2", children: [_jsxs("div", { className: "flex flex-col gap-2 sm:flex-row", children: [_jsx(Input, { value: rule.match, onChange: (e) => onChange({ match: e.target.value }), placeholder: tI18nHardcoded.raw('autoComponentsProjectsPoliciesPanelJsxAttrPlaceholderStripeChargesCreate0ff0fa54'), variant: "popover", className: "min-w-0 flex-1 font-mono text-xs", spellCheck: false, "aria-label": tI18nHardcoded('i18nComplete.textb5af740a6585', { value0: position }) }), _jsxs(Select, { value: rule.action, onValueChange: (v) => onChange({ action: v }), children: [_jsx(SelectTrigger, { variant: "outline", className: "w-full shrink-0 sm:w-40", "aria-label": tI18nHardcoded('i18nComplete.text5b2ba171f55f', {
+                                                    value0: position,
+                                                }), children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: ACTION_ORDER.map((a) => (_jsx(SelectItem, { value: a, description: actionMeta[a].description, children: _jsx("span", { className: cn('text-sm font-medium', actionMeta[a].tint), children: actionMeta[a].label }) }, a))) })] })] }), _jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: matchHint(rule.match) })] }), _jsx(Button, { size: "icon-md", variant: "ghost", className: "text-muted-foreground hover:text-foreground shrink-0", "aria-label": tI18nHardcoded('i18nComplete.texte2cbd4618228', { value0: position }), onClick: onRemove, children: _jsx(TrashIcon, { className: "size-4 shrink-0" }) })] }), rule.conditions.length > 0 && (_jsxs("div", { className: "border-border ml-7 space-y-2 border-l pl-4", children: [_jsx("p", { className: "text-muted-foreground text-xs", children: tI18nHardcoded.raw('i18nComplete.text3ddcbfe612b2') }), rule.conditions.map((cond, cIdx) => (_jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center", children: [_jsx(Input, { value: cond.arg, onChange: (e) => onChangeCondition(cIdx, { arg: e.target.value }), placeholder: tI18nHardcoded.raw('i18nComplete.text663ea1bfffe5'), variant: "popover", className: "font-mono text-xs sm:w-28", spellCheck: false, "aria-label": tI18nHardcoded('i18nComplete.text2eefa5041762', {
+                                    value0: position,
+                                    value1: cIdx + 1,
+                                }) }), _jsxs(Select, { value: cond.negate ? CONDITION_EXCLUDES : CONDITION_MATCHES, onValueChange: (v) => onChangeCondition(cIdx, { negate: v === CONDITION_EXCLUDES }), children: [_jsx(SelectTrigger, { variant: "outline", className: "w-full shrink-0 text-xs sm:w-36", "aria-label": tI18nHardcoded('i18nComplete.texta9f78a15820d', {
+                                            value0: position,
+                                            value1: cIdx + 1,
+                                        }), children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: CONDITION_MATCHES, children: tI18nHardcoded.raw('i18nComplete.text98abff28a940') }), _jsx(SelectItem, { value: CONDITION_EXCLUDES, children: tI18nHardcoded.raw('i18nComplete.textc9ba775e93dd') })] })] }), _jsx(Input, { value: cond.match, onChange: (e) => onChangeCondition(cIdx, { match: e.target.value }), placeholder: tI18nHardcoded.raw('i18nComplete.text437223bfa541'), variant: "popover", className: "min-w-0 flex-1 font-mono text-xs", spellCheck: false, "aria-label": tI18nHardcoded('i18nComplete.texta725069dbaec', {
+                                    value0: position,
+                                    value1: cIdx + 1,
+                                }) }), _jsx(Button, { size: "icon-md", variant: "ghost", className: "text-muted-foreground hover:text-foreground shrink-0 self-end sm:self-auto", "aria-label": tI18nHardcoded('i18nComplete.text7abf95c1092d', {
+                                    value0: position,
+                                    value1: cIdx + 1,
+                                }), onClick: () => onRemoveCondition(cIdx), children: _jsx(TrashIcon, { className: "size-4 shrink-0" }) })] }, cond.id))), _jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: tI18nHardcoded.raw('i18nComplete.text9fdd73a806a4') })] })), _jsxs(Button, { variant: "ghost", size: "sm", className: "text-muted-foreground hover:text-foreground -ml-2.5 gap-1.5", onClick: onAddCondition, children: [_jsx(PlusIcon, { className: "size-3.5 shrink-0" }), tI18nHardcoded.raw('i18nComplete.text60a0d83510ea')] })] }));
+}
+function matchHint(raw) {
+    const m = raw.trim();
+    if (!m)
+        return 'Enter a tool id — or use * to match every tool.';
+    if (m === '*')
+        return 'Matches every tool from every connector.';
+    if (m.endsWith('.*')) {
+        const prefix = m.slice(0, -2);
+        if (!prefix.includes('.'))
+            return `Matches every tool inside the "${prefix}" connector.`;
+        return `Matches every tool whose id starts with "${prefix}.".`;
+    }
+    if (m.includes('*'))
+        return 'Matches any tool id where * stands in for any text.';
+    return `Matches exactly "${m}".`;
+}
+/**
+ * Draft rule → the wire shape. Trims, and omits `conditions` entirely when the
+ * rule has none so an unconditional rule serializes exactly as it always did
+ * (no `conditions: []` churn in every project's kortix.yaml).
+ *
+ * Blank condition rows are dropped: a half-typed row must never reach the API,
+ * where it would be rejected as invalid and block the whole save.
+ */
+export function toPayloadRule(d) {
+    const conditions = [];
+    for (const c of d.conditions) {
+        const arg = c.arg.trim();
+        const match = c.match.trim();
+        if (arg.length > 0 && match.length > 0) {
+            conditions.push({ arg, match, ...(c.negate ? { negate: true } : {}) });
+        }
+    }
+    return {
+        match: d.match.trim(),
+        action: d.action,
+        ...(conditions.length > 0 ? { conditions } : {}),
+    };
+}

package/dist/workspace/projects/session-shared-icon.d.ts

@@ -0,0 +1,8 @@
+import type { ProjectSession } from '@kortix/sdk';
+type SessionOwnership = Pick<ProjectSession, 'is_owner' | 'owner_name' | 'owner_email'>;
+/** Minimal ownership marker for every accessible session the viewer does not own. */
+export declare function SessionSharedIcon({ session, className, }: {
+    session: SessionOwnership;
+    className?: string;
+}): import("react").JSX.Element | null;
+export {};

package/dist/workspace/projects/session-shared-icon.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ShareNetworkIcon } from '@phosphor-icons/react';
+import { sessionIsShared } from '../../session/actions/session-label.js';
+import { cn } from '../../internal/lib/utils.js';
+/** Minimal ownership marker for every accessible session the viewer does not own. */
+export function SessionSharedIcon({ session, className, }) {
+    if (!sessionIsShared(session))
+        return null;
+    const owner = session.owner_name || session.owner_email;
+    const label = owner ? `Shared by ${owner}` : 'Shared session';
+    return (_jsx("span", { className: cn('text-muted-foreground flex size-5 shrink-0 items-center justify-center', className), role: "img", "aria-label": label, title: label, "data-session-shared": "true", children: _jsx(ShareNetworkIcon, { className: "size-3.5" }) }));
+}

package/dist/workspace/projects/session-starter.d.ts

@@ -0,0 +1,19 @@
+import type { ProjectSession, ProjectSessionInitiatorType } from '@kortix/sdk';
+/**
+ * Who started the RUN a session belongs to, read from the server-derived
+ * `initiator` (never from `created_by`: a child keeps its creator's ownership
+ * but shows its run's starter). A row the backfill could not classify has no
+ * initiator and reads as a member: the session's creator.
+ */
+export interface SessionStarter {
+    type: ProjectSessionInitiatorType;
+    /** Display label. "You" only when the initiator is the viewer. */
+    label: string;
+    isViewer: boolean;
+    /** trigger slug, channel id, or service-account id — for tooltips and icons. */
+    id: string | null;
+}
+export declare function sessionStarter(session: Pick<ProjectSession, 'initiator' | 'is_owner' | 'owner_name' | 'owner_email' | 'created_by'>, viewerId: string | null, labels: {
+    you: string;
+    unknown: string;
+}): SessionStarter;

package/dist/workspace/projects/session-starter.js

@@ -0,0 +1,17 @@
+export function sessionStarter(session, viewerId, labels) {
+    const initiator = session.initiator;
+    if (!initiator || initiator.type === 'member') {
+        const id = initiator?.id ?? session.created_by ?? null;
+        // No initiator: fall back to the viewer-relative `is_owner`. With an
+        // initiator, compare its id to the viewer when we know who they are.
+        const isViewer = initiator?.id && viewerId ? initiator.id === viewerId : session.is_owner !== false;
+        const name = initiator?.label || session.owner_name || session.owner_email || null;
+        return { type: 'member', id, isViewer, label: isViewer ? labels.you : (name ?? labels.unknown) };
+    }
+    return {
+        type: initiator.type,
+        id: initiator.id,
+        isViewer: false,
+        label: initiator.label || initiator.id || labels.unknown,
+    };
+}

package/dist/workspace/repository-disconnected.d.ts

@@ -0,0 +1,12 @@
+import { type RepositoryDisconnect } from '../internal/components/repository-disconnected.js';
+export * from '../internal/components/repository-disconnected.js';
+/** Presentational sidebar alert, renderable under renderToStaticMarkup. */
+export declare function ProjectRepositoryDisconnectedAlertView({ projectId, disconnect, defaultOpen, }: {
+    projectId: string;
+    disconnect: RepositoryDisconnect | null;
+    defaultOpen?: boolean;
+}): import("react").JSX.Element | null;
+/** Project-wide: the sidebar footer shows it on every project page. */
+export declare function ProjectRepositoryDisconnectedAlert({ projectId }: {
+    projectId: string;
+}): import("react").JSX.Element;

package/dist/workspace/repository-disconnected.js

@@ -0,0 +1,28 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The project's GitHub repository cannot be reached (KRTX-2955). The shared
+ * parts live in `internal/components/repository-disconnected.tsx`; this file
+ * adds the project-wide sidebar footer alert and keeps the public deep export.
+ */
+import { PlugsIcon } from '@phosphor-icons/react';
+import { useState } from 'react';
+import { useTranslations } from '../i18n/index.js';
+import { ReconnectGitHubButton, RepositoryDisconnectText, useRepositoryDisconnect, } from '../internal/components/repository-disconnected.js';
+import { customizePath } from '../lib/routes.js';
+import { Button } from '../primitives/button.js';
+import { UiLink as Link } from '../providers/ui-provider.js';
+import { SidebarAlert, SidebarAlertActions, SidebarAlertBody, SidebarAlertText, } from './sidebar/footer/sidebar-alert.js';
+export * from '../internal/components/repository-disconnected.js';
+/** Presentational sidebar alert, renderable under renderToStaticMarkup. */
+export function ProjectRepositoryDisconnectedAlertView({ projectId, disconnect, defaultOpen = false, }) {
+    const t = useTranslations('repositoryDisconnected');
+    const [open, setOpen] = useState(defaultOpen);
+    if (!disconnect)
+        return null;
+    return (_jsxs(SidebarAlert, { tone: "warning", icon: _jsx(PlugsIcon, { className: "size-4" }), label: t('title'), open: open, onOpenChange: setOpen, children: [_jsx(SidebarAlertBody, { children: _jsx(SidebarAlertText, { children: _jsx(RepositoryDisconnectText, { disconnect: disconnect }) }) }), _jsxs(SidebarAlertActions, { children: [_jsx(ReconnectGitHubButton, { projectId: projectId, className: "w-full" }), _jsx(Button, { asChild: true, size: "sm", variant: "ghost", className: "w-full", children: _jsx(Link, { href: customizePath(projectId, 'settings?section=git'), children: t('openSettings') }) })] })] }));
+}
+/** Project-wide: the sidebar footer shows it on every project page. */
+export function ProjectRepositoryDisconnectedAlert({ projectId }) {
+    return _jsx(ProjectRepositoryDisconnectedAlertView, { projectId: projectId, disconnect: useRepositoryDisconnect(projectId) });
+}

package/dist/workspace/review/approval-modal.d.ts

@@ -0,0 +1,43 @@
+import { type ApprovalDecisionValue, type ApprovalResolvers } from '../../session/prompts/approval-request.js';
+import type { ApprovalLinkDetails } from '@kortix/sdk';
+import type { ReviewItem } from './types.js';
+/**
+ * A Connector approval as the standalone approve page reads it, built from the
+ * Review Center row the inbox already holds — no second request. Null for any
+ * item that is not one adapted Connector call.
+ */
+export declare function reviewApprovalDetails(item: ReviewItem): ApprovalLinkDetails | null;
+/**
+ * A pending connector call that shows nothing to review: the decision panel
+ * offers only Deny. The same rule the panel applies (`approvalReviewable`) on
+ * the same details, so the list row and the modal never disagree.
+ */
+export declare function reviewApprovalDenyOnly(item: ReviewItem): boolean;
+/**
+ * Who asked for the call, as the decision panel names them. The SDK labels a
+ * row with no agent "Agent", and an approval's summary is its session's title
+ * only when that title is known; anything else names nobody.
+ */
+export declare function reviewApprovalAsker(item: ReviewItem, sessionLabels?: Record<string, string>): {
+    agentName: string | null;
+    sessionTitle: string | null;
+};
+/**
+ * The standalone approve page (`/approve/[token]`), in a modal over the inbox.
+ * One approval UI everywhere: the same panel, the same rows, the same decision.
+ * No `onDecision` = the viewer may read the call but not decide it.
+ */
+export declare function ApprovalDecisionModal({ details, previewAuthorized, busyDecision, onDecision, onOpenSession, onClose, resolvers, agentName, sessionTitle, }: {
+    details: ApprovalLinkDetails | null;
+    previewAuthorized?: boolean;
+    /** Who decides the call, for a viewer who may not (KRTX-1724). */
+    resolvers?: ApprovalResolvers | null;
+    busyDecision: ApprovalDecisionValue | null;
+    onDecision?: (decision: ApprovalDecisionValue, note?: string) => void;
+    onOpenSession?: () => void;
+    onClose: () => void;
+    /** The agent that asked. Null: "An agent". */
+    agentName?: string | null;
+    /** The session that asked, by its title. Null: not named. */
+    sessionTitle?: string | null;
+}): import("react").JSX.Element;

package/dist/workspace/review/approval-modal.js

@@ -0,0 +1,91 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { approvalReviewable, useApprovalWaitingText, } from '../../session/prompts/approval-request.js';
+import { ApprovalDecisionPanel } from '../../markdown/setup-links/approval-decision.js';
+import { Modal, ModalContent, ModalDescription, ModalTitle } from '../../primitives/modal.js';
+import { useTranslations } from '../../i18n/index.js';
+import { connectorCallId } from './review-actions.js';
+/**
+ * A Connector approval as the standalone approve page reads it, built from the
+ * Review Center row the inbox already holds — no second request. Null for any
+ * item that is not one adapted Connector call.
+ */
+export function reviewApprovalDetails(item) {
+    const executionId = connectorCallId(item.id);
+    const call = item.kind === 'approval' ? item.detail.actions?.[0] : undefined;
+    if (!executionId || !call)
+        return null;
+    // `waiting`: still pending, on someone else's decision (KRTX-1724).
+    const pending = item.status === 'needs_you' || item.status === 'waiting';
+    return {
+        kind: 'approval',
+        project_id: '',
+        project_name: item.project,
+        execution_id: executionId,
+        session_id: item.sessionId ?? null,
+        action: call.actionPath || call.title,
+        connector: call.connector || null,
+        connector_name: call.connectorName ?? null,
+        risk: call.connectorRisk ?? null,
+        status: item.status === 'approved'
+            ? 'ok'
+            : item.status === 'rejected'
+                ? 'denied'
+                : item.status === 'expired'
+                    ? 'expired'
+                    : 'pending_approval',
+        pending,
+        args_preview: call.rawArgsPreview ?? null,
+        review_complete: call.reviewComplete === true,
+        args_summary: null,
+        approval_context: call.approvalContext ?? null,
+        resolved_preview: call.resolvedPreview ?? null,
+        resolved_error: call.resolvedError ?? null,
+        policy_source: call.policySource,
+        requested_at: item.createdAt,
+        resolved_at: null,
+        expires_at: item.expiresAt ?? '',
+    };
+}
+/**
+ * A pending connector call that shows nothing to review: the decision panel
+ * offers only Deny. The same rule the panel applies (`approvalReviewable`) on
+ * the same details, so the list row and the modal never disagree.
+ */
+export function reviewApprovalDenyOnly(item) {
+    const details = reviewApprovalDetails(item);
+    if (!details || !details.pending)
+        return false;
+    return !approvalReviewable(details.args_preview, details.review_complete, details.resolved_preview);
+}
+/**
+ * Who asked for the call, as the decision panel names them. The SDK labels a
+ * row with no agent "Agent", and an approval's summary is its session's title
+ * only when that title is known; anything else names nobody.
+ */
+export function reviewApprovalAsker(item, sessionLabels = {}) {
+    const agent = item.agent && item.agent !== 'Agent' ? item.agent : null;
+    return {
+        agentName: agent,
+        sessionTitle: item.sessionId ? (sessionLabels[item.sessionId] ?? null) : null,
+    };
+}
+/**
+ * The standalone approve page (`/approve/[token]`), in a modal over the inbox.
+ * One approval UI everywhere: the same panel, the same rows, the same decision.
+ * No `onDecision` = the viewer may read the call but not decide it.
+ */
+export function ApprovalDecisionModal({ details, previewAuthorized, busyDecision, onDecision, onOpenSession, onClose, resolvers = null, agentName = null, sessionTitle = null, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const waitingText = useApprovalWaitingText(resolvers);
+    // The panel's own rule: a pending call with no decision on offer waits on
+    // someone else, so the dialog is not announced as a request to this viewer.
+    const waiting = details?.pending === true && !onDecision;
+    return (_jsx(Modal, { open: details !== null, onOpenChange: (open) => !open && onClose(), children: _jsxs(ModalContent, { showCloseButton: false, 
+            // Focus the dialog itself, not its first control: that is the
+            // description's info trigger, and focus would open its hover card.
+            onOpenAutoFocus: (event) => {
+                event.preventDefault();
+                event.currentTarget?.focus();
+            }, className: "space-y-0 lg:h-auto lg:max-h-[85svh] lg:max-w-md", children: [_jsx(ModalTitle, { className: "sr-only", children: waiting ? tI18nComplete.raw('textdb0e960b68b5') : tI18nComplete.raw('text1862f81ed9d6') }), _jsx(ModalDescription, { className: "sr-only", children: waiting ? waitingText : tI18nComplete.raw('text32c6817c8380') }), details ? (_jsx(ApprovalDecisionPanel, { details: details, outcome: null, busyDecision: busyDecision, error: null, onDecision: onDecision, onOpenSession: onOpenSession, previewAuthorized: previewAuthorized, resolvers: resolvers, agentName: agentName, sessionTitle: sessionTitle })) : null] }) }));
+}

package/dist/workspace/review/change-files.d.ts

@@ -0,0 +1,3 @@
+export declare function ChangeFiles({ crId }: {
+    crId: string;
+}): import("react").JSX.Element;

package/dist/workspace/review/change-files.js

@@ -0,0 +1,58 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslations } from '../../i18n/index.js';
+/**
+ * The "Changes" section of a change's review page: every file the branch
+ * touched, each with its live diff open underneath. Reuses the project-files
+ * diff stack (DiffRenderer + useChangeRequestDiff) so the review shows the REAL
+ * branch state and updates as the agent revises. Connected mode only (needs a
+ * cr id + ProjectFilesProvider, which the connected inbox provides).
+ */
+import { Button } from '../../primitives/button.js';
+import { Skeleton } from '../../primitives/skeleton.js';
+import { DiffStat } from '../../primitives/status.js';
+import { splitPath, splitUnifiedPatch } from '../../changes/index.js';
+import { DiffRenderer } from '../../files/project/components/diff-renderer.js';
+import { useChangeRequestDiff } from '../../files/project/hooks/use-change-requests.js';
+import { cn } from '../../internal/lib/utils.js';
+import { CaretDownIcon as ChevronDown } from '@phosphor-icons/react';
+import { useMemo, useState } from 'react';
+export function ChangeFiles({ crId }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const { data, isLoading, isError } = useChangeRequestDiff(crId);
+    // Every file starts open — the diff is what a reviewer came for. Collapsing
+    // is per file and remembered until the page is left.
+    const [closed, setClosed] = useState(new Set());
+    const patchByPath = useMemo(() => splitUnifiedPatch(data?.patch ?? ''), [data?.patch]);
+    const files = data?.files ?? [];
+    const allClosed = files.length > 0 && closed.size === files.length;
+    // The server could not produce patch text at all (a diff whose output
+    // outgrows the API's exec buffer, or a git timeout) — the file list still
+    // stands, but every body has to say so instead of staying blank.
+    const patchTruncated = data?.patch_truncated === true;
+    let body;
+    if (isLoading) {
+        body = (_jsxs(_Fragment, { children: [_jsx(Skeleton, { className: "h-10 rounded-md" }), _jsx(Skeleton, { className: "h-24 rounded-md" })] }));
+    }
+    else if (isError || files.length === 0) {
+        body = (_jsx("div", { className: "bg-popover text-muted-foreground rounded-md border px-4 py-8 text-center text-sm", children: tI18nComplete.raw('text9de1afb68dd7') }));
+    }
+    else {
+        body = files.map((f) => {
+            const { name, dir } = splitPath(f.path);
+            const patch = patchByPath.get(f.path);
+            const open = !closed.has(f.path);
+            return (_jsxs("section", { className: "bg-popover overflow-hidden rounded-md border", children: [_jsxs("button", { type: "button", onClick: () => setClosed((prev) => {
+                            const next = new Set(prev);
+                            if (next.has(f.path))
+                                next.delete(f.path);
+                            else
+                                next.add(f.path);
+                            return next;
+                        }), "aria-expanded": open, className: "hover:bg-hover duration-fast flex w-full items-center gap-2 px-4 py-2.5 text-left transition-colors", children: [_jsx(ChevronDown, { className: cn('text-muted-foreground size-3.5 shrink-0 transition-transform', !open && '-rotate-90') }), _jsxs("span", { className: "min-w-0 flex-1 truncate text-sm", children: [_jsx("span", { className: "text-foreground font-medium", children: name }), dir && _jsx("span", { className: "text-muted-foreground ml-1.5", children: dir })] }), _jsx(DiffStat, { additions: f.additions, deletions: f.deletions, className: "shrink-0 text-xs" })] }), open ? (patch ? (_jsx("div", { className: "border-border border-t", children: _jsx(DiffRenderer, { patch: patch }) })) : (_jsx("div", { className: "border-border bg-hover/40 text-muted-foreground border-t px-4 py-3 text-center text-xs", children: tI18nComplete.raw(patchTruncated ? 'texte3d92a0125e7' : 'text903237107ab6') }))) : null] }, f.path));
+        });
+    }
+    return (_jsxs("section", { className: "space-y-3", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx("h2", { className: "text-foreground text-sm font-medium", children: tI18nComplete.raw('textbbd4b6a86bc6') }), files.length > 1 && (_jsx(Button, { variant: "ghost", size: "sm", onClick: () => setClosed(allClosed ? new Set() : new Set(files.map((f) => f.path))), children: allClosed
+                            ? tI18nComplete.raw('texta3e586be3eff')
+                            : tI18nComplete.raw('text25f7b3721119') }))] }), _jsx("div", { className: "space-y-2", children: body })] }));
+}