aidevops 3.31.81 → 3.32.0

package/README.md

@@ -60,7 +60,7 @@ The result: an AI operations platform that manages projects across every busines
 [![Copyright](https://img.shields.io/badge/Copyright-Marcus%20Quinn%202025--2026-blue.svg)](https://github.com/marcusquinn)
 
 <!-- Release & Version Info -->
-[![Version](https://img.shields.io/badge/Version-3.31.81-blue.svg)](https://github.com/marcusquinn/aidevops/releases)
+[![Version](https://img.shields.io/badge/Version-3.32.0-blue.svg)](https://github.com/marcusquinn/aidevops/releases)
 [![npm version](https://img.shields.io/npm/v/aidevops)](https://www.npmjs.com/package/aidevops)
 [![Homebrew](https://img.shields.io/badge/homebrew-marcusquinn%2Ftap-orange)](https://github.com/marcusquinn/homebrew-tap)
 [![GitHub repository](https://img.shields.io/badge/github-repository-181717.svg?logo=github)](https://github.com/marcusquinn/aidevops)

package/VERSION

@@ -1 +1 @@
-3.31.81
+3.32.0

package/aidevops.sh

@@ -5,7 +5,7 @@
 # AI DevOps Framework CLI
 # Usage: aidevops <command> [options]
 #
-# Version: 3.31.81
+# Version: 3.32.0
 
 set -euo pipefail
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aidevops",
-  "version": "3.31.81",
+  "version": "3.32.0",
   "description": "AI DevOps Framework - AI-assisted development workflows, code quality, and deployment automation",
   "type": "module",
   "workspaces": [

package/packages/gui-shared/src/fixtures.ts

@@ -389,12 +389,56 @@ export const statusFixture: GuiStatusData = {
         label: "Fleet, sync, and secure messages",
         data_class: "mail/messages",
         labels: ["client-confidential"],
-        surface_ids: ["devices", "messagingAccounts", "emailAccounts", "inbox", "campaigns", "cases", "projectConfig", "knowledge"],
+        surface_ids: ["devices", "messagingAccounts", "emailAccounts"],
         encrypted: true,
         state: "planned",
         preview_policy: "hidden_while_locked",
         actions_policy: "disabled_while_locked",
       },
+      {
+        id: "ai-session-history",
+        label: "AI sessions, worker threads, and prompts",
+        data_class: "session/history",
+        labels: ["confidential", "local-ai", "provider-policy"],
+        surface_ids: ["aiSessions", "workers"],
+        encrypted: true,
+        state: "planned",
+        preview_policy: "metadata_only",
+        actions_policy: "disabled_while_locked",
+      },
+      {
+        id: "repo-project-metadata",
+        label: "Repos, deployments, routines, and project metadata",
+        data_class: "repo/project metadata",
+        labels: ["internal", "client-confidential"],
+        surface_ids: ["git", "repos", "projects", "deployments", "routines"],
+        encrypted: true,
+        state: "planned",
+        preview_policy: "metadata_only",
+        actions_policy: "disabled_while_locked",
+      },
+      {
+        id: "infrastructure-inventory",
+        label: "Infrastructure, accounts, domains, and servers",
+        data_class: "infrastructure inventory",
+        labels: ["confidential", "credential-adjacent"],
+        surface_ids: ["vpnsProxies", "apps", "installation", "registrars", "hosts", "servers", "domains"],
+        encrypted: true,
+        state: "planned",
+        preview_policy: "metadata_only",
+        actions_policy: "disabled_while_locked",
+      },
+      {
+        id: "creator-business-records",
+        label: "Creator, business, and client records",
+        data_class: "business records",
+        labels: ["client-confidential", "personal-data"],
+        surface_ids: ["brands", "personas", "websites", "forums", "socialMedia", "marketplaces", "tasks", "contacts", "events", "notes", "bookmarks", "inbox", "campaigns", "cases", "projectConfig", "feedback", "knowledge", "maintenance", "performance", "reports"],
+        encrypted: true,
+        state: "planned",
+        preview_policy: "metadata_only",
+        actions_policy: "disabled_while_locked",
+      },
     ],
     devices: [
       {

package/packages/gui-web/src/App.tsx

@@ -8,6 +8,8 @@ import { DesktopStatusBar } from "./DesktopStatusBar";
 import { type NavigationHistory, nextHistoryIndex, useNavigationHistoryKeyboard } from "./navigation-history";
 import { ScreenshotCaptureNotificationHost } from "./ScreenshotCaptureNotification";
 import { fetchStatus, mockedStatus } from "./status-client";
+import type { VaultDialogIntent } from "./VaultBadges";
+import { VaultPassphraseModal } from "./VaultPassphraseModal";
 
 interface WebKitBridgeWindow extends Window {
   webkit?: {
@@ -105,6 +107,7 @@ export function App(): ReactElement {
   const [conversationMode, setConversationMode] = useState<ConversationMode>("ai");
   const [selectedLocalRepoIndex, setSelectedLocalRepoIndex] = useState(0);
   const [selectedSessionId, setSelectedSessionId] = useState<string | undefined>();
+  const [vaultDialogIntent, setVaultDialogIntent] = useState<VaultDialogIntent | null>(null);
   const [systemTheme, setSystemTheme] = useState<"light" | "dark">("light");
   const resolvedTheme = themePreference === "system" ? systemTheme : themePreference;
   const activeSurface: SurfaceId = navigation.entries[navigation.index] ?? "overview";
@@ -209,6 +212,12 @@ export function App(): ReactElement {
     setSelectedLocalRepoIndex((current) => Math.min(current, Math.max(0, status.data.local_repos.repos.length - 1)));
   }, [status.data.local_repos.repos.length]);
 
+  useEffect(() => {
+    if (!statusLoading && status.data.vault.readiness.setup_required) {
+      setVaultDialogIntent("setup");
+    }
+  }, [status.data.vault.readiness.setup_required, statusLoading]);
+
   return (
     <main className={machineRailVisible ? "app-shell" : "app-shell machine-rail-collapsed"} aria-busy={statusLoading}>
       <div className="desktop-titlebar-tagline" aria-hidden="true">Your data protected. Your systems managed. Your creations published.</div>
@@ -221,6 +230,7 @@ export function App(): ReactElement {
         conversationMode={conversationMode}
         fontSizePreference={fontSizePreference}
         fontPreference={fontPreference}
+        onVaultRequest={(intent) => setVaultDialogIntent(intent)}
         selectedLocalRepoIndex={selectedLocalRepoIndex}
         selectedSessionId={selectedSessionId}
         setAccentHue={setAccentHue}
@@ -252,6 +262,7 @@ export function App(): ReactElement {
         fileRoot={fileRoot}
         goBack={goBack}
         goForward={goForward}
+        onVaultRequest={(intent) => setVaultDialogIntent(intent)}
         selectedLocalRepoIndex={selectedLocalRepoIndex}
         selectedSessionId={selectedSessionId}
         setActiveSurface={setActiveSurface}
@@ -263,6 +274,7 @@ export function App(): ReactElement {
         status={status.data}
       />
       <DesktopStatusBar status={status.data} />
+      {vaultDialogIntent ? <VaultPassphraseModal intent={vaultDialogIntent} onClose={() => setVaultDialogIntent(null)} vault={status.data.vault} /> : null}
     </main>
   );
 }

package/packages/gui-web/src/AppNavigation.tsx

@@ -37,7 +37,7 @@ import {
 import type { ContrastPreference, ConversationMode, FontPreference, FontSizePreference, ShellMode, SidebarMode, SurfaceIconName, SurfaceId, SurfaceNavGroup, SurfaceNavItem, ThemePreference } from "./app-model";
 import { dashboardNavItem, navGroups, sidebarModeForSurface, surfaceRecordCounts, text } from "./app-model";
 import { SidebarFooter, wrappedOptionIndex } from "./AppearanceControls";
-import { VaultPadlock, vaultCollectionForSurface, vaultCollectionTooltip } from "./VaultBadges";
+import { type VaultDialogIntent, VaultPadlock, vaultCollectionForSurface, vaultCollectionTooltip, vaultDialogIntentForStatus } from "./VaultBadges";
 
 function AidevopsPromptIcon() {
   return (
@@ -109,13 +109,14 @@ export function MachineRail({ machine }: { machine?: GuiMachineSummary }) {
   );
 }
 
-export function Sidebar({ activeSurface, accentHue, contrastPreference, conversationMode, fontPreference, fontSizePreference, selectedLocalRepoIndex, selectedSessionId, setAccentHue, setActiveSurface, setContrastPreference, setConversationMode, setFontPreference, setFontSizePreference, setSelectedLocalRepoIndex, setSelectedSessionId, setShellMode, setShowBorders, setShowNavCounts, setThemePreference, shellMode, showBorders, showNavCounts, status, themePreference }: {
+export function Sidebar({ activeSurface, accentHue, contrastPreference, conversationMode, fontPreference, fontSizePreference, onVaultRequest, selectedLocalRepoIndex, selectedSessionId, setAccentHue, setActiveSurface, setContrastPreference, setConversationMode, setFontPreference, setFontSizePreference, setSelectedLocalRepoIndex, setSelectedSessionId, setShellMode, setShowBorders, setShowNavCounts, setThemePreference, shellMode, showBorders, showNavCounts, status, themePreference }: {
   activeSurface: SurfaceId;
   accentHue: number;
   contrastPreference: ContrastPreference;
   conversationMode: ConversationMode;
   fontPreference: FontPreference;
   fontSizePreference: FontSizePreference;
+  onVaultRequest: (intent: VaultDialogIntent) => void;
   selectedLocalRepoIndex: number;
   selectedSessionId: string | undefined;
   setAccentHue: (hue: number) => void;
@@ -151,9 +152,9 @@ export function Sidebar({ activeSurface, accentHue, contrastPreference, conversa
         {shellMode === "devices" ? <>
           <SidebarModeTabs mode={sidebarMode} setMode={(mode) => setSidebarMode(mode as SidebarMode)} />
           <ul className="sidebar-top-link">
-            <SidebarItem activeSurface={activeSurface} item={dashboardNavItem} setActiveSurface={setActiveSurface} showCount={false} status={status} />
+            <SidebarItem activeSurface={activeSurface} item={dashboardNavItem} onVaultRequest={onVaultRequest} setActiveSurface={setActiveSurface} showCount={false} status={status} />
           </ul>
-          {visibleGroups.map((group) => <SidebarGroup activeSurface={activeSurface} group={group} key={group.label} recordCounts={recordCounts} setActiveSurface={setActiveSurface} showNavCounts={showNavCounts} status={status} />)}
+          {visibleGroups.map((group) => <SidebarGroup activeSurface={activeSurface} group={group} key={group.label} onVaultRequest={onVaultRequest} recordCounts={recordCounts} setActiveSurface={setActiveSurface} showNavCounts={showNavCounts} status={status} />)}
         </> : <ConversationSidebar
           conversationMode={conversationMode}
           selectedLocalRepoIndex={selectedLocalRepoIndex}
@@ -310,9 +311,10 @@ function SidebarModeTabs<TMode extends SidebarMode | ConversationMode>({ mode, s
   );
 }
 
-function SidebarGroup({ activeSurface, group, recordCounts, setActiveSurface, showNavCounts, status }: {
+function SidebarGroup({ activeSurface, group, onVaultRequest, recordCounts, setActiveSurface, showNavCounts, status }: {
   activeSurface: SurfaceId;
   group: SurfaceNavGroup;
+  onVaultRequest: (intent: VaultDialogIntent) => void;
   recordCounts: Partial<Record<SurfaceId, number>>;
   setActiveSurface: (surface: SurfaceId) => void;
   showNavCounts: boolean;
@@ -322,15 +324,16 @@ function SidebarGroup({ activeSurface, group, recordCounts, setActiveSurface, sh
     <section className="sidebar-group">
       <h2>{group.label}</h2>
       <ul>
-        {group.items.map((item) => <SidebarItem activeSurface={activeSurface} item={item} key={item.id} recordCount={recordCounts[item.id]} setActiveSurface={setActiveSurface} showCount={showNavCounts} status={status} />)}
+        {group.items.map((item) => <SidebarItem activeSurface={activeSurface} item={item} key={item.id} onVaultRequest={onVaultRequest} recordCount={recordCounts[item.id]} setActiveSurface={setActiveSurface} showCount={showNavCounts} status={status} />)}
       </ul>
     </section>
   );
 }
 
-function SidebarItem({ activeSurface, item, recordCount, setActiveSurface, showCount, status }: {
+function SidebarItem({ activeSurface, item, onVaultRequest, recordCount, setActiveSurface, showCount, status }: {
   activeSurface: SurfaceId;
   item: SurfaceNavItem;
+  onVaultRequest: (intent: VaultDialogIntent) => void;
   recordCount?: number;
   setActiveSurface: (surface: SurfaceId) => void;
   showCount: boolean;
@@ -348,7 +351,14 @@ function SidebarItem({ activeSurface, item, recordCount, setActiveSurface, showC
         aria-label={tooltip}
         aria-current={isActive ? "page" : undefined}
         className={isActive ? "surface-link active" : "surface-link"}
-        onClick={() => setActiveSurface(item.id)}
+        onClick={(event) => {
+          if (vaultCollection && event.target instanceof HTMLElement && event.target.closest(".vault-padlock")) {
+            onVaultRequest(vaultDialogIntentForStatus(status.vault));
+            return;
+          }
+
+          setActiveSurface(item.id);
+        }}
         title={tooltip}
         type="button"
       >

package/packages/gui-web/src/AppWorkspace.tsx

@@ -1,6 +1,6 @@
 /* jshint esversion: 11 */
 import { type ReactElement, type ReactNode, useEffect, useState } from "react";
-import { FiAlertTriangle, FiBell, FiCheckCircle, FiChevronLeft, FiChevronRight, FiCommand, FiFileText, FiGlobe, FiHash, FiInfo, FiLogOut, FiMap, FiMessageSquare, FiPaperclip, FiSearch, FiSettings, FiShield, FiTerminal, FiTool, FiUser } from "react-icons/fi";
+import { FiAlertTriangle, FiBell, FiCheckCircle, FiChevronLeft, FiChevronRight, FiCommand, FiFileText, FiGlobe, FiHash, FiInfo, FiLock, FiLogOut, FiMap, FiMessageSquare, FiPaperclip, FiSearch, FiSettings, FiShield, FiTerminal, FiTool, FiUnlock, FiUser } from "react-icons/fi";
 import type { GuiFileRootId, GuiNotificationSummary, GuiStatusData } from "../../gui-shared/src";
 import { SurfaceGlyph } from "./AppNavigation";
 import type { ConversationMode, ShellMode, SurfaceId, SurfaceNavItem } from "./app-model";
@@ -12,7 +12,7 @@ import { TamboConversationPart } from "./GenUiCards";
 import { AppsSurface, EditableInventorySurface, InstallationSurface } from "./InventorySurfaces";
 import { PulseWorkersSurface } from "./PulseWorkersSurface";
 import { AiProvidersSurface, LocalReposSurface, LockedVaultGate, OverviewSurface, PlannedSurface, ProjectsSurface, SecuritySurface, VaultSurface } from "./StatusSurfaces";
-import { isVaultSurfaceLocked, vaultCollectionForSurface } from "./VaultBadges";
+import { type VaultDialogIntent, isVaultSurfaceLocked, vaultCollectionForSurface, vaultDialogIntentForStatus } from "./VaultBadges";
 import { applyCommandPaletteSelection, useHeaderMenuState } from "./workspace-header-state";
 import { useWorkspaceTour, WorkspaceTourProvider } from "./WorkspaceTour";
 
@@ -21,7 +21,7 @@ const communityLinks = {
   x: "https://x.com/marcuswquinn",
 } as const;
 
-export function Workspace({ activeItem, activeSectionLabel, activeSurface, canGoBack, canGoForward, conversationMode, fileRoot, goBack, goForward, selectedLocalRepoIndex, selectedSessionId, setActiveSurface, setConversationMode, setSelectedLocalRepoIndex, setSelectedSessionId, setShellMode, shellMode, status }: {
+export function Workspace({ activeItem, activeSectionLabel, activeSurface, canGoBack, canGoForward, conversationMode, fileRoot, goBack, goForward, onVaultRequest, selectedLocalRepoIndex, selectedSessionId, setActiveSurface, setConversationMode, setSelectedLocalRepoIndex, setSelectedSessionId, setShellMode, shellMode, status }: {
   activeItem: SurfaceNavItem;
   activeSectionLabel: string;
   activeSurface: SurfaceId;
@@ -31,6 +31,7 @@ export function Workspace({ activeItem, activeSectionLabel, activeSurface, canGo
   fileRoot: GuiFileRootId | undefined;
   goBack: () => void;
   goForward: () => void;
+  onVaultRequest?: (intent: VaultDialogIntent) => void;
   selectedLocalRepoIndex: number;
   selectedSessionId: string | undefined;
   setActiveSurface: (surface: SurfaceId) => void;
@@ -41,21 +42,23 @@ export function Workspace({ activeItem, activeSectionLabel, activeSurface, canGo
   shellMode: ShellMode;
   status: GuiStatusData;
 }) {
+  const requestVault = onVaultRequest ?? (() => undefined);
+
   return (
     <section className="app-inset" aria-label={text.workspaceLabel}>
       <WorkspaceTourProvider activeSurface={activeSurface}>
-        <WorkspaceHeader activeItem={activeItem} activeSectionLabel={activeSectionLabel} activeSurface={activeSurface} canGoBack={canGoBack} canGoForward={canGoForward} goBack={goBack} goForward={goForward} setActiveSurface={setActiveSurface} setConversationMode={setConversationMode} setSelectedLocalRepoIndex={setSelectedLocalRepoIndex} setSelectedSessionId={setSelectedSessionId} setShellMode={setShellMode} status={status} />
+        <WorkspaceHeader activeItem={activeItem} activeSectionLabel={activeSectionLabel} activeSurface={activeSurface} canGoBack={canGoBack} canGoForward={canGoForward} goBack={goBack} goForward={goForward} onVaultRequest={requestVault} setActiveSurface={setActiveSurface} setConversationMode={setConversationMode} setSelectedLocalRepoIndex={setSelectedLocalRepoIndex} setSelectedSessionId={setSelectedSessionId} setShellMode={setShellMode} status={status} />
         <div className="workspace-scroll">
           {shellMode === "sessions"
             ? <ConversationWorkspace conversationMode={conversationMode} selectedLocalRepoIndex={selectedLocalRepoIndex} selectedSessionId={selectedSessionId} status={status} />
-            : <SurfaceContent activeItem={activeItem} activeSurface={activeSurface} fileRoot={fileRoot} openSurface={setActiveSurface} status={status} />}
+            : <SurfaceContent activeItem={activeItem} activeSurface={activeSurface} fileRoot={fileRoot} onVaultRequest={requestVault} openSurface={setActiveSurface} status={status} />}
         </div>
       </WorkspaceTourProvider>
     </section>
   );
 }
 
-function WorkspaceHeader({ activeItem, activeSectionLabel, activeSurface, canGoBack, canGoForward, goBack, goForward, setActiveSurface, setConversationMode, setSelectedLocalRepoIndex, setSelectedSessionId, setShellMode, status }: {
+function WorkspaceHeader({ activeItem, activeSectionLabel, activeSurface, canGoBack, canGoForward, goBack, goForward, onVaultRequest, setActiveSurface, setConversationMode, setSelectedLocalRepoIndex, setSelectedSessionId, setShellMode, status }: {
   activeItem: SurfaceNavItem;
   activeSectionLabel: string;
   activeSurface: SurfaceId;
@@ -63,6 +66,7 @@ function WorkspaceHeader({ activeItem, activeSectionLabel, activeSurface, canGoB
   canGoForward: boolean;
   goBack: () => void;
   goForward: () => void;
+  onVaultRequest: (intent: VaultDialogIntent) => void;
   setActiveSurface: (surface: SurfaceId) => void;
   setConversationMode: (mode: ConversationMode) => void;
   setSelectedLocalRepoIndex: (index: number) => void;
@@ -146,7 +150,7 @@ function WorkspaceHeader({ activeItem, activeSectionLabel, activeSurface, canGoB
           <button aria-expanded={headerMenus.profileOpen} aria-label={`Open profile menu for ${userName}`} className="profile-avatar-button" onClick={headerMenus.toggleProfile} title={userName} type="button">
             <span>{userInitials}</span>
           </button>
-          {headerMenus.profileOpen ? <ProfileMenu openSurface={(surface) => openItem({ surface })} userName={userName} /> : null}
+          {headerMenus.profileOpen ? <ProfileMenu onVaultRequest={onVaultRequest} openSurface={(surface) => openItem({ surface })} status={status} userName={userName} /> : null}
         </div>
       </div>
       {headerMenus.assistantOpen ? <AssistantPanel activeSurface={activeSurface} userName={userName} /> : null}
@@ -364,7 +368,9 @@ function ChatBubble({ body, speaker, title }: { body: string; speaker: "assistan
   );
 }
 
-function ProfileMenu({ openSurface, userName }: { openSurface: (surface: SurfaceId) => void; userName: string }): ReactElement {
+function ProfileMenu({ onVaultRequest, openSurface, status, userName }: { onVaultRequest: (intent: VaultDialogIntent) => void; openSurface: (surface: SurfaceId) => void; status: GuiStatusData; userName: string }): ReactElement {
+  const vaultIntent = vaultDialogIntentForStatus(status.vault);
+  const VaultIcon = vaultIntent === "lock" ? FiLock : FiUnlock;
   return (
     <div className="popover-menu profile-menu" role="menu">
       <div className="profile-menu-heading">
@@ -374,6 +380,7 @@ function ProfileMenu({ openSurface, userName }: { openSurface: (surface: Surface
       <button onClick={() => openSurface("settings")} role="menuitem" type="button"><FiSettings aria-hidden="true" /> Settings</button>
       <button onClick={() => openSurface("settings")} role="menuitem" type="button"><FiCommand aria-hidden="true" /> Theme</button>
       <button onClick={() => openSurface("settings")} role="menuitem" type="button"><FiGlobe aria-hidden="true" /> Language</button>
+      <button onClick={() => onVaultRequest(vaultIntent)} role="menuitem" type="button"><VaultIcon aria-hidden="true" /> {vaultIntent === "lock" ? "Lock Vault" : "Unlock Vault"}</button>
       <div className="menu-separator" />
       <strong>Community</strong>
       <a href={communityLinks.github} rel="noreferrer" role="menuitem" target="_blank"><FiMessageSquare aria-hidden="true" /> GitHub</a>
@@ -397,10 +404,11 @@ function AssistantPanel({ activeSurface, userName }: { activeSurface: SurfaceId;
   );
 }
 
-function SurfaceContent({ activeItem, activeSurface, fileRoot, openSurface, status }: {
+function SurfaceContent({ activeItem, activeSurface, fileRoot, onVaultRequest, openSurface, status }: {
   activeItem: SurfaceNavItem;
   activeSurface: SurfaceId;
   fileRoot: GuiFileRootId | undefined;
+  onVaultRequest: (intent: VaultDialogIntent) => void;
   openSurface: (surface: SurfaceId) => void;
   status: GuiStatusData;
 }) {
@@ -412,7 +420,7 @@ function SurfaceContent({ activeItem, activeSurface, fileRoot, openSurface, stat
     settings: <SettingsSurface status={status} />,
     notifications: <NotificationsSurface openSurface={openSurface} status={status} />,
     admin: <AdminSurface />,
-    vault: <VaultSurface status={status} />,
+    vault: <VaultSurface onVaultRequest={onVaultRequest} status={status} />,
     aiSessions: <AiSessionsSurface selectedRepoIndex={0} status={status} />,
     channels: <CommsConversationSurface mode="channels" />,
     directMessages: <CommsConversationSurface mode="directMessages" />,
@@ -450,7 +458,7 @@ function SurfaceContent({ activeItem, activeSurface, fileRoot, openSurface, stat
   };
 
   if (isVaultSurfaceLocked(status.vault, activeSurface) && vaultCollection) {
-    return <LockedVaultGate collection={vaultCollection} label={activeItem.label} vault={status.vault} />;
+    return <LockedVaultGate collection={vaultCollection} label={activeItem.label} onVaultRequest={onVaultRequest} vault={status.vault} />;
   }
 
   if (activeSurface === "git") {

package/packages/gui-web/src/StatusSurfaces.tsx

@@ -4,7 +4,7 @@ import type { GuiAiAppSummary, GuiLocalRepoSetupSummary, GuiSetupTargetSummary,
 import { plannedHomes, text } from "./app-model";
 import { FileExplorerSurface } from "./FileExplorerSurface";
 import { PathActions } from "./PathActions";
-import { VaultPadlock } from "./VaultBadges";
+import { type VaultDialogIntent, VaultPadlock, vaultDialogIntentForStatus } from "./VaultBadges";
 
 export { AiProvidersSurface } from "./AiProvidersSurface";
 
@@ -121,7 +121,7 @@ export function SecuritySurface({ status }: { status: GuiStatusData }) {
   );
 }
 
-export function VaultSurface({ status }: { status: GuiStatusData }) {
+export function VaultSurface({ onVaultRequest, status }: { onVaultRequest: (intent: VaultDialogIntent) => void; status: GuiStatusData }) {
   const vault = status.vault;
   const vaultCollection = vault.collections.find((collection) => collection.surface_ids.includes("vault")) ?? vault.collections[0];
   const readiness = [
@@ -150,7 +150,7 @@ export function VaultSurface({ status }: { status: GuiStatusData }) {
             <h2>{text.vault}</h2>
             <p>{text.vaultIntro}</p>
           </div>
-          {vaultCollection ? <VaultPadlock collection={vaultCollection} vault={vault} /> : null}
+          {vaultCollection ? <VaultPadlock collection={vaultCollection} onActivate={onVaultRequest} vault={vault} /> : null}
         </div>
         <ul aria-label="Vault readiness" className="vault-readiness-strip">
           {readiness.map((item) => <li key={item.label}><strong>{item.label}</strong>{item.value}</li>)}
@@ -175,7 +175,7 @@ export function VaultSurface({ status }: { status: GuiStatusData }) {
             <h2>{vault.readiness.setup_required ? "Setup required" : "Setup metadata"}</h2>
             <p>{vault.setup_hint}</p>
           </div>
-          <button className="secondary-action vault-cta" disabled title={vault.unlock_hint} type="button">{text.vaultUnlockCta}</button>
+          <button className="secondary-action vault-cta" onClick={() => onVaultRequest(vaultDialogIntentForStatus(vault))} title={vault.unlock_hint} type="button">{vault.unlocked ? "Lock Vault" : text.vaultUnlockCta}</button>
         </div>
         <ol className="vault-step-list">
           <li>Initialize locally with the hidden-prompt helper.</li>
@@ -191,7 +191,7 @@ export function VaultSurface({ status }: { status: GuiStatusData }) {
           <p>{text.vaultCollectionIntro}</p>
         </div>
         <ul className="object-list vault-collection-list">
-          {vault.collections.map((collection) => <VaultCollectionRow collection={collection} key={collection.id} vault={vault} />)}
+          {vault.collections.map((collection) => <VaultCollectionRow collection={collection} key={collection.id} onVaultRequest={onVaultRequest} vault={vault} />)}
         </ul>
       </section>
       <section className="panel" aria-label="Vault devices and audit">
@@ -219,9 +219,10 @@ export function VaultSurface({ status }: { status: GuiStatusData }) {
   );
 }
 
-export function LockedVaultGate({ collection, label, vault }: {
+export function LockedVaultGate({ collection, label, onVaultRequest, vault }: {
   collection: GuiVaultCollectionSummary;
   label: string;
+  onVaultRequest: (intent: VaultDialogIntent) => void;
   vault: GuiVaultStatusData;
 }) {
   return (
@@ -232,12 +233,12 @@ export function LockedVaultGate({ collection, label, vault }: {
           <h2>{label} is locked</h2>
           <p>{text.vaultLockedPreview}</p>
         </div>
-        <VaultPadlock collection={collection} vault={vault} />
+        <VaultPadlock collection={collection} onActivate={onVaultRequest} vault={vault} />
       </div>
       <div className="notice compact-notice" role="note">
         {text.vaultTooltip} {vault.unlock_hint}
       </div>
-      <button className="secondary-action vault-cta" disabled title={vault.unlock_hint} type="button">{text.vaultUnlockCta}</button>
+      <button className="secondary-action vault-cta" onClick={() => onVaultRequest(vaultDialogIntentForStatus(vault))} title={vault.unlock_hint} type="button">{text.vaultUnlockCta}</button>
     </section>
   );
 }
@@ -252,11 +253,11 @@ function VaultFeatureCard({ detail, label, value }: { detail: string; label: str
   );
 }
 
-function VaultCollectionRow({ collection, vault }: { collection: GuiVaultCollectionSummary; vault: GuiVaultStatusData }) {
+function VaultCollectionRow({ collection, onVaultRequest, vault }: { collection: GuiVaultCollectionSummary; onVaultRequest: (intent: VaultDialogIntent) => void; vault: GuiVaultStatusData }) {
   return (
     <li>
       <strong>{collection.label}</strong>
-      <VaultPadlock collection={collection} compact vault={vault} />
+      <VaultPadlock collection={collection} compact onActivate={onVaultRequest} vault={vault} />
       <span>{collection.preview_policy}</span>
       <small>{collection.labels.join(", ")}</small>
       <small>{collection.surface_ids.join(", ")}</small>

package/packages/gui-web/src/VaultBadges.tsx

@@ -1,4 +1,5 @@
 import type { GuiVaultCollectionSummary, GuiVaultStatusData } from "@aidevops/gui-shared";
+import type { KeyboardEvent, MouseEvent } from "react";
 import { FiLock, FiUnlock } from "react-icons/fi";
 import type { SurfaceId } from "./app-model";
 import { text } from "./app-model";
@@ -23,20 +24,53 @@ export function vaultCollectionTooltip(collection: GuiVaultCollectionSummary): s
   return text.vaultTooltip;
 }
 
-export function VaultPadlock({ collection, compact = false, vault }: {
+export type VaultDialogIntent = "setup" | "unlock" | "lock";
+
+export function vaultDialogIntentForStatus(vault: GuiVaultStatusData): VaultDialogIntent {
+  if (vault.unlocked) {
+    return "lock";
+  }
+
+  return vault.readiness.setup_required || !vault.initialized ? "setup" : "unlock";
+}
+
+export function VaultPadlock({ collection, compact = false, onActivate, vault }: {
   collection: GuiVaultCollectionSummary;
   compact?: boolean;
+  onActivate?: (intent: VaultDialogIntent) => void;
   vault: GuiVaultStatusData;
 }) {
   const locked = collection.state !== "unlocked" || !vault.unlocked;
   const stateLabel = locked ? "Locked" : "Unlocked";
   const Icon = locked ? FiLock : FiUnlock;
   const tooltip = `${stateLabel}: ${vaultCollectionTooltip(collection)}`;
+  const className = compact ? "vault-padlock compact" : "vault-padlock";
+
+  const activate = (event: MouseEvent<HTMLSpanElement> | KeyboardEvent<HTMLSpanElement>) => {
+    if (onActivate === undefined) {
+      return;
+    }
+
+    event.preventDefault();
+    event.stopPropagation();
+    onActivate(vaultDialogIntentForStatus(vault));
+  };
+
+  const handleKeyDown = (event: KeyboardEvent<HTMLSpanElement>) => {
+    if (event.key === "Enter" || event.key === " ") {
+      activate(event);
+    }
+  };
 
   return (
     <span
-      className={compact ? "vault-padlock compact" : "vault-padlock"}
+      aria-label={tooltip}
+      className={onActivate ? `${className} interactive` : className}
       data-vault-state={locked ? "locked" : "unlocked"}
+      onClick={activate}
+      onKeyDown={handleKeyDown}
+      role={onActivate ? "button" : undefined}
+      tabIndex={onActivate ? 0 : undefined}
       title={tooltip}
     >
       <Icon aria-hidden="true" focusable="false" />

package/packages/gui-web/src/VaultPassphraseModal.tsx

@@ -0,0 +1,132 @@
+import { useEffect, useMemo, useState, type ReactElement } from "react";
+import { FiAlertTriangle, FiCheckCircle, FiLock, FiShield, FiUnlock } from "react-icons/fi";
+import type { GuiVaultStatusData } from "@aidevops/gui-shared";
+import type { VaultDialogIntent } from "./VaultBadges";
+
+export function VaultPassphraseModal({ intent, onClose, vault }: {
+  intent: VaultDialogIntent;
+  onClose: () => void;
+  vault: GuiVaultStatusData;
+}): ReactElement {
+  const [step, setStep] = useState(0);
+  const [passphrase, setPassphrase] = useState("");
+  const [passphraseConfirm, setPassphraseConfirm] = useState("");
+  const [unlockPassphrase, setUnlockPassphrase] = useState("");
+  const [savedWarningAccepted, setSavedWarningAccepted] = useState(false);
+  const setupMode = intent === "setup";
+  const title = setupMode ? "Set Vault encryption passphrase" : intent === "unlock" ? "Unlock Vault" : "Lock Vault";
+  const actionLabel = setupMode ? "Use passphrase and continue" : intent === "unlock" ? "Unlock Vault" : "Lock Vault";
+  const setupPassphrasesMatch = passphrase.length > 0 && passphrase === passphraseConfirm;
+  const finalPassphraseMatches = unlockPassphrase.length > 0 && unlockPassphrase === passphrase;
+  const canContinue = useMemo(() => {
+    if (!setupMode) {
+      return intent === "lock" || unlockPassphrase.length > 0;
+    }
+
+    if (step === 0) {
+      return setupPassphrasesMatch;
+    }
+    if (step === 1) {
+      return savedWarningAccepted;
+    }
+    return finalPassphraseMatches;
+  }, [finalPassphraseMatches, intent, savedWarningAccepted, setupMode, setupPassphrasesMatch, step, unlockPassphrase.length]);
+
+  useEffect(() => {
+    setStep(0);
+    setPassphrase("");
+    setPassphraseConfirm("");
+    setUnlockPassphrase("");
+    setSavedWarningAccepted(false);
+  }, [intent]);
+
+  const continueFlow = () => {
+    if (setupMode && step < 2) {
+      setStep((current) => current + 1);
+      return;
+    }
+
+    onClose();
+  };
+
+  return (
+    <div className="vault-modal-backdrop" role="presentation">
+      <section aria-label={title} aria-modal="true" className="vault-modal" role="dialog">
+        <header className="vault-modal-header">
+          <span className="vault-modal-icon" aria-hidden="true">{intent === "lock" ? <FiLock /> : <FiUnlock />}</span>
+          <div>
+            <p className="eyebrow">aidevops Vault</p>
+            <h2>{title}</h2>
+          </div>
+        </header>
+        {setupMode ? <SetupStep accepted={savedWarningAccepted} confirm={passphraseConfirm} match={setupPassphrasesMatch} onAcceptChange={setSavedWarningAccepted} onConfirmChange={setPassphraseConfirm} onPassphraseChange={setPassphrase} onUnlockPassphraseChange={setUnlockPassphrase} passphrase={passphrase} step={step} unlockMatch={finalPassphraseMatches} unlockPassphrase={unlockPassphrase} /> : <UnlockStep intent={intent} onUnlockPassphraseChange={setUnlockPassphrase} unlockPassphrase={unlockPassphrase} vault={vault} />}
+        <footer className="vault-modal-actions">
+          <button className="secondary-action" onClick={onClose} type="button">Cancel</button>
+          <button className="primary-action" disabled={!canContinue} onClick={continueFlow} type="button">{setupMode && step < 2 ? "Continue" : actionLabel}</button>
+        </footer>
+        <p className="vault-modal-footnote">Passphrases stay in this local dialog state only and are never shown in logs, issues, command arguments, or AI chat.</p>
+      </section>
+    </div>
+  );
+}
+
+function SetupStep({ accepted, confirm, match, onAcceptChange, onConfirmChange, onPassphraseChange, onUnlockPassphraseChange, passphrase, step, unlockMatch, unlockPassphrase }: {
+  accepted: boolean;
+  confirm: string;
+  match: boolean;
+  onAcceptChange: (accepted: boolean) => void;
+  onConfirmChange: (value: string) => void;
+  onPassphraseChange: (value: string) => void;
+  onUnlockPassphraseChange: (value: string) => void;
+  passphrase: string;
+  step: number;
+  unlockMatch: boolean;
+  unlockPassphrase: string;
+}): ReactElement {
+  if (step === 1) {
+    return (
+      <div className="vault-modal-body">
+        <div className="notice warning-notice" role="alert"><FiAlertTriangle aria-hidden="true" /> Save this passphrase in a password manager now. aidevops cannot recover encrypted data if it is lost.</div>
+        <label className="vault-confirm-check"><input checked={accepted} onChange={(event) => onAcceptChange(event.currentTarget.checked)} type="checkbox" /> I have saved the Vault passphrase in a password manager and understand recovery is not possible without it.</label>
+      </div>
+    );
+  }
+
+  if (step === 2) {
+    return (
+      <div className="vault-modal-body">
+        <p>Final safety check: enter the newly saved passphrase once more before any confidential app data is encrypted.</p>
+        <label className="vault-field"><span>Use saved passphrase</span><input autoComplete="current-password" onChange={(event) => onUnlockPassphraseChange(event.currentTarget.value)} type="password" value={unlockPassphrase} /></label>
+        {unlockPassphrase.length > 0 ? <p className={unlockMatch ? "vault-valid" : "vault-invalid"}>{unlockMatch ? "Passphrase matches." : "Passphrase does not match the saved setup value."}</p> : null}
+      </div>
+    );
+  }
+
+  return (
+    <div className="vault-modal-body">
+      <p>Create the encryption passphrase for this local Vault. Use a long unique value generated by your password manager.</p>
+      <label className="vault-field"><span>New passphrase</span><input autoComplete="new-password" autoFocus onChange={(event) => onPassphraseChange(event.currentTarget.value)} type="password" value={passphrase} /></label>
+      <label className="vault-field"><span>Repeat passphrase</span><input autoComplete="new-password" onChange={(event) => onConfirmChange(event.currentTarget.value)} type="password" value={confirm} /></label>
+      {confirm.length > 0 ? <p className={match ? "vault-valid" : "vault-invalid"}>{match ? "Passphrases match." : "Passphrases must match before continuing."}</p> : null}
+    </div>
+  );
+}
+
+function UnlockStep({ intent, onUnlockPassphraseChange, unlockPassphrase, vault }: {
+  intent: VaultDialogIntent;
+  onUnlockPassphraseChange: (value: string) => void;
+  unlockPassphrase: string;
+  vault: GuiVaultStatusData;
+}): ReactElement {
+  if (intent === "lock") {
+    return <div className="vault-modal-body"><p><FiLock aria-hidden="true" /> Locking forgets in-memory keys for this local session. Protected previews will be hidden again.</p></div>;
+  }
+
+  return (
+    <div className="vault-modal-body">
+      <p><FiShield aria-hidden="true" /> Enter your Vault passphrase to unlock protected previews and write actions for this local session.</p>
+      <label className="vault-field"><span>Vault passphrase</span><input autoComplete="current-password" autoFocus onChange={(event) => onUnlockPassphraseChange(event.currentTarget.value)} type="password" value={unlockPassphrase} /></label>
+      <div className="notice compact-notice" role="note"><FiCheckCircle aria-hidden="true" /> {vault.unlock_hint}</div>
+    </div>
+  );
+}

package/packages/gui-web/src/styles.css

@@ -953,6 +953,15 @@ code {
   color: var(--accent);
 }
 
+.vault-padlock.interactive {
+  cursor: pointer;
+}
+
+.vault-padlock.interactive:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 2px;
+}
+
 .sidebar-group h2 {
   font-size: max(12.5px, 0.84em);
 }
@@ -1605,6 +1614,130 @@ code {
   width: 100%;
 }
 
+.vault-modal-backdrop {
+  align-items: center;
+  backdrop-filter: blur(10px) saturate(130%);
+  background: rgb(0 0 0 / 46%);
+  display: flex;
+  inset: 0;
+  justify-content: center;
+  padding: 24px;
+  position: fixed;
+  z-index: 30;
+  -webkit-backdrop-filter: blur(10px) saturate(130%);
+}
+
+.vault-modal {
+  background: var(--surface-elevated);
+  border: 1px solid var(--border-accent);
+  border-radius: 24px;
+  box-shadow: 0 30px 90px rgb(0 0 0 / 42%);
+  display: grid;
+  gap: 18px;
+  max-width: min(620px, calc(100vw - 40px));
+  padding: 22px;
+  width: 100%;
+}
+
+.vault-modal-header,
+.vault-modal-actions,
+.vault-modal-body p,
+.vault-field,
+.vault-confirm-check,
+.vault-valid,
+.vault-invalid {
+  margin: 0;
+}
+
+.vault-modal-header {
+  align-items: center;
+  display: flex;
+  gap: 14px;
+}
+
+.vault-modal-icon {
+  align-items: center;
+  background: color-mix(in srgb, var(--accent) 14%, transparent);
+  border: 1px solid var(--border-accent);
+  border-radius: 16px;
+  color: var(--accent);
+  display: inline-flex;
+  height: 46px;
+  justify-content: center;
+  width: 46px;
+}
+
+.vault-modal-body {
+  display: grid;
+  gap: 14px;
+}
+
+.vault-field {
+  display: grid;
+  gap: 7px;
+}
+
+.vault-field span,
+.vault-confirm-check {
+  color: var(--text-secondary);
+  font-size: 0.9rem;
+  font-weight: 800;
+}
+
+.vault-field input {
+  background: var(--surface-muted);
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  color: var(--text-primary);
+  padding: 12px;
+}
+
+.vault-confirm-check {
+  align-items: flex-start;
+  display: flex;
+  gap: 10px;
+}
+
+.warning-notice {
+  border-color: var(--border-warning);
+  color: #b45309;
+}
+
+.vault-valid {
+  color: var(--accent);
+  font-weight: 800;
+}
+
+.vault-invalid {
+  color: #b45309;
+  font-weight: 800;
+}
+
+.vault-modal-actions {
+  display: flex;
+  gap: 10px;
+  justify-content: flex-end;
+}
+
+.primary-action {
+  background: var(--accent);
+  border: 1px solid var(--border-accent);
+  border-radius: 10px;
+  color: var(--surface-base);
+  font-weight: 900;
+}
+
+.primary-action:disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+
+.vault-modal-footnote {
+  color: var(--text-muted);
+  font-size: 0.82rem;
+  margin: 0;
+}
+
 .command-input-row {
   align-items: center;
   background: var(--surface-muted);
@@ -1659,6 +1792,8 @@ code {
 }
 
 .workspace-scroll {
+  align-content: start;
+  align-items: start;
   display: grid;
   gap: 16px;
   overflow-x: hidden;
@@ -1667,6 +1802,7 @@ code {
 }
 
 .surface-page {
+  align-content: start;
   display: grid;
   gap: 16px;
 }
@@ -1973,17 +2109,21 @@ code {
 
 .settings-surface,
 .settings-form {
+  align-content: start;
   display: grid;
   gap: 16px;
 }
 
 .settings-form {
+  align-items: start;
   grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
 }
 
 .settings-form label {
+  align-content: start;
   display: grid;
   gap: 8px;
+  min-height: 0;
 }
 
 .settings-form span {
@@ -1997,7 +2137,9 @@ code {
   border: 1px solid var(--border);
   border-radius: 14px;
   color: var(--text-secondary);
+  min-height: 44px;
   padding: 11px 12px;
+  width: 100%;
 }
 
 .notification-list li {

package/setup.sh

@@ -12,7 +12,7 @@ shopt -s inherit_errexit 2>/dev/null || true
 # AI Assistant Server Access Framework Setup Script
 # Helps developers set up the framework for their infrastructure
 #
-# Version: 3.31.81
+# Version: 3.32.0
 #
 # Quick Install:
 #   npm install -g aidevops && aidevops update          (recommended)