opencode-landstrip 0.18.34 → 0.18.36

package/tui.ts

@@ -12,7 +12,7 @@ import type {
   TuiSlotPlugin,
 } from '@opencode-ai/plugin/tui';
 import { RGBA } from '@opentui/core';
-import { useTerminalDimensions } from '@opentui/solid';
+import { Portal, useTerminalDimensions } from '@opentui/solid';
 import { Fragment, jsx, jsxs } from '@opentui/solid/jsx-runtime';
 import { createSignal, onCleanup, onMount } from 'solid-js';
 
@@ -27,7 +27,7 @@ import {
   removeDiscoveryFile,
   sessionAllows,
   sessionAllowancesFor,
-  sandboxSummary,
+  sandboxConfigTarget,
   sessionScopeFor,
   rootSessionIDFor,
   setSandboxConfigEnabled,
@@ -118,26 +118,21 @@ function formatPath(input: string, base: string): string {
   return absolute;
 }
 
-function selectedForeground(theme: TuiSlotContext['theme']['current']): RGBA {
-  const resolved = theme as typeof theme & { _hasSelectedListItemText?: boolean };
-  if (resolved._hasSelectedListItemText) return theme.selectedListItemText;
-
-  if (theme.background.a === 0) {
-    const { r, g, b } = theme.warning;
-    const luminance = 0.299 * r + 0.587 * g + 0.114 * b;
-    return luminance > 0.5 ? RGBA.fromInts(0, 0, 0) : RGBA.fromInts(255, 255, 255);
-  }
-  return theme.background;
+function selectedForeground(background: RGBA): RGBA {
+  const luminance = 0.2126 * background.r + 0.7152 * background.g + 0.0722 * background.b;
+  return luminance > 0.5 ? RGBA.fromInts(0, 0, 0) : RGBA.fromInts(255, 255, 255);
 }
 
 const tui: TuiPlugin = async (api, options, meta) => {
   const optionOverrides = normalizeOptions(options);
+  const enabledManagedByOptions = optionOverrides.enabled !== undefined;
 
   function LandstripPermissionPrompt(rawProps: Record<string, unknown>) {
     const props = rawProps as unknown as PermissionPromptProps<string>;
     const theme = api.theme.current;
     const dimensions = useTerminalDimensions();
     const [selected, setSelected] = createSignal(0);
+    const [expanded, setExpanded] = createSignal(false);
     onMount(props.onShow);
 
     function move(direction: number): void {
@@ -152,12 +147,16 @@ const tui: TuiPlugin = async (api, options, meta) => {
     const unregister = api.keymap.registerLayer({
       priority: 1000,
       bindings: [
-        { key: 'left', cmd: () => move(-1) },
-        { key: 'h', cmd: () => move(-1) },
-        { key: 'right', cmd: () => move(1) },
-        { key: 'l', cmd: () => move(1) },
-        { key: 'return', cmd: submit },
-        { key: 'escape', cmd: props.onCancel },
+        { key: 'left', desc: 'Previous permission option', group: 'Sandbox', cmd: () => move(-1) },
+        { key: 'right', desc: 'Next permission option', group: 'Sandbox', cmd: () => move(1) },
+        { key: 'return', desc: 'Select permission option', group: 'Sandbox', cmd: submit },
+        { key: 'escape', desc: 'Reject permission', group: 'Sandbox', cmd: props.onCancel },
+        {
+          key: 'ctrl+f',
+          desc: 'Toggle permission prompt fullscreen',
+          group: 'Sandbox',
+          cmd: () => setExpanded((value) => !value),
+        },
       ],
     });
     onCleanup(unregister);
@@ -177,13 +176,126 @@ const tui: TuiPlugin = async (api, options, meta) => {
         },
         children: jsx('text', {
           get fg() {
-            return selected() === index ? selectedForeground(theme) : theme.textMuted;
+            return selected() === index ? selectedForeground(theme.warning) : theme.textMuted;
           },
           children: option.label,
         }),
       }),
     );
 
+    const children = [
+      jsxs('box', {
+        gap: 1,
+        paddingLeft: 1,
+        paddingRight: 3,
+        paddingTop: 1,
+        paddingBottom: 1,
+        flexGrow: 1,
+        children: [
+          jsxs('box', {
+            flexDirection: 'column',
+            gap: 0,
+            paddingLeft: 1,
+            flexShrink: 0,
+            children: [
+              jsxs('box', {
+                flexDirection: 'row',
+                gap: 1,
+                flexShrink: 0,
+                children: [
+                  jsx('text', { fg: theme.warning, children: '△' }),
+                  jsx('text', { fg: theme.text, children: 'Permission required' }),
+                ],
+              }),
+              jsxs('box', {
+                flexDirection: 'row',
+                gap: 1,
+                paddingLeft: 2,
+                flexShrink: 0,
+                children: [
+                  jsx('text', { fg: theme.textMuted, flexShrink: 0, children: props.icon }),
+                  jsx('text', { fg: theme.text, wrapMode: 'word', children: props.title }),
+                ],
+              }),
+            ],
+          }),
+        ],
+      }),
+      jsxs('box', {
+        get flexDirection() {
+          return dimensions().width < 80 ? 'column' : 'row';
+        },
+        flexShrink: 0,
+        gap: 1,
+        paddingTop: 1,
+        paddingLeft: 2,
+        paddingRight: 3,
+        paddingBottom: 1,
+        backgroundColor: theme.backgroundElement,
+        get justifyContent() {
+          return dimensions().width < 80 ? 'flex-start' : 'space-between';
+        },
+        get alignItems() {
+          return dimensions().width < 80 ? 'flex-start' : 'center';
+        },
+        children: [
+          jsx('box', {
+            flexDirection: 'row',
+            gap: 1,
+            flexShrink: 0,
+            children: optionButtons,
+          }),
+          jsxs('box', {
+            flexDirection: 'row',
+            gap: 2,
+            flexShrink: 0,
+            children: [
+              jsxs('text', {
+                fg: theme.text,
+                children: [
+                  'ctrl+f ',
+                  jsx('span', {
+                    style: { fg: theme.textMuted },
+                    children: expanded() ? 'minimize' : 'fullscreen',
+                  }),
+                ],
+              }),
+              jsxs('text', {
+                fg: theme.text,
+                children: [
+                  '⇆ ',
+                  jsx('span', { style: { fg: theme.textMuted }, children: 'select' }),
+                ],
+              }),
+              jsxs('text', {
+                fg: theme.text,
+                children: [
+                  'enter ',
+                  jsx('span', { style: { fg: theme.textMuted }, children: 'confirm' }),
+                ],
+              }),
+            ],
+          }),
+        ],
+      }),
+    ];
+
+    if (expanded()) {
+      return Portal({
+        children: jsxs('box', {
+          top: dimensions().height * -1 + 1,
+          bottom: 1,
+          left: 2,
+          right: 2,
+          position: 'absolute',
+          border: ['left'],
+          borderColor: theme.warning,
+          customBorderChars: promptBorderChars,
+          backgroundColor: theme.backgroundPanel,
+          children,
+        }),
+      });
+    }
     return jsxs('box', {
       top: 0,
       maxHeight: 15,
@@ -195,92 +307,7 @@ const tui: TuiPlugin = async (api, options, meta) => {
       borderColor: theme.warning,
       customBorderChars: promptBorderChars,
       backgroundColor: theme.backgroundPanel,
-      children: [
-        jsxs('box', {
-          gap: 1,
-          paddingLeft: 1,
-          paddingRight: 3,
-          paddingTop: 1,
-          paddingBottom: 1,
-          flexGrow: 1,
-          children: [
-            jsxs('box', {
-              flexDirection: 'column',
-              gap: 0,
-              paddingLeft: 1,
-              flexShrink: 0,
-              children: [
-                jsxs('box', {
-                  flexDirection: 'row',
-                  gap: 1,
-                  flexShrink: 0,
-                  children: [
-                    jsx('text', { fg: theme.warning, children: '△' }),
-                    jsx('text', { fg: theme.text, children: 'Permission required' }),
-                  ],
-                }),
-                jsxs('box', {
-                  flexDirection: 'row',
-                  gap: 1,
-                  paddingLeft: 2,
-                  flexShrink: 0,
-                  children: [
-                    jsx('text', { fg: theme.textMuted, flexShrink: 0, children: props.icon }),
-                    jsx('text', { fg: theme.text, wrapMode: 'word', children: props.title }),
-                  ],
-                }),
-              ],
-            }),
-          ],
-        }),
-        jsxs('box', {
-          get flexDirection() {
-            return dimensions().width < 80 ? 'column' : 'row';
-          },
-          flexShrink: 0,
-          gap: 1,
-          paddingTop: 1,
-          paddingLeft: 2,
-          paddingRight: 3,
-          paddingBottom: 1,
-          backgroundColor: theme.backgroundElement,
-          get justifyContent() {
-            return dimensions().width < 80 ? 'flex-start' : 'space-between';
-          },
-          get alignItems() {
-            return dimensions().width < 80 ? 'flex-start' : 'center';
-          },
-          children: [
-            jsx('box', {
-              flexDirection: 'row',
-              gap: 1,
-              flexShrink: 0,
-              children: optionButtons,
-            }),
-            jsxs('box', {
-              flexDirection: 'row',
-              gap: 2,
-              flexShrink: 0,
-              children: [
-                jsxs('text', {
-                  fg: theme.text,
-                  children: [
-                    '⇆ ',
-                    jsx('span', { style: { fg: theme.textMuted }, children: 'select' }),
-                  ],
-                }),
-                jsxs('text', {
-                  fg: theme.text,
-                  children: [
-                    'enter ',
-                    jsx('span', { style: { fg: theme.textMuted }, children: 'confirm' }),
-                  ],
-                }),
-              ],
-            }),
-          ],
-        }),
-      ],
+      children,
     });
   }
 
@@ -662,68 +689,176 @@ const tui: TuiPlugin = async (api, options, meta) => {
     refreshPermissionPresentation,
   );
 
-  // /sandbox shows the config and toggles the persisted `enabled` flag. The
-  // server reads sandbox.json on every tool call, so the toggle takes effect on
-  // the next command without any cross-process signalling.
-  const showSandbox = () => {
+  const [landstripOpen, setLandstripOpen] = createSignal(false);
+  const [confirmingDisable, setConfirmingDisable] = createSignal(false);
+  const [sandboxRevision, setSandboxRevision] = createSignal(0);
+  let unregisterLandstripKeys: (() => void) | undefined;
+  let popLandstripMode: (() => void) | undefined;
+
+  const closeLandstrip = () => {
+    unregisterLandstripKeys?.();
+    popLandstripMode?.();
+    unregisterLandstripKeys = undefined;
+    popLandstripMode = undefined;
+    setConfirmingDisable(false);
+    setLandstripOpen(false);
+  };
+  const toggleLandstrip = () => {
+    if (enabledManagedByOptions) {
+      api.ui.toast({
+        title: 'Landstrip',
+        message: 'Sandbox state is managed by plugin options',
+        variant: 'warning',
+      });
+      return;
+    }
+
     const directory = api.state.path.directory || process.cwd();
     const config = loadConfig(directory, optionOverrides);
-    const { globalPath, projectPath } = getConfigPaths(directory);
-    const next = !config.enabled;
-    const message =
-      sandboxSummary(config, globalPath, projectPath) +
-      `\n\n${next ? 'Enable' : 'Disable'} the sandbox?  (enter = ${next ? 'enable' : 'disable'}, esc = close)`;
-
-    // No `clear()` in onConfirm: the host pops the dialog itself, and its
-    // `clear()` re-invokes onClose, which would recurse and freeze the TUI.
-    api.ui.dialog.replace(() =>
-      api.ui.DialogConfirm({
-        title: 'Sandbox',
-        message,
-        onConfirm: () => {
-          const scope = setSandboxConfigEnabled(directory, next);
-          refreshSandboxStatus?.();
-          api.ui.toast({
-            title: 'Sandbox',
-            message: `Sandbox ${next ? 'enabled' : 'disabled'} (${scope} config)`,
-            variant: next ? 'success' : 'warning',
-          });
-        },
-      }),
-    );
+    if (config.enabled && !confirmingDisable()) {
+      setConfirmingDisable(true);
+      return;
+    }
+    setConfirmingDisable(false);
+    const enabled = !config.enabled;
+    const scope = setSandboxConfigEnabled(directory, enabled, optionOverrides);
+    refreshSandboxStatus?.();
+    api.ui.toast({
+      title: 'Landstrip',
+      message: `Sandbox ${enabled ? 'enabled' : 'disabled'} (${scope} config)`,
+      variant: enabled ? 'success' : 'warning',
+    });
+  };
+  const cancelLandstrip = () => {
+    if (confirmingDisable()) setConfirmingDisable(false);
+    else closeLandstrip();
   };
 
+  function LandstripPane() {
+    const theme = api.theme.current;
+    const dimensions = useTerminalDimensions();
+
+    const row = (label: string, value: string) =>
+      jsxs('box', {
+        flexDirection: 'row',
+        paddingLeft: 2,
+        paddingRight: 2,
+        children: [
+          jsx('text', { fg: theme.textMuted, width: 22, children: label }),
+          jsx('text', { fg: theme.text, flexGrow: 1, wrapMode: 'word', children: value }),
+        ],
+      });
+
+    return Portal({
+      get children() {
+        if (!landstripOpen()) return null;
+        sandboxRevision();
+        const directory = api.state.path.directory || process.cwd();
+        const config = loadConfig(directory, optionOverrides);
+        const target = sandboxConfigTarget(directory);
+        const values = (items: readonly string[]) => items.join(', ') || 'none';
+        const status = enabledManagedByOptions
+          ? config.enabled
+            ? 'Active (plugin options)'
+            : 'Disabled by plugin options'
+          : config.enabled
+            ? 'Active'
+            : 'Disabled by configuration';
+        return jsxs('box', {
+          position: 'absolute',
+          zIndex: 4000,
+          bottom: 0,
+          left: 0,
+          right: 0,
+          get height() {
+            return Math.min(22, Math.max(12, dimensions().height - 2));
+          },
+          flexDirection: 'column',
+          border: ['top'],
+          borderColor: theme.primary,
+          backgroundColor: theme.backgroundPanel,
+          children: [
+            jsxs('box', {
+              flexDirection: 'row',
+              paddingLeft: 2,
+              paddingRight: 2,
+              paddingTop: 1,
+              paddingBottom: 1,
+              justifyContent: 'space-between',
+              children: [
+                jsx('text', { fg: theme.primary, children: 'Landstrip' }),
+                jsx('text', {
+                  fg: config.enabled ? theme.success : theme.warning,
+                  children: status,
+                }),
+              ],
+            }),
+            row('Network', config.network.allowNetwork ? 'Unrestricted' : 'Proxied'),
+            row('Allowed Domains', values(config.network.allowedDomains)),
+            row('Denied Domains', values(config.network.deniedDomains)),
+            row('Allowed Reads', values(config.filesystem.allowRead)),
+            row('Denied Reads', values(config.filesystem.denyRead)),
+            row('Allowed Writes', values(config.filesystem.allowWrite)),
+            row('Denied Writes', values(config.filesystem.denyWrite)),
+            row(
+              'Configuration Scope',
+              enabledManagedByOptions
+                ? 'Plugin options'
+                : target.scope === 'project'
+                  ? 'Project'
+                  : 'Global',
+            ),
+            row('Configuration File', formatPath(target.path, directory)),
+            jsx('box', { flexGrow: 1 }),
+            jsx('text', {
+              fg: confirmingDisable() ? theme.error : theme.textMuted,
+              marginLeft: 2,
+              marginRight: 2,
+              marginBottom: 1,
+              children: confirmingDisable()
+                ? 'Disable the sandbox? Commands will run without OS isolation.  Enter confirm · Esc cancel'
+                : enabledManagedByOptions
+                  ? 'Sandbox state is managed by plugin options · Esc close'
+                  : `Enter ${config.enabled ? 'disable' : 'enable'} · Esc close`,
+            }),
+          ],
+        });
+      },
+    });
+  }
+
+  const showLandstrip = () => {
+    if (landstripOpen()) return;
+    setLandstripOpen(true);
+    popLandstripMode = api.mode.push('modal');
+    unregisterLandstripKeys = api.keymap.registerLayer({
+      priority: 1000,
+      bindings: [
+        { key: 'return', desc: 'Toggle sandbox', group: 'Landstrip', cmd: toggleLandstrip },
+        { key: 'escape', desc: 'Close Landstrip', group: 'Landstrip', cmd: cancelLandstrip },
+      ],
+    });
+  };
+  api.lifecycle.onDispose(closeLandstrip);
+
   api.keymap.registerLayer({
     commands: [
       {
         namespace: 'palette',
-        name: 'sandbox',
-        title: 'Sandbox',
-        desc: 'Inspect and toggle the sandbox',
-        category: 'Sandbox',
+        name: 'landstrip',
+        title: 'Landstrip',
+        desc: 'Manage the Landstrip sandbox',
+        category: 'Landstrip',
         suggested: true,
-        slash: { name: 'sandbox' },
-        slashName: 'sandbox',
-        run: showSandbox,
+        slash: { name: 'landstrip' },
+        slashName: 'landstrip',
+        run: showLandstrip,
       },
     ],
   });
 
-  api.command?.register(() => [
-    {
-      title: 'Sandbox',
-      value: 'sandbox',
-      description: 'Inspect and toggle the sandbox',
-      category: 'Sandbox',
-      suggested: true,
-      slash: { name: 'sandbox' },
-      onSelect: showSandbox,
-    },
-  ]);
-
   // Persistent status badge in the prompt area.
   try {
-    const [sandboxRevision, setSandboxRevision] = createSignal(0);
     const statusBadge = (ctx: TuiSlotContext) => {
       sandboxRevision();
       const directory = api.state.path.directory || process.cwd();
@@ -741,6 +876,7 @@ const tui: TuiPlugin = async (api, options, meta) => {
 
     const statusSlot: TuiSlotPlugin = {
       slots: {
+        app: () => jsx(LandstripPane, {}),
         home_prompt_right: (ctx) => statusBadge(ctx),
         session_prompt: (_ctx, props) => renderSessionPrompt(props),
         session_prompt_right: (ctx) => statusBadge(ctx),
@@ -749,7 +885,7 @@ const tui: TuiPlugin = async (api, options, meta) => {
     api.slots.register(statusSlot);
     refreshSandboxStatus = () => setSandboxRevision((revision) => revision + 1);
   } catch {
-    // Solid runtime unavailable on this host — skip the status badge.
+    // Solid runtime unavailable on this host — skip the pane and status badge.
   }
 
   // First-run onboarding: a single quiet pointer to the default-strict policy
@@ -759,7 +895,7 @@ const tui: TuiPlugin = async (api, options, meta) => {
     api.kv.set('onboarded', true);
     api.ui.toast({
       title: 'Sandbox active',
-      message: 'Landstrip sandbox is on. Run /sandbox to inspect it.',
+      message: 'Landstrip sandbox is on. Run /landstrip to inspect it.',
       variant: 'info',
       duration: 8000,
     });