cli-jaw 2.17.62 → 2.17.63

package/public/manager/src/settings/pages/ModelProvider.tsx

@@ -1,11 +1,14 @@
-// Phase 2 — Model & Provider page: per-CLI rows + codex extras +
-// fallback chip list + active-overrides table with reset button.
+// Phase 2 — Model & Provider page: per-CLI rows + fallback chip list +
+// active-overrides table with reset button.
 
 import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import type { SettingsPageProps, SettingsClient, DirtyEntry } from '../types';
 import { describeError } from '../components/error-normalize';
-import { ChipListField, NumberField } from '../fields';
+import { ChipListField } from '../fields';
 import {
+    SettingsActions,
+    SettingsKeyValue,
+    SettingsNote,
     SettingsSection,
     PageError,
     PageLoading,
@@ -79,7 +82,6 @@ export default function ModelProvider({ port, client, dirty, registerSave }: Set
     const [perCliDraft, setPerCliDraft] = useState<Record<string, PerCliEntry>>({});
     const [piDraft, setPiDraft] = useState<PiSettingsView | undefined>(undefined);
     const [fallback, setFallback] = useState<string[]>([]);
-    const [codexCtx, setCodexCtx] = useState<{ contextWindowSize?: number; contextWindowCompactLimit?: number }>({});
     const [resetting, setResetting] = useState(false);
     const [resetError, setResetError] = useState<string | null>(null);
     const [saveError, setSaveError] = useState<string | null>(null);
@@ -126,15 +128,6 @@ export default function ModelProvider({ port, client, dirty, registerSave }: Set
         setPerCliDraft(nextPerCli);
         setPiDraft(state.data.pi);
         setFallback([...(state.data.fallbackOrder || [])]);
-        const codex = nextPerCli['codex'] || {};
-        const nextCodexCtx: typeof codexCtx = {};
-        if (typeof codex.contextWindowSize === 'number') {
-            nextCodexCtx.contextWindowSize = codex.contextWindowSize;
-        }
-        if (typeof codex.contextWindowCompactLimit === 'number') {
-            nextCodexCtx.contextWindowCompactLimit = codex.contextWindowCompactLimit;
-        }
-        setCodexCtx(nextCodexCtx);
     }, [state, dirty]);
 
     const onPiRegistered = useCallback((next: PiRegistration) => {
@@ -228,7 +221,6 @@ export default function ModelProvider({ port, client, dirty, registerSave }: Set
     const data = state.data;
     const perCliOriginal = data.perCli || {};
     const cliKeys = orderModelCliKeys(Object.keys(perCliOriginal));
-    const codexOriginal = perCliOriginal['codex'] || {};
     const overrides = data.activeOverrides || {};
     const overrideRows = Object.entries(overrides);
 
@@ -248,7 +240,7 @@ export default function ModelProvider({ port, client, dirty, registerSave }: Set
                 hint="Per-CLI model and runtime defaults. Runtime transport applies to the next run; display and permissions stay separate."
             >
                 {cliKeys.length === 0 ? (
-                    <p className="settings-empty">No CLIs registered for this instance.</p>
+                    <SettingsNote>No CLIs registered for this instance.</SettingsNote>
                 ) : (
                     cliKeys.map((cli) => (
                         <PerCliRow
@@ -270,58 +262,6 @@ export default function ModelProvider({ port, client, dirty, registerSave }: Set
                 )}
             </SettingsSection>
 
-            {perCliOriginal['codex'] ? (
-                <SettingsSection
-                    title="Codex context window"
-                    hint="Codex-only sliders. Other CLIs ignore these values."
-                >
-                    <NumberField
-                        id="model-codex-ctx"
-                        label="Context window size"
-                        disabled={saving || resetting}
-                        value={
-                            codexCtx.contextWindowSize
-                            ?? (typeof codexOriginal.contextWindowSize === 'number'
-                                ? codexOriginal.contextWindowSize
-                                : 1_000_000)
-                        }
-                        min={0}
-                        step={10_000}
-                        onChange={(next) => {
-                            if (!canEdit()) return;
-                            setCodexCtx({ ...codexCtx, contextWindowSize: next });
-                            setEntry('perCli.codex.contextWindowSize', {
-                                value: next,
-                                original: codexOriginal.contextWindowSize ?? 1_000_000,
-                                valid: Number.isFinite(next) && next >= 0,
-                            });
-                        }}
-                    />
-                    <NumberField
-                        id="model-codex-compact"
-                        label="Compact limit"
-                        disabled={saving || resetting}
-                        value={
-                            codexCtx.contextWindowCompactLimit
-                            ?? (typeof codexOriginal.contextWindowCompactLimit === 'number'
-                                ? codexOriginal.contextWindowCompactLimit
-                                : 900_000)
-                        }
-                        min={0}
-                        step={10_000}
-                        onChange={(next) => {
-                            if (!canEdit()) return;
-                            setCodexCtx({ ...codexCtx, contextWindowCompactLimit: next });
-                            setEntry('perCli.codex.contextWindowCompactLimit', {
-                                value: next,
-                                original: codexOriginal.contextWindowCompactLimit ?? 900_000,
-                                valid: Number.isFinite(next) && next >= 0,
-                            });
-                        }}
-                    />
-                </SettingsSection>
-            ) : null}
-
             <SettingsSection
                 title="Fallback order"
                 hint="Order of CLIs used when the active CLI fails. Press Enter to add a chip; Backspace to remove the last."
@@ -355,46 +295,31 @@ export default function ModelProvider({ port, client, dirty, registerSave }: Set
                 hint="Per-session overrides applied on top of per-CLI defaults."
             >
                 {overrideRows.length === 0 ? (
-                    <p className="settings-empty">No active overrides.</p>
+                    <SettingsNote>No active overrides.</SettingsNote>
                 ) : (
-                    <table className="settings-overrides-table">
-                        <thead>
-                            <tr>
-                                <th scope="col">CLI</th>
-                                <th scope="col">Model</th>
-                                <th scope="col">Effort</th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            {overrideRows.map(([cli, cfg]) => (
-                                <tr key={cli}>
-                                    <td>{cli}</td>
-                                    <td>
-                                        <code>{cfg?.model || '—'}</code>
-                                    </td>
-                                    <td>
-                                        <code>{cfg?.effort || '—'}</code>
-                                    </td>
-                                </tr>
-                            ))}
-                        </tbody>
-                    </table>
+                    <SettingsKeyValue
+                        items={overrideRows.flatMap(([cli, cfg]) => [
+                            { label: `${cli} model`, value: cfg?.model || '—', mono: true },
+                            { label: `${cli} effort`, value: cfg?.effort || '—', mono: true },
+                        ])}
+                    />
                 )}
-                <div className="settings-overrides-actions">
+                <SettingsActions
+                    status={resetError ? (
+                        <span className="settings-field-error" role="alert">
+                            {resetError}
+                        </span>
+                    ) : null}
+                >
                     <button
                         type="button"
-                        className="settings-action settings-action-discard"
+                        className="settings-action settings-action-danger"
                         onClick={() => void onResetOverrides()}
                         disabled={saving || resetting || overrideRows.length === 0}
                     >
                         {resetting ? 'Resetting…' : 'Reset overrides'}
                     </button>
-                    {resetError ? (
-                        <span className="settings-field-error" role="alert">
-                            {resetError}
-                        </span>
-                    ) : null}
-                </div>
+                </SettingsActions>
             </SettingsSection>
         </form>
     );

package/public/manager/src/settings/pages/Network.tsx

@@ -9,6 +9,7 @@ import type { SettingsPageProps, DirtyEntry } from '../types';
 import { TextField, SelectField, ToggleField } from '../fields';
 import {
     SettingsSection,
+    SettingsNote,
     PageError,
     PageLoading,
     PageOffline,
@@ -297,18 +298,18 @@ export default function Network({ port, client, dirty, registerSave }: SettingsP
                         });
                     }}
                 />
-                <p className="settings-section-hint">
+                <SettingsNote>
                     <strong>off</strong> — only loopback can talk to the API.{' '}
                     <strong>http-only</strong> — remote can issue HTTP requests but no
                     WebSocket upgrades. <strong>full</strong> — HTTP + WebSocket open to
                     remote (use with auth).
-                </p>
+                </SettingsNote>
                 {lockoutRisk && (
-                    <InlineWarn role="alert">
+                    <SettingsNote tone="error" role="alert">
                         Saving will close remote access while you're connected from
                         <code> {typeof window !== 'undefined' ? window.location.host : ''} </code>
                         — you will be locked out. Reach the dashboard over loopback first.
-                    </InlineWarn>
+                    </SettingsNote>
                 )}
                 {remoteEnabled && (
                     <>

package/public/manager/src/settings/pages/Permissions.tsx

@@ -9,6 +9,10 @@ import type { SettingsPageProps, DirtyEntry } from '../types';
 import { ChipListField, SelectField } from '../fields';
 import {
     SettingsSection,
+    SettingsNote,
+    SettingsKeyValue,
+    StatusBadge,
+    type StatusTone,
     PageError,
     PageLoading,
     PageOffline,
@@ -119,6 +123,16 @@ export function isAllowlistValid(tokens: ReadonlyArray<string>): boolean {
     return tokens.every(isPermissionToken);
 }
 
+// Badge tone for the saved-policy readout: Auto (YOLO) is the risky policy,
+// Safe reads as healthy, Unrecognized needs attention, Custom/Not provided read neutrally.
+function configuredPolicyTone(value: unknown): StatusTone {
+    if (value === 'auto') return 'warn';
+    if (value === 'safe') return 'ok';
+    if (Array.isArray(value) && isPermissionsPolicy(value)) return 'neutral';
+    if (value === null || value === undefined) return 'neutral';
+    return 'error';
+}
+
 // ─── Page component ──────────────────────────────────────────────────
 
 const MODE_OPTIONS = [
@@ -261,11 +275,32 @@ export default function Permissions({ port, client, dirty, registerSave }: Setti
     const isEmpty = mode === 'custom' && tokens.length === 0;
 
     const activeSummary = configuredPolicyLabel(state.data.permissions);
+    const policyTone = configuredPolicyTone(state.data.permissions);
 
     return (
         <form className="settings-page-form" onSubmit={(event) => event.preventDefault()}>
             <SettingsSection
-                title="Permissions"
+                title="Saved policy"
+                hint="The permission policy currently saved on this instance."
+            >
+                {/* `.settings-readonly-line` is a test contract: its textContent
+                    must read "Configured policy: <label>". */}
+                <SettingsKeyValue
+                    items={[{
+                        label: 'Configured policy:',
+                        value: <>{' '}<StatusBadge tone={policyTone}>{activeSummary}</StatusBadge></>,
+                        className: 'settings-readonly-line',
+                    }]}
+                />
+                {original?.mode === 'unknown' && (
+                    <SettingsNote>
+                        Unrecognized value: choose a policy below (or in Agent) to replace it.
+                    </SettingsNote>
+                )}
+            </SettingsSection>
+
+            <SettingsSection
+                title="Change policy"
                 hint="Selecting a value changes the draft. Save applies it. Auto (YOLO) requests automatic approval or permission bypass. Behavior varies by runtime."
             >
                 <SelectField
@@ -298,10 +333,10 @@ export default function Permissions({ port, client, dirty, registerSave }: Setti
                                         : null
                             }
                         />
-                        <p className="settings-section-hint">
+                        <SettingsNote>
                             Each chip is a permission token. Examples: <code>bash</code>,
                             <code> read</code>, <code> write</code>, <code> mcp.*</code>.
-                        </p>
+                        </SettingsNote>
                         {isEmpty && (
                             <InlineWarn role="alert">
                                 An empty Custom allowlist cannot be saved.
@@ -311,19 +346,6 @@ export default function Permissions({ port, client, dirty, registerSave }: Setti
                     </>
                 )}
             </SettingsSection>
-
-            <SettingsSection
-                title="Saved policy"
-                hint="Shows the saved permission policy."
-            >
-                <p className="settings-readonly-line">
-                    <span className="settings-field-label">Configured policy:</span>{' '}
-                    <span>{activeSummary}</span>
-                </p>
-                {original?.mode === 'unknown' ? (
-                    <p className="settings-section-hint">Unrecognized value: choose a policy above (or in Agent) to replace it.</p>
-                ) : null}
-            </SettingsSection>
         </form>
     );
 }

package/public/manager/src/settings/pages/Prompts.tsx

@@ -16,10 +16,11 @@ import {
     PageError,
     PageLoading,
     PageOffline,
+    SettingsNote,
     SettingsSection,
+    StatusBadge,
     usePageSnapshot,
 } from './page-shell';
-import { InlineWarn } from './components/InlineWarn';
 
 type PromptResponse = { content?: string };
 
@@ -268,7 +269,7 @@ export default function Prompts({ port, client, dirty, registerSave }: SettingsP
                     <span className="settings-field-label">a2.md</span>
                     <textarea
                         id="prompt-system-body"
-                        className="settings-field-monospace"
+                        className="settings-mono-input"
                         value={systemDraft}
                         rows={14}
                         spellCheck={false}
@@ -276,9 +277,10 @@ export default function Prompts({ port, client, dirty, registerSave }: SettingsP
                     />
                 </label>
                 {systemDraft !== originalSystem && (
-                    <p className="settings-section-hint">
+                    <SettingsNote>
+                        <StatusBadge tone="warn">Unsaved</StatusBadge>{' '}
                         Pending edits to a2.md.
-                    </p>
+                    </SettingsNote>
                 )}
             </SettingsSection>
 
@@ -287,9 +289,9 @@ export default function Prompts({ port, client, dirty, registerSave }: SettingsP
                 hint="Edit individual prompt template bodies. Saving regenerates b automatically."
             >
                 {flatList.length === 0 ? (
-                    <InlineWarn tone="info">
+                    <SettingsNote>
                         No templates returned by /api/prompt-templates.
-                    </InlineWarn>
+                    </SettingsNote>
                 ) : (
                     <>
                         <label
@@ -320,7 +322,7 @@ export default function Prompts({ port, client, dirty, registerSave }: SettingsP
                             </span>
                             <textarea
                                 id="prompt-template-body"
-                                className="settings-field-monospace"
+                                className="settings-mono-input"
                                 value={templateDraft}
                                 rows={16}
                                 spellCheck={false}
@@ -329,9 +331,10 @@ export default function Prompts({ port, client, dirty, registerSave }: SettingsP
                             />
                         </label>
                         {templateBodyDirty && (
-                            <p className="settings-section-hint">
+                            <SettingsNote>
+                                <StatusBadge tone="warn">Unsaved</StatusBadge>{' '}
                                 Pending edits to {activeTemplateId}.md.
-                            </p>
+                            </SettingsNote>
                         )}
                     </>
                 )}