npm - @burdenoff/microfe-vibecontrols - Versions diffs - 2026.623.2 → 2026.623.3 - Mend

@burdenoff/microfe-vibecontrols 2026.623.2 → 2026.623.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (85) hide show

package/dist/components/audit/AuditLogTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AuditLogTable.js","names":[],"sources":["../../../src/components/audit/AuditLogTable.tsx"],"sourcesContent":["import { ChevronRight, Terminal, Trash2 } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { StatusBadge } from '@/components/shared';\nimport { SelectionCheckbox } from '@/components/shared/SelectionCheckbox';\nimport type { VibeAuditLogFieldsFragment } from '@/generated/wspace-operations';\n\ninterface AuditLogTableProps {\n items: VibeAuditLogFieldsFragment[];\n total: number;\n hasMore: boolean;\n page: number;\n pageSize: number;\n onPageChange: (page: number) => void;\n onSelectLog: (id: string) => void;\n onDeleteLog: (id: string) => void;\n selectedLogId: string \| null;\n selectedLogIds: Set<string>;\n allVisibleSelected: boolean;\n partiallySelected: boolean;\n onToggleLogSelection: (id: string, checked: boolean) => void;\n onToggleAllVisible: (checked: boolean) => void;\n}\n\nconst statusVariantMap: Record<string, 'success' \| 'error' \| 'warning' \| 'info'> = {\n SUCCESS: 'success',\n FAILURE: 'error',\n DENIED: 'warning',\n ERROR: 'error',\n};\n\nconst actionColors: Record<string, string> = {\n CREATE: 'bg-status-success-bg-subtle text-status-success-text',\n UPDATE: 'bg-status-info-bg-subtle text-status-info-text',\n DELETE: 'bg-status-error-bg-subtle text-status-error-text',\n EXECUTE: 'bg-[var(--color-accent-soft)] text-action-primary-bg',\n EXPORT: 'bg-status-warning-bg-subtle text-status-warning-text',\n SHARE: 'bg-status-success-bg-subtle text-status-success-text',\n REVOKE: 'bg-status-warning-bg-subtle text-status-warning-text',\n ARCHIVE: 'bg-bg-muted text-text-secondary',\n RESTORE: 'bg-status-info-bg-subtle text-status-info-text',\n};\n\nfunction formatDate(dateString: string): string {\n const date = new Date(dateString);\n return date.toLocaleString('en-US', {\n month: 'short',\n day: 'numeric',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n });\n}\n\nfunction formatResourceType(type: string): string {\n return type\n .replace(/_/g, ' ')\n .toLowerCase()\n .replace(/\\b\\w/g, (character) => character.toUpperCase());\n}\n\nexport function AuditLogTable({\n items,\n total,\n hasMore,\n page,\n pageSize,\n onPageChange,\n onSelectLog,\n onDeleteLog,\n selectedLogId,\n selectedLogIds,\n allVisibleSelected,\n partiallySelected,\n onToggleLogSelection,\n onToggleAllVisible,\n}: AuditLogTableProps) {\n const { t } = useI18n();\n const totalPages = Math.max(1, Math.ceil(total / pageSize));\n\n const tr = (key: string, fallback: string) => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n\n return (\n <div>\n <div className=\"space-y-3 md:hidden\">\n {items.map((item) => {\n const isSelected = selectedLogIds.has(item.id);\n return (\n <article\n key={item.id}\n className={`rounded-lg border border-border-default p-4 transition-colors ${\n selectedLogId === item.id ? 'bg-bg-sunken' : 'bg-bg-surface'\n }`}\n >\n <div className=\"flex items-start justify-between gap-3\">\n <div className=\"flex items-start gap-3\">\n <SelectionCheckbox\n checked={isSelected}\n onChange={(checked) => onToggleLogSelection(item.id, checked)}\n ariaLabel={`Select audit log ${item.id}`}\n className=\"mt-1\"\n />\n <div className=\"min-w-0\">\n <p className=\"text-xs text-text-secondary\">{formatDate(item.createdAt)}</p>\n <p className=\"mt-1 truncate font-medium text-text-primary\">\n {item.resourceName \|\| item.description \|\| '-'}\n </p>\n <p className=\"mt-1 text-xs text-text-secondary\">\n {formatResourceType(item.resourceType)}\n </p>\n </div>\n </div>\n <span\n className={`inline-flex shrink-0 items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n actionColors[item.action] \|\| 'bg-bg-surface text-text-secondary'\n }`}\n >\n {item.command ? <Terminal size={12} /> : null}\n {item.action}\n </span>\n </div>\n <div className=\"mt-3 flex items-center justify-between gap-3\">\n <p className=\"min-w-0 truncate text-xs capitalize text-text-secondary\">\n {(item.actorType \|\| 'unknown').toLowerCase().replace(/_/g, ' ')}\n {item.resourceName ? ` · ${item.resourceName}` : ''}\n </p>\n <StatusBadge\n status={item.status}\n variant={statusVariantMap[item.status]}\n size=\"sm\"\n />\n </div>\n <div className=\"mt-4 flex items-center justify-end gap-2\">\n <button\n type=\"button\"\n onClick={() => onSelectLog(item.id)}\n className=\"inline-flex items-center gap-1 rounded-md border border-border-default px-3 py-1.5 text-sm text-text-primary transition-colors hover:bg-bg-surface\"\n >\n View details\n <ChevronRight size={14} />\n </button>\n <button\n type=\"button\"\n onClick={() => onDeleteLog(item.id)}\n className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg-subtle hover:text-status-error-text\"\n title={tr('audit.deleteAuditLog', 'Delete audit log')}\n >\n <Trash2 size={14} />\n </button>\n </div>\n </article>\n );\n })}\n </div>\n\n <div className=\"hidden overflow-x-auto rounded-card border border-border-subtle bg-bg-surface shadow-elevation-1 md:block\">\n <table className=\"w-full min-w-[860px] text-sm\">\n <thead>\n <tr className=\"border-b border-border-subtle bg-bg-sunken\">\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n <SelectionCheckbox\n checked={allVisibleSelected}\n indeterminate={partiallySelected}\n onChange={onToggleAllVisible}\n ariaLabel=\"Select all visible audit logs\"\n />\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.time', 'Time')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.action', 'Action')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.resource', 'Resource')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.name', 'Name')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.actor', 'Actor')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.status', 'Status')}\n </th>\n <th className=\"px-4 py-3 text-right text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.actions', 'Actions')}\n </th>\n </tr>\n </thead>\n <tbody>\n {items.map((item) => {\n const isSelected = selectedLogIds.has(item.id);\n return (\n <tr\n key={item.id}\n className={`border-b border-border-subtle transition-colors hover:bg-bg-sunken ${\n selectedLogId === item.id ? 'bg-bg-sunken' : ''\n }`}\n >\n <td className=\"px-4 py-3 align-top\">\n <SelectionCheckbox\n checked={isSelected}\n onChange={(checked) => onToggleLogSelection(item.id, checked)}\n ariaLabel={`Select audit log ${item.id}`}\n />\n </td>\n <td className=\"whitespace-nowrap px-4 py-3 text-xs text-text-secondary\">\n {formatDate(item.createdAt)}\n </td>\n <td className=\"px-4 py-3\">\n <span\n className={`inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n actionColors[item.action] \|\| 'bg-bg-surface text-text-secondary'\n }`}\n >\n {item.command ? <Terminal size={12} /> : null}\n {item.action}\n </span>\n </td>\n <td className=\"px-4 py-3 text-xs text-text-secondary\">\n {formatResourceType(item.resourceType)}\n </td>\n <td\n className=\"max-w-[220px] truncate px-4 py-3\"\n title={item.resourceName \|\| item.description \|\| ''}\n >\n {item.resourceName \|\| item.description \|\| '-'}\n </td>\n <td\n className=\"max-w-[140px] truncate px-4 py-3 text-xs capitalize text-text-secondary\"\n title={item.actorId}\n >\n {(item.actorType \|\| 'unknown').toLowerCase().replace(/_/g, ' ')}\n </td>\n <td className=\"px-4 py-3\">\n <StatusBadge\n status={item.status}\n variant={statusVariantMap[item.status]}\n size=\"sm\"\n />\n </td>\n <td className=\"px-4 py-3 text-right\">\n <div className=\"flex items-center justify-end gap-1\">\n <button\n type=\"button\"\n onClick={() => onSelectLog(item.id)}\n className=\"rounded p-1 text-text-secondary transition-colors hover:bg-bg-surface hover:text-text-primary\"\n title={tr('audit.viewAuditLog', 'View details')}\n >\n <ChevronRight size={14} />\n </button>\n <button\n type=\"button\"\n onClick={() => onDeleteLog(item.id)}\n className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg-subtle hover:text-status-error-text\"\n title={tr('audit.deleteAuditLog', 'Delete audit log')}\n >\n <Trash2 size={14} />\n </button>\n </div>\n </td>\n </tr>\n );\n })}\n </tbody>\n </table>\n </div>\n\n <div className=\"mt-4 flex flex-col gap-3 text-sm text-text-secondary sm:flex-row sm:items-center sm:justify-between\">\n <span>\n {tr('audit.showing', 'Showing')} {page * pageSize + 1}-\n {Math.min((page + 1) * pageSize, total)} {tr('audit.of', 'of')} {total}\n </span>\n <div className=\"flex flex-wrap items-center gap-2\">\n <button\n type=\"button\"\n disabled={page === 0}\n onClick={() => onPageChange(page - 1)}\n className=\"rounded border border-border-default px-3 py-1 transition-colors hover:bg-bg-surface disabled:opacity-50\"\n >\n {tr('audit.previous', 'Previous')}\n </button>\n <span>\n {tr('audit.page', 'Page')} {page + 1} {tr('audit.of', 'of')} {totalPages}\n </span>\n <button\n type=\"button\"\n disabled={!hasMore}\n onClick={() => onPageChange(page + 1)}\n className=\"rounded border border-border-default px-3 py-1 transition-colors hover:bg-bg-surface disabled:opacity-50\"\n >\n {tr('audit.next', 'Next')}\n </button>\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"AuditLogTable.js","names":[],"sources":["../../../src/components/audit/AuditLogTable.tsx"],"sourcesContent":["import { ChevronRight, Terminal, Trash2 } from 'lucide-react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { StatusBadge } from '@/components/shared';\nimport { SelectionCheckbox } from '@/components/shared/SelectionCheckbox';\nimport type { VibeAuditLogFieldsFragment } from '@/generated/wspace-operations';\n\ninterface AuditLogTableProps {\n items: VibeAuditLogFieldsFragment[];\n total: number;\n hasMore: boolean;\n page: number;\n pageSize: number;\n onPageChange: (page: number) => void;\n onSelectLog: (id: string) => void;\n onDeleteLog: (id: string) => void;\n selectedLogId: string \| null;\n selectedLogIds: Set<string>;\n allVisibleSelected: boolean;\n partiallySelected: boolean;\n onToggleLogSelection: (id: string, checked: boolean) => void;\n onToggleAllVisible: (checked: boolean) => void;\n}\n\nconst statusVariantMap: Record<string, 'success' \| 'error' \| 'warning' \| 'info'> = {\n SUCCESS: 'success',\n FAILURE: 'error',\n DENIED: 'warning',\n ERROR: 'error',\n};\n\nconst actionColors: Record<string, string> = {\n CREATE: 'bg-status-success-bg-subtle text-status-success-text',\n UPDATE: 'bg-status-info-bg-subtle text-status-info-text',\n DELETE: 'bg-status-error-bg-subtle text-status-error-text',\n EXECUTE: 'bg-[var(--color-accent-soft)] text-text-primary',\n EXPORT: 'bg-status-warning-bg-subtle text-status-warning-text',\n SHARE: 'bg-status-success-bg-subtle text-status-success-text',\n REVOKE: 'bg-status-warning-bg-subtle text-status-warning-text',\n ARCHIVE: 'bg-bg-muted text-text-secondary',\n RESTORE: 'bg-status-info-bg-subtle text-status-info-text',\n};\n\nfunction formatDate(dateString: string): string {\n const date = new Date(dateString);\n return date.toLocaleString('en-US', {\n month: 'short',\n day: 'numeric',\n hour: '2-digit',\n minute: '2-digit',\n second: '2-digit',\n });\n}\n\nfunction formatResourceType(type: string): string {\n return type\n .replace(/_/g, ' ')\n .toLowerCase()\n .replace(/\\b\\w/g, (character) => character.toUpperCase());\n}\n\nexport function AuditLogTable({\n items,\n total,\n hasMore,\n page,\n pageSize,\n onPageChange,\n onSelectLog,\n onDeleteLog,\n selectedLogId,\n selectedLogIds,\n allVisibleSelected,\n partiallySelected,\n onToggleLogSelection,\n onToggleAllVisible,\n}: AuditLogTableProps) {\n const { t } = useI18n();\n const totalPages = Math.max(1, Math.ceil(total / pageSize));\n\n const tr = (key: string, fallback: string) => {\n const value = t(key);\n return value === key ? fallback : value;\n };\n\n return (\n <div>\n <div className=\"space-y-3 md:hidden\">\n {items.map((item) => {\n const isSelected = selectedLogIds.has(item.id);\n return (\n <article\n key={item.id}\n className={`rounded-lg border border-border-default p-4 transition-colors ${\n selectedLogId === item.id ? 'bg-bg-sunken' : 'bg-bg-surface'\n }`}\n >\n <div className=\"flex items-start justify-between gap-3\">\n <div className=\"flex items-start gap-3\">\n <SelectionCheckbox\n checked={isSelected}\n onChange={(checked) => onToggleLogSelection(item.id, checked)}\n ariaLabel={`Select audit log ${item.id}`}\n className=\"mt-1\"\n />\n <div className=\"min-w-0\">\n <p className=\"text-xs text-text-secondary\">{formatDate(item.createdAt)}</p>\n <p className=\"mt-1 truncate font-medium text-text-primary\">\n {item.resourceName \|\| item.description \|\| '-'}\n </p>\n <p className=\"mt-1 text-xs text-text-secondary\">\n {formatResourceType(item.resourceType)}\n </p>\n </div>\n </div>\n <span\n className={`inline-flex shrink-0 items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n actionColors[item.action] \|\| 'bg-bg-surface text-text-secondary'\n }`}\n >\n {item.command ? <Terminal size={12} /> : null}\n {item.action}\n </span>\n </div>\n <div className=\"mt-3 flex items-center justify-between gap-3\">\n <p className=\"min-w-0 truncate text-xs capitalize text-text-secondary\">\n {(item.actorType \|\| 'unknown').toLowerCase().replace(/_/g, ' ')}\n {item.resourceName ? ` · ${item.resourceName}` : ''}\n </p>\n <StatusBadge\n status={item.status}\n variant={statusVariantMap[item.status]}\n size=\"sm\"\n />\n </div>\n <div className=\"mt-4 flex items-center justify-end gap-2\">\n <button\n type=\"button\"\n onClick={() => onSelectLog(item.id)}\n className=\"inline-flex items-center gap-1 rounded-md border border-border-default px-3 py-1.5 text-sm text-text-primary transition-colors hover:bg-bg-surface\"\n >\n View details\n <ChevronRight size={14} />\n </button>\n <button\n type=\"button\"\n onClick={() => onDeleteLog(item.id)}\n className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg-subtle hover:text-status-error-text\"\n title={tr('audit.deleteAuditLog', 'Delete audit log')}\n >\n <Trash2 size={14} />\n </button>\n </div>\n </article>\n );\n })}\n </div>\n\n <div className=\"hidden overflow-x-auto rounded-card border border-border-subtle bg-bg-surface shadow-elevation-1 md:block\">\n <table className=\"w-full min-w-[860px] text-sm\">\n <thead>\n <tr className=\"border-b border-border-subtle bg-bg-sunken\">\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n <SelectionCheckbox\n checked={allVisibleSelected}\n indeterminate={partiallySelected}\n onChange={onToggleAllVisible}\n ariaLabel=\"Select all visible audit logs\"\n />\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.time', 'Time')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.action', 'Action')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.resource', 'Resource')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.name', 'Name')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.actor', 'Actor')}\n </th>\n <th className=\"px-4 py-3 text-left text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.status', 'Status')}\n </th>\n <th className=\"px-4 py-3 text-right text-xs font-medium uppercase tracking-wide text-text-muted\">\n {tr('audit.actions', 'Actions')}\n </th>\n </tr>\n </thead>\n <tbody>\n {items.map((item) => {\n const isSelected = selectedLogIds.has(item.id);\n return (\n <tr\n key={item.id}\n className={`border-b border-border-subtle transition-colors hover:bg-bg-sunken ${\n selectedLogId === item.id ? 'bg-bg-sunken' : ''\n }`}\n >\n <td className=\"px-4 py-3 align-top\">\n <SelectionCheckbox\n checked={isSelected}\n onChange={(checked) => onToggleLogSelection(item.id, checked)}\n ariaLabel={`Select audit log ${item.id}`}\n />\n </td>\n <td className=\"whitespace-nowrap px-4 py-3 text-xs text-text-secondary\">\n {formatDate(item.createdAt)}\n </td>\n <td className=\"px-4 py-3\">\n <span\n className={`inline-flex items-center gap-1 rounded px-2 py-0.5 text-xs font-medium ${\n actionColors[item.action] \|\| 'bg-bg-surface text-text-secondary'\n }`}\n >\n {item.command ? <Terminal size={12} /> : null}\n {item.action}\n </span>\n </td>\n <td className=\"px-4 py-3 text-xs text-text-secondary\">\n {formatResourceType(item.resourceType)}\n </td>\n <td\n className=\"max-w-[220px] truncate px-4 py-3\"\n title={item.resourceName \|\| item.description \|\| ''}\n >\n {item.resourceName \|\| item.description \|\| '-'}\n </td>\n <td\n className=\"max-w-[140px] truncate px-4 py-3 text-xs capitalize text-text-secondary\"\n title={item.actorId}\n >\n {(item.actorType \|\| 'unknown').toLowerCase().replace(/_/g, ' ')}\n </td>\n <td className=\"px-4 py-3\">\n <StatusBadge\n status={item.status}\n variant={statusVariantMap[item.status]}\n size=\"sm\"\n />\n </td>\n <td className=\"px-4 py-3 text-right\">\n <div className=\"flex items-center justify-end gap-1\">\n <button\n type=\"button\"\n onClick={() => onSelectLog(item.id)}\n className=\"rounded p-1 text-text-secondary transition-colors hover:bg-bg-surface hover:text-text-primary\"\n title={tr('audit.viewAuditLog', 'View details')}\n >\n <ChevronRight size={14} />\n </button>\n <button\n type=\"button\"\n onClick={() => onDeleteLog(item.id)}\n className=\"rounded p-1 text-text-secondary transition-colors hover:bg-status-error-bg-subtle hover:text-status-error-text\"\n title={tr('audit.deleteAuditLog', 'Delete audit log')}\n >\n <Trash2 size={14} />\n </button>\n </div>\n </td>\n </tr>\n );\n })}\n </tbody>\n </table>\n </div>\n\n <div className=\"mt-4 flex flex-col gap-3 text-sm text-text-secondary sm:flex-row sm:items-center sm:justify-between\">\n <span>\n {tr('audit.showing', 'Showing')} {page * pageSize + 1}-\n {Math.min((page + 1) * pageSize, total)} {tr('audit.of', 'of')} {total}\n </span>\n <div className=\"flex flex-wrap items-center gap-2\">\n <button\n type=\"button\"\n disabled={page === 0}\n onClick={() => onPageChange(page - 1)}\n className=\"rounded border border-border-default px-3 py-1 transition-colors hover:bg-bg-surface disabled:opacity-50\"\n >\n {tr('audit.previous', 'Previous')}\n </button>\n <span>\n {tr('audit.page', 'Page')} {page + 1} {tr('audit.of', 'of')} {totalPages}\n </span>\n <button\n type=\"button\"\n disabled={!hasMore}\n onClick={() => onPageChange(page + 1)}\n className=\"rounded border border-border-default px-3 py-1 transition-colors hover:bg-bg-surface disabled:opacity-50\"\n >\n {tr('audit.next', 'Next')}\n </button>\n </div>\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/components/docs/DocsPageTree.js CHANGED Viewed

@@ -23,7 +23,7 @@ function f({ node: e, depth: t, selectedPageId: o, onSelectPage: s, onDeletePage
 		onKeyDown: (t) => {
 			(t.key === "Enter" || t.key === " ") && (t.preventDefault(), s(e.page.id));
 		},
-		className: `flex items-center gap-1 px-2 py-1.5 cursor-pointer rounded text-sm transition-colors group ${h ? "bg-[var(--color-accent-soft)] text-action-primary-bg" : "text-text-secondary hover:bg-bg-sunken hover:text-text-primary"}`,
+		className: `flex items-center gap-1 px-2 py-1.5 cursor-pointer rounded text-sm transition-colors group ${h ? "bg-[var(--color-accent-soft)] text-text-primary" : "text-text-secondary hover:bg-bg-sunken hover:text-text-primary"}`,
 		style: { paddingLeft: `${8 + t * 16}px` },
 		onClick: () => s(e.page.id),
 		children: [

package/dist/components/docs/DocsPageTree.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DocsPageTree.js","names":[],"sources":["../../../src/components/docs/DocsPageTree.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n FileText,\n FolderOpen,\n Plus,\n Trash2,\n ChevronRight,\n ChevronDown,\n Loader2,\n} from 'lucide-react';\nimport type { DocsPage } from './types';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface DocsPageTreeProps {\n pages: DocsPage[];\n selectedPageId: string \| null;\n onSelectPage: (pageId: string) => void;\n onAddPage: (parentId?: string, category?: string) => void;\n pageAdding?: boolean;\n onDeletePage: (pageId: string) => void;\n}\n\ninterface TreeNode {\n page: DocsPage;\n children: TreeNode[];\n}\n\nfunction buildTree(pages: DocsPage[]): TreeNode[] {\n const map = new Map<string, TreeNode>();\n const roots: TreeNode[] = [];\n\n for (const page of pages) {\n map.set(page.id, { page, children: [] });\n }\n\n for (const page of pages) {\n const node = map.get(page.id)!;\n if (page.parentId && map.has(page.parentId)) {\n map.get(page.parentId)!.children.push(node);\n } else {\n roots.push(node);\n }\n }\n\n return roots;\n}\n\nfunction TreeItem({\n node,\n depth,\n selectedPageId,\n onSelectPage,\n onDeletePage,\n expandedIds,\n toggleExpand,\n}: {\n node: TreeNode;\n depth: number;\n selectedPageId: string \| null;\n onSelectPage: (id: string) => void;\n onDeletePage: (id: string) => void;\n expandedIds: Set<string>;\n toggleExpand: (id: string) => void;\n}) {\n const isSelected = selectedPageId === node.page.id;\n const hasChildren = node.children.length > 0;\n const isExpanded = expandedIds.has(node.page.id);\n\n return (\n <div>\n <div\n role=\"button\"\n tabIndex={0}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n (() => onSelectPage(node.page.id))();\n }\n }}\n className={`flex items-center gap-1 px-2 py-1.5 cursor-pointer rounded text-sm transition-colors group ${\n isSelected\n ? 'bg-[var(--color-accent-soft)] text-~~action~~-primary~~-bg~~'\n : 'text-text-secondary hover:bg-bg-sunken hover:text-text-primary'\n }`}\n style={{ paddingLeft: `${8 + depth * 16}px` }}\n onClick={() => onSelectPage(node.page.id)}\n >\n {hasChildren ? (\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n toggleExpand(node.page.id);\n }}\n className=\"p-0.5 -ml-1\"\n >\n {isExpanded ? <ChevronDown className=\"size-3\" /> : <ChevronRight className=\"size-3\" />}\n </button>\n ) : (\n <span className=\"w-4\" />\n )}\n {node.page.category ? (\n <FolderOpen className=\"size-3.5 flex-shrink-0\" />\n ) : (\n <FileText className=\"size-3.5 flex-shrink-0\" />\n )}\n <span className=\"truncate flex-1\">{node.page.title}</span>\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n onDeletePage(node.page.id);\n }}\n className=\"opacity-0 group-hover:opacity-100 p-0.5 text-text-muted hover:text-status-error-text transition-all\"\n title=\"Delete\"\n >\n <Trash2 className=\"size-3\" />\n </button>\n </div>\n {hasChildren && isExpanded && (\n <div>\n {node.children.map((child) => (\n <TreeItem\n key={child.page.id}\n node={child}\n depth={depth + 1}\n selectedPageId={selectedPageId}\n onSelectPage={onSelectPage}\n onDeletePage={onDeletePage}\n expandedIds={expandedIds}\n toggleExpand={toggleExpand}\n />\n ))}\n </div>\n )}\n </div>\n );\n}\n\nexport function DocsPageTree({\n pages,\n selectedPageId,\n onSelectPage,\n onAddPage,\n pageAdding,\n onDeletePage,\n}: DocsPageTreeProps) {\n const tr = useTr();\n const [expandedIds, setExpandedIds] = useState<Set<string>>(new Set(pages.map((p) => p.id)));\n\n const toggleExpand = (id: string) => {\n setExpandedIds((prev) => {\n const next = new Set(prev);\n if (next.has(id)) next.delete(id);\n else next.add(id);\n return next;\n });\n };\n\n const tree = buildTree(pages);\n\n return (\n <div className=\"flex flex-col h-full\">\n <div className=\"flex items-center justify-between px-3 py-2 border-b border-border-default\">\n <span className=\"text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('vibecontrols.docs.pageTree.pages', 'Pages')}\n </span>\n <button\n type=\"button\"\n onClick={() => onAddPage()}\n disabled={pageAdding}\n className=\"p-1 text-text-secondary hover:text-text-primary transition-colors disabled:opacity-50\"\n title=\"Add page\"\n >\n {pageAdding ? <Loader2 className=\"size-4 animate-spin\" /> : <Plus className=\"size-4\" />}\n </button>\n </div>\n <div className=\"flex-1 overflow-y-auto py-1\">\n {tree.length > 0 ? (\n tree.map((node) => (\n <TreeItem\n key={node.page.id}\n node={node}\n depth={0}\n selectedPageId={selectedPageId}\n onSelectPage={onSelectPage}\n onDeletePage={onDeletePage}\n expandedIds={expandedIds}\n toggleExpand={toggleExpand}\n />\n ))\n ) : (\n <div className=\"p-4 text-center\">\n <p className=\"text-sm text-text-muted mb-2\">\n {tr('vibecontrols.docs.pageTree.noPages', 'No pages yet')}\n </p>\n <button\n type=\"button\"\n onClick={() => onAddPage()}\n className=\"text-sm text-action-primary-bg hover:underline\"\n >\n {tr('vibecontrols.docs.pageTree.addFirstPage', 'Add your first page')}\n </button>\n </div>\n )}\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;AA2BA,SAAS,EAAU,GAA+B;CAChD,IAAM,oBAAM,IAAI,KAAuB,EACjC,IAAoB,EAAE;AAE5B,MAAK,IAAM,KAAQ,EACjB,GAAI,IAAI,EAAK,IAAI;EAAE;EAAM,UAAU,EAAE;EAAE,CAAC;AAG1C,MAAK,IAAM,KAAQ,GAAO;EACxB,IAAM,IAAO,EAAI,IAAI,EAAK,GAAG;AAC7B,EAAI,EAAK,YAAY,EAAI,IAAI,EAAK,SAAS,GACzC,EAAI,IAAI,EAAK,SAAS,CAAE,SAAS,KAAK,EAAK,GAE3C,EAAM,KAAK,EAAK;;AAIpB,QAAO;;AAGT,SAAS,EAAS,EAChB,SACA,UACA,mBACA,iBACA,iBACA,gBACA,mBASC;CACD,IAAM,IAAa,MAAmB,EAAK,KAAK,IAC1C,IAAc,EAAK,SAAS,SAAS,GACrC,IAAa,EAAY,IAAI,EAAK,KAAK,GAAG;AAEhD,QACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,OAAD;EACE,MAAK;EACL,UAAU;EACV,YAAY,MAAM;AAChB,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,gBAAgB,EACX,EAAa,EAAK,KAAK,GAAG;;EAGrC,WAAW,8FACT,IACI,~~yDACA~~;EAEN,OAAO,EAAE,aAAa,GAAG,IAAI,IAAQ,GAAG,KAAK;EAC7C,eAAe,EAAa,EAAK,KAAK,GAAG;YAf3C;GAiBG,IACC,kBAAC,UAAD;IACE,MAAK;IACL,UAAU,MAAM;AAEd,KADA,EAAE,iBAAiB,EACnB,EAAa,EAAK,KAAK,GAAG;;IAE5B,WAAU;cAEI,EAAb,IAAc,IAAqC,GAAtC,EAAa,WAAU,UAAW,CAAsC;IAC/E,CAAA,GAET,kBAAC,QAAD,EAAM,WAAU,OAAQ,CAAA;GAEzB,EAAK,KAAK,WACT,kBAAC,GAAD,EAAY,WAAU,0BAA2B,CAAA,GAEjD,kBAAC,GAAD,EAAU,WAAU,0BAA2B,CAAA;GAEjD,kBAAC,QAAD;IAAM,WAAU;cAAmB,EAAK,KAAK;IAAa,CAAA;GAC1D,kBAAC,UAAD;IACE,MAAK;IACL,UAAU,MAAM;AAEd,KADA,EAAE,iBAAiB,EACnB,EAAa,EAAK,KAAK,GAAG;;IAE5B,WAAU;IACV,OAAM;cAEN,kBAAC,GAAD,EAAQ,WAAU,UAAW,CAAA;IACtB,CAAA;GACL;KACL,KAAe,KACd,kBAAC,OAAD,EAAA,UACG,EAAK,SAAS,KAAK,MAClB,kBAAC,GAAD;EAEE,MAAM;EACN,OAAO,IAAQ;EACC;EACF;EACA;EACD;EACC;EACd,EARK,EAAM,KAAK,GAQhB,CACF,EACE,CAAA,CAEJ,EAAA,CAAA;;AAIV,SAAgB,EAAa,EAC3B,UACA,mBACA,iBACA,cACA,eACA,mBACoB;CACpB,IAAM,IAAK,GAAO,EACZ,CAAC,GAAa,KAAkB,EAAsB,IAAI,IAAI,EAAM,KAAK,MAAM,EAAE,GAAG,CAAC,CAAC,EAEtF,KAAgB,MAAe;AACnC,KAAgB,MAAS;GACvB,IAAM,IAAO,IAAI,IAAI,EAAK;AAG1B,UAFI,EAAK,IAAI,EAAG,GAAE,EAAK,OAAO,EAAG,GAC5B,EAAK,IAAI,EAAG,EACV;IACP;IAGE,IAAO,EAAU,EAAM;AAE7B,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,QAAD;IAAM,WAAU;cACb,EAAG,oCAAoC,QAAQ;IAC3C,CAAA,EACP,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,GAAW;IAC1B,UAAU;IACV,WAAU;IACV,OAAM;cAEL,IAAa,kBAAC,GAAD,EAAS,WAAU,uBAAwB,CAAA,GAAG,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA;IAChF,CAAA,CACL;MACN,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAK,SAAS,IACb,EAAK,KAAK,MACR,kBAAC,GAAD;IAEQ;IACN,OAAO;IACS;IACF;IACA;IACD;IACC;IACd,EARK,EAAK,KAAK,GAQf,CACF,GAEF,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,KAAD;KAAG,WAAU;eACV,EAAG,sCAAsC,eAAe;KACvD,CAAA,EACJ,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,GAAW;KAC1B,WAAU;eAET,EAAG,2CAA2C,sBAAsB;KAC9D,CAAA,CACL;;GAEJ,CAAA,CACF"}
1	+ {"version":3,"file":"DocsPageTree.js","names":[],"sources":["../../../src/components/docs/DocsPageTree.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n FileText,\n FolderOpen,\n Plus,\n Trash2,\n ChevronRight,\n ChevronDown,\n Loader2,\n} from 'lucide-react';\nimport type { DocsPage } from './types';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface DocsPageTreeProps {\n pages: DocsPage[];\n selectedPageId: string \| null;\n onSelectPage: (pageId: string) => void;\n onAddPage: (parentId?: string, category?: string) => void;\n pageAdding?: boolean;\n onDeletePage: (pageId: string) => void;\n}\n\ninterface TreeNode {\n page: DocsPage;\n children: TreeNode[];\n}\n\nfunction buildTree(pages: DocsPage[]): TreeNode[] {\n const map = new Map<string, TreeNode>();\n const roots: TreeNode[] = [];\n\n for (const page of pages) {\n map.set(page.id, { page, children: [] });\n }\n\n for (const page of pages) {\n const node = map.get(page.id)!;\n if (page.parentId && map.has(page.parentId)) {\n map.get(page.parentId)!.children.push(node);\n } else {\n roots.push(node);\n }\n }\n\n return roots;\n}\n\nfunction TreeItem({\n node,\n depth,\n selectedPageId,\n onSelectPage,\n onDeletePage,\n expandedIds,\n toggleExpand,\n}: {\n node: TreeNode;\n depth: number;\n selectedPageId: string \| null;\n onSelectPage: (id: string) => void;\n onDeletePage: (id: string) => void;\n expandedIds: Set<string>;\n toggleExpand: (id: string) => void;\n}) {\n const isSelected = selectedPageId === node.page.id;\n const hasChildren = node.children.length > 0;\n const isExpanded = expandedIds.has(node.page.id);\n\n return (\n <div>\n <div\n role=\"button\"\n tabIndex={0}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n (() => onSelectPage(node.page.id))();\n }\n }}\n className={`flex items-center gap-1 px-2 py-1.5 cursor-pointer rounded text-sm transition-colors group ${\n isSelected\n ? 'bg-[var(--color-accent-soft)] text-text-primary'\n : 'text-text-secondary hover:bg-bg-sunken hover:text-text-primary'\n }`}\n style={{ paddingLeft: `${8 + depth * 16}px` }}\n onClick={() => onSelectPage(node.page.id)}\n >\n {hasChildren ? (\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n toggleExpand(node.page.id);\n }}\n className=\"p-0.5 -ml-1\"\n >\n {isExpanded ? <ChevronDown className=\"size-3\" /> : <ChevronRight className=\"size-3\" />}\n </button>\n ) : (\n <span className=\"w-4\" />\n )}\n {node.page.category ? (\n <FolderOpen className=\"size-3.5 flex-shrink-0\" />\n ) : (\n <FileText className=\"size-3.5 flex-shrink-0\" />\n )}\n <span className=\"truncate flex-1\">{node.page.title}</span>\n <button\n type=\"button\"\n onClick={(e) => {\n e.stopPropagation();\n onDeletePage(node.page.id);\n }}\n className=\"opacity-0 group-hover:opacity-100 p-0.5 text-text-muted hover:text-status-error-text transition-all\"\n title=\"Delete\"\n >\n <Trash2 className=\"size-3\" />\n </button>\n </div>\n {hasChildren && isExpanded && (\n <div>\n {node.children.map((child) => (\n <TreeItem\n key={child.page.id}\n node={child}\n depth={depth + 1}\n selectedPageId={selectedPageId}\n onSelectPage={onSelectPage}\n onDeletePage={onDeletePage}\n expandedIds={expandedIds}\n toggleExpand={toggleExpand}\n />\n ))}\n </div>\n )}\n </div>\n );\n}\n\nexport function DocsPageTree({\n pages,\n selectedPageId,\n onSelectPage,\n onAddPage,\n pageAdding,\n onDeletePage,\n}: DocsPageTreeProps) {\n const tr = useTr();\n const [expandedIds, setExpandedIds] = useState<Set<string>>(new Set(pages.map((p) => p.id)));\n\n const toggleExpand = (id: string) => {\n setExpandedIds((prev) => {\n const next = new Set(prev);\n if (next.has(id)) next.delete(id);\n else next.add(id);\n return next;\n });\n };\n\n const tree = buildTree(pages);\n\n return (\n <div className=\"flex flex-col h-full\">\n <div className=\"flex items-center justify-between px-3 py-2 border-b border-border-default\">\n <span className=\"text-xs font-medium text-text-secondary uppercase tracking-wider\">\n {tr('vibecontrols.docs.pageTree.pages', 'Pages')}\n </span>\n <button\n type=\"button\"\n onClick={() => onAddPage()}\n disabled={pageAdding}\n className=\"p-1 text-text-secondary hover:text-text-primary transition-colors disabled:opacity-50\"\n title=\"Add page\"\n >\n {pageAdding ? <Loader2 className=\"size-4 animate-spin\" /> : <Plus className=\"size-4\" />}\n </button>\n </div>\n <div className=\"flex-1 overflow-y-auto py-1\">\n {tree.length > 0 ? (\n tree.map((node) => (\n <TreeItem\n key={node.page.id}\n node={node}\n depth={0}\n selectedPageId={selectedPageId}\n onSelectPage={onSelectPage}\n onDeletePage={onDeletePage}\n expandedIds={expandedIds}\n toggleExpand={toggleExpand}\n />\n ))\n ) : (\n <div className=\"p-4 text-center\">\n <p className=\"text-sm text-text-muted mb-2\">\n {tr('vibecontrols.docs.pageTree.noPages', 'No pages yet')}\n </p>\n <button\n type=\"button\"\n onClick={() => onAddPage()}\n className=\"text-sm text-action-primary-bg hover:underline\"\n >\n {tr('vibecontrols.docs.pageTree.addFirstPage', 'Add your first page')}\n </button>\n </div>\n )}\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/components/graph/ConnectionPermissionsDialog.js CHANGED Viewed

@@ -54,7 +54,7 @@ function p({ connection: p, availablePermissions: m, availableScopes: h, onSave:
 								type: "button",
 								"aria-pressed": x.has(e),
 								onClick: () => T(e),
-								className: `${f} ${x.has(e) ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+								className: `${f} ${x.has(e) ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
 								children: e
 							}, e)), (m ?? []).length === 0 && /* @__PURE__ */ r("span", {
 								className: "text-xs text-text-muted",
@@ -74,7 +74,7 @@ function p({ connection: p, availablePermissions: m, availableScopes: h, onSave:
 								type: "button",
 								"aria-pressed": C.has(e),
 								onClick: () => E(e),
-								className: `${f} ${C.has(e) ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+								className: `${f} ${C.has(e) ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
 								children: e
 							}, e)), (h ?? []).length === 0 && /* @__PURE__ */ r("span", {
 								className: "text-xs text-text-muted",

package/dist/components/graph/ConnectionPermissionsDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConnectionPermissionsDialog.js","names":[],"sources":["../../../src/components/graph/ConnectionPermissionsDialog.tsx"],"sourcesContent":["/*\n ConnectionPermissionsDialog — Edit RBAC permissions and scopes for an agent connection edge.\n /\n\nimport { useId, useState } from 'react';\nimport {\n Button,\n ResponsiveDialog,\n ResponsiveDialogContent,\n ResponsiveDialogDescription,\n ResponsiveDialogFooter,\n ResponsiveDialogHeader,\n ResponsiveDialogTitle,\n} from '@burdenoff/fe-libs/ui';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface Connection {\n id: string;\n protocol: string;\n permissions?: string[];\n scopes?: string[];\n label?: string \| null;\n description?: string \| null;\n sourceAgent: { id: string; name: string };\n target: { id: string; name: string };\n}\n\ninterface Props {\n connection: Connection;\n availablePermissions?: string[];\n availableScopes?: string[];\n onSave: (permissions: string[], scopes: string[]) => void;\n onClose: () => void;\n}\n\nconst CHIP_BASE_CLASS =\n 'rounded-full border px-3 py-1.5 text-xs font-medium transition-colors max-md:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2';\n\nexport function ConnectionPermissionsDialog({\n connection,\n availablePermissions,\n availableScopes,\n onSave,\n onClose,\n}: Props) {\n const tr = useTr();\n const permissionsLabelId = useId();\n const scopesLabelId = useId();\n const [permissions, setPermissions] = useState<Set<string>>(\n new Set(connection.permissions \|\| [])\n );\n const [scopes, setScopes] = useState<Set<string>>(new Set(connection.scopes \|\| []));\n\n const togglePermission = (p: string) => {\n setPermissions((prev) => {\n const next = new Set(prev);\n if (next.has(p)) next.delete(p);\n else next.add(p);\n return next;\n });\n };\n\n const toggleScope = (s: string) => {\n setScopes((prev) => {\n const next = new Set(prev);\n if (next.has(s)) next.delete(s);\n else next.add(s);\n return next;\n });\n };\n\n return (\n <ResponsiveDialog\n open\n onOpenChange={(open) => {\n if (!open) onClose();\n }}\n >\n <ResponsiveDialogContent className=\"sm:max-w-md\">\n <ResponsiveDialogHeader>\n <ResponsiveDialogTitle>\n {tr('connectionPermissionsDialog.title', 'Connection Permissions')}\n </ResponsiveDialogTitle>\n <ResponsiveDialogDescription>\n <span className=\"font-medium text-text-primary\">{connection.sourceAgent.name}</span>\n {' → '}\n <span className=\"font-medium text-text-primary\">{connection.target.name}</span>\n <span className=\"ml-2 rounded bg-bg-sunken px-2 py-0.5 text-xs text-text-secondary\">\n {connection.protocol}\n </span>\n </ResponsiveDialogDescription>\n </ResponsiveDialogHeader>\n\n <div className=\"space-y-4\">\n {/ Permissions /}\n <div role=\"group\" aria-labelledby={permissionsLabelId}>\n <span\n id={permissionsLabelId}\n className=\"mb-2 block text-sm font-medium text-text-primary\"\n >\n {tr('connectionPermissionsDialog.permissions', 'Permissions')}\n </span>\n <div className=\"flex flex-wrap gap-2\">\n {(availablePermissions ?? []).map((p) => (\n <button\n type=\"button\"\n key={p}\n aria-pressed={permissions.has(p)}\n onClick={() => togglePermission(p)}\n className={`${CHIP_BASE_CLASS} ${\n permissions.has(p)\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-~~action~~-primary~~-bg~~'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {p}\n </button>\n ))}\n {(availablePermissions ?? []).length === 0 && (\n <span className=\"text-xs text-text-muted\">\n {tr('connectionPermissionsDialog.noPermissions', 'No permissions configured')}\n </span>\n )}\n </div>\n </div>\n\n {/ Scopes */}\n <div role=\"group\" aria-labelledby={scopesLabelId}>\n <span id={scopesLabelId} className=\"mb-2 block text-sm font-medium text-text-primary\">\n {tr('connectionPermissionsDialog.scopes', 'Scopes')}\n </span>\n <div className=\"flex flex-wrap gap-2\">\n {(availableScopes ?? []).map((s) => (\n <button\n type=\"button\"\n key={s}\n aria-pressed={scopes.has(s)}\n onClick={() => toggleScope(s)}\n className={`${CHIP_BASE_CLASS} ${\n scopes.has(s)\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-~~action~~-primary~~-bg~~'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {s}\n </button>\n ))}\n {(availableScopes ?? []).length === 0 && (\n <span className=\"text-xs text-text-muted\">\n {tr('connectionPermissionsDialog.noScopes', 'No scopes configured')}\n </span>\n )}\n </div>\n </div>\n </div>\n\n <ResponsiveDialogFooter>\n <Button type=\"button\" variant=\"outline\" onClick={onClose} className=\"max-md:min-h-11\">\n {tr('connectionPermissionsDialog.cancel', 'Cancel')}\n </Button>\n <Button\n type=\"button\"\n onClick={() => onSave(Array.from(permissions), Array.from(scopes))}\n className=\"max-md:min-h-11\"\n >\n {tr('connectionPermissionsDialog.save', 'Save Permissions')}\n </Button>\n </ResponsiveDialogFooter>\n </ResponsiveDialogContent>\n </ResponsiveDialog>\n );\n}\n"],"mappings":";;;;;AAmCA,IAAM,IACJ;AAEF,SAAgB,EAA4B,EAC1C,eACA,yBACA,oBACA,WACA,cACQ;CACR,IAAM,IAAK,GAAO,EACZ,IAAqB,GAAO,EAC5B,IAAgB,GAAO,EACvB,CAAC,GAAa,KAAkB,EACpC,IAAI,IAAI,EAAW,eAAe,EAAE,CAAC,CACtC,EACK,CAAC,GAAQ,KAAa,EAAsB,IAAI,IAAI,EAAW,UAAU,EAAE,CAAC,CAAC,EAE7E,KAAoB,MAAc;AACtC,KAAgB,MAAS;GACvB,IAAM,IAAO,IAAI,IAAI,EAAK;AAG1B,UAFI,EAAK,IAAI,EAAE,GAAE,EAAK,OAAO,EAAE,GAC1B,EAAK,IAAI,EAAE,EACT;IACP;IAGE,KAAe,MAAc;AACjC,KAAW,MAAS;GAClB,IAAM,IAAO,IAAI,IAAI,EAAK;AAG1B,UAFI,EAAK,IAAI,EAAE,GAAE,EAAK,OAAO,EAAE,GAC1B,EAAK,IAAI,EAAE,EACT;IACP;;AAGJ,QACE,kBAAC,GAAD;EACE,MAAA;EACA,eAAe,MAAS;AACtB,GAAK,KAAM,GAAS;;YAGtB,kBAAC,GAAD;GAAyB,WAAU;aAAnC;IACE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UACG,EAAG,qCAAqC,yBAAyB,EAC5C,CAAA,EACxB,kBAAC,GAAD,EAAA,UAAA;KACE,kBAAC,QAAD;MAAM,WAAU;gBAAiC,EAAW,YAAY;MAAY,CAAA;KACnF;KACD,kBAAC,QAAD;MAAM,WAAU;gBAAiC,EAAW,OAAO;MAAY,CAAA;KAC/E,kBAAC,QAAD;MAAM,WAAU;gBACb,EAAW;MACP,CAAA;KACqB,EAAA,CAAA,CACP,EAAA,CAAA;IAEzB,kBAAC,OAAD;KAAK,WAAU;eAAf,CAEE,kBAAC,OAAD;MAAK,MAAK;MAAQ,mBAAiB;gBAAnC,CACE,kBAAC,QAAD;OACE,IAAI;OACJ,WAAU;iBAET,EAAG,2CAA2C,cAAc;OACxD,CAAA,EACP,kBAAC,OAAD;OAAK,WAAU;iBAAf,EACI,KAAwB,EAAE,EAAE,KAAK,MACjC,kBAAC,UAAD;QACE,MAAK;QAEL,gBAAc,EAAY,IAAI,EAAE;QAChC,eAAe,EAAiB,EAAE;QAClC,WAAW,GAAG,EAAgB,GAC5B,EAAY,IAAI,EAAE,GACd,~~kFACA~~;kBAGL;QACM,EAVF,EAUE,CACT,GACA,KAAwB,EAAE,EAAE,WAAW,KACvC,kBAAC,QAAD;QAAM,WAAU;kBACb,EAAG,6CAA6C,4BAA4B;QACxE,CAAA,CAEL;SACF;SAGN,kBAAC,OAAD;MAAK,MAAK;MAAQ,mBAAiB;gBAAnC,CACE,kBAAC,QAAD;OAAM,IAAI;OAAe,WAAU;iBAChC,EAAG,sCAAsC,SAAS;OAC9C,CAAA,EACP,kBAAC,OAAD;OAAK,WAAU;iBAAf,EACI,KAAmB,EAAE,EAAE,KAAK,MAC5B,kBAAC,UAAD;QACE,MAAK;QAEL,gBAAc,EAAO,IAAI,EAAE;QAC3B,eAAe,EAAY,EAAE;QAC7B,WAAW,GAAG,EAAgB,GAC5B,EAAO,IAAI,EAAE,GACT,~~kFACA~~;kBAGL;QACM,EAVF,EAUE,CACT,GACA,KAAmB,EAAE,EAAE,WAAW,KAClC,kBAAC,QAAD;QAAM,WAAU;kBACb,EAAG,wCAAwC,uBAAuB;QAC9D,CAAA,CAEL;SACF;QACF;;IAEN,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;KAAQ,MAAK;KAAS,SAAQ;KAAU,SAAS;KAAS,WAAU;eACjE,EAAG,sCAAsC,SAAS;KAC5C,CAAA,EACT,kBAAC,GAAD;KACE,MAAK;KACL,eAAe,EAAO,MAAM,KAAK,EAAY,EAAE,MAAM,KAAK,EAAO,CAAC;KAClE,WAAU;eAET,EAAG,oCAAoC,mBAAmB;KACpD,CAAA,CACc,EAAA,CAAA;IACD;;EACT,CAAA"}
1	+ {"version":3,"file":"ConnectionPermissionsDialog.js","names":[],"sources":["../../../src/components/graph/ConnectionPermissionsDialog.tsx"],"sourcesContent":["/*\n ConnectionPermissionsDialog — Edit RBAC permissions and scopes for an agent connection edge.\n /\n\nimport { useId, useState } from 'react';\nimport {\n Button,\n ResponsiveDialog,\n ResponsiveDialogContent,\n ResponsiveDialogDescription,\n ResponsiveDialogFooter,\n ResponsiveDialogHeader,\n ResponsiveDialogTitle,\n} from '@burdenoff/fe-libs/ui';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface Connection {\n id: string;\n protocol: string;\n permissions?: string[];\n scopes?: string[];\n label?: string \| null;\n description?: string \| null;\n sourceAgent: { id: string; name: string };\n target: { id: string; name: string };\n}\n\ninterface Props {\n connection: Connection;\n availablePermissions?: string[];\n availableScopes?: string[];\n onSave: (permissions: string[], scopes: string[]) => void;\n onClose: () => void;\n}\n\nconst CHIP_BASE_CLASS =\n 'rounded-full border px-3 py-1.5 text-xs font-medium transition-colors max-md:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2';\n\nexport function ConnectionPermissionsDialog({\n connection,\n availablePermissions,\n availableScopes,\n onSave,\n onClose,\n}: Props) {\n const tr = useTr();\n const permissionsLabelId = useId();\n const scopesLabelId = useId();\n const [permissions, setPermissions] = useState<Set<string>>(\n new Set(connection.permissions \|\| [])\n );\n const [scopes, setScopes] = useState<Set<string>>(new Set(connection.scopes \|\| []));\n\n const togglePermission = (p: string) => {\n setPermissions((prev) => {\n const next = new Set(prev);\n if (next.has(p)) next.delete(p);\n else next.add(p);\n return next;\n });\n };\n\n const toggleScope = (s: string) => {\n setScopes((prev) => {\n const next = new Set(prev);\n if (next.has(s)) next.delete(s);\n else next.add(s);\n return next;\n });\n };\n\n return (\n <ResponsiveDialog\n open\n onOpenChange={(open) => {\n if (!open) onClose();\n }}\n >\n <ResponsiveDialogContent className=\"sm:max-w-md\">\n <ResponsiveDialogHeader>\n <ResponsiveDialogTitle>\n {tr('connectionPermissionsDialog.title', 'Connection Permissions')}\n </ResponsiveDialogTitle>\n <ResponsiveDialogDescription>\n <span className=\"font-medium text-text-primary\">{connection.sourceAgent.name}</span>\n {' → '}\n <span className=\"font-medium text-text-primary\">{connection.target.name}</span>\n <span className=\"ml-2 rounded bg-bg-sunken px-2 py-0.5 text-xs text-text-secondary\">\n {connection.protocol}\n </span>\n </ResponsiveDialogDescription>\n </ResponsiveDialogHeader>\n\n <div className=\"space-y-4\">\n {/ Permissions /}\n <div role=\"group\" aria-labelledby={permissionsLabelId}>\n <span\n id={permissionsLabelId}\n className=\"mb-2 block text-sm font-medium text-text-primary\"\n >\n {tr('connectionPermissionsDialog.permissions', 'Permissions')}\n </span>\n <div className=\"flex flex-wrap gap-2\">\n {(availablePermissions ?? []).map((p) => (\n <button\n type=\"button\"\n key={p}\n aria-pressed={permissions.has(p)}\n onClick={() => togglePermission(p)}\n className={`${CHIP_BASE_CLASS} ${\n permissions.has(p)\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {p}\n </button>\n ))}\n {(availablePermissions ?? []).length === 0 && (\n <span className=\"text-xs text-text-muted\">\n {tr('connectionPermissionsDialog.noPermissions', 'No permissions configured')}\n </span>\n )}\n </div>\n </div>\n\n {/ Scopes */}\n <div role=\"group\" aria-labelledby={scopesLabelId}>\n <span id={scopesLabelId} className=\"mb-2 block text-sm font-medium text-text-primary\">\n {tr('connectionPermissionsDialog.scopes', 'Scopes')}\n </span>\n <div className=\"flex flex-wrap gap-2\">\n {(availableScopes ?? []).map((s) => (\n <button\n type=\"button\"\n key={s}\n aria-pressed={scopes.has(s)}\n onClick={() => toggleScope(s)}\n className={`${CHIP_BASE_CLASS} ${\n scopes.has(s)\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {s}\n </button>\n ))}\n {(availableScopes ?? []).length === 0 && (\n <span className=\"text-xs text-text-muted\">\n {tr('connectionPermissionsDialog.noScopes', 'No scopes configured')}\n </span>\n )}\n </div>\n </div>\n </div>\n\n <ResponsiveDialogFooter>\n <Button type=\"button\" variant=\"outline\" onClick={onClose} className=\"max-md:min-h-11\">\n {tr('connectionPermissionsDialog.cancel', 'Cancel')}\n </Button>\n <Button\n type=\"button\"\n onClick={() => onSave(Array.from(permissions), Array.from(scopes))}\n className=\"max-md:min-h-11\"\n >\n {tr('connectionPermissionsDialog.save', 'Save Permissions')}\n </Button>\n </ResponsiveDialogFooter>\n </ResponsiveDialogContent>\n </ResponsiveDialog>\n );\n}\n"],"mappings":"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"}

package/dist/components/graph/MeshDeployWizard.js CHANGED Viewed

@@ -251,7 +251,7 @@ function y({ sourceAgents: y, initialSourceAgentId: ve, availablePermissions: b,
 								type: "button",
 								"aria-pressed": T === "ssh",
 								onClick: () => E("ssh"),
-								className: `${v} ${T === "ssh" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+								className: `${v} ${T === "ssh" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
 								children: [/* @__PURE__ */ s(ae, {
 									className: "size-3.5",
 									"aria-hidden": "true"
@@ -260,7 +260,7 @@ function y({ sourceAgents: y, initialSourceAgentId: ve, availablePermissions: b,
 								type: "button",
 								"aria-pressed": T === "same",
 								onClick: () => E("same"),
-								className: `${v} ${T === "same" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+								className: `${v} ${T === "same" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
 								children: [/* @__PURE__ */ s(ie, {
 									className: "size-3.5",
 									"aria-hidden": "true"
@@ -368,7 +368,7 @@ function y({ sourceAgents: y, initialSourceAgentId: ve, availablePermissions: b,
 								type: "button",
 								"aria-pressed": F.has(e),
 								onClick: () => De(e),
-								className: `${_e} ${F.has(e) ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+								className: `${_e} ${F.has(e) ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
 								children: e
 							}, e))
 						})] }),

package/dist/components/graph/MeshDeployWizard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MeshDeployWizard.js","names":[],"sources":["../../../src/components/graph/MeshDeployWizard.tsx"],"sourcesContent":["/*\n MeshDeployWizard — deploy a new agent THROUGH the mesh from a chosen source\n * (root) agent. Supports two modes:\n * - \"Remote (SSH)\": deploy onto another machine over SSH (host/user/port/key).\n * - \"Same machine\": deploy a sibling agent on the source agent's own host.\n \n Submitting calls `deployAgentViaMesh({ rootAgentId, input })`, reads the\n * `{ jobId }` out of the AgentProxyResponse, then polls\n * `meshDeployJobStatus(rootAgentId, jobId)` on a 2s interval, rendering the\n * job's step list in a progress panel. On completion it calls `onCompleted`\n * so the caller can refetch the mesh graph.\n /\n\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { Loader2, CheckCircle, XCircle, Check, Server, Laptop } from 'lucide-react';\nimport {\n Button,\n Checkbox,\n Input,\n ResponsiveDialog,\n ResponsiveDialogContent,\n ResponsiveDialogDescription,\n ResponsiveDialogFooter,\n ResponsiveDialogHeader,\n ResponsiveDialogTitle,\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n Stepper,\n} from '@burdenoff/fe-libs/ui';\nimport { useTr } from '../../shared/hooks/useTr';\nimport { useField } from '../../shared/hooks/useField';\nimport {\n useDeployAgentViaMeshMutation,\n useMeshDeployJobStatusLazyQuery,\n} from '@/generated/wspace-operations';\n\n// English fallbacks for the mesh-deploy job step labels. Extends the\n// install-job labels with the mesh-specific bootstrap/onboard/peer-probe\n// steps. Translated via `mesh.deploy.steps.{step}` keys.\nconst stepLabels: Record<string, string> = {\n probe: 'Probing target',\n 'install-bun': 'Installing Bun runtime',\n 'install-agent': 'Installing VibeControls Agent',\n autostart: 'Configuring autostart',\n plugins: 'Installing plugins',\n start: 'Starting agent',\n bootstrap: 'Bootstrapping tunnel',\n onboard: 'Onboarding agent',\n 'store-creds': 'Storing credentials',\n 'report-link': 'Linking into mesh',\n 'probe-peer': 'Probing new peer',\n};\n\ninterface DeployJobStep {\n step: string;\n status: string;\n message?: string;\n}\n\ninterface DeployJob {\n status: 'running' \| 'completed' \| 'failed' \| string;\n steps: DeployJobStep[];\n error?: string;\n}\n\ninterface SourceAgentOption {\n id: string;\n name: string;\n hostname: string;\n isActive: boolean;\n}\n\ninterface MeshDeployWizardProps {\n /* Agents that can act as the deploying root. /\n sourceAgents: SourceAgentOption[];\n /* Pre-seeded source (root) agent id (e.g. \"deploy from here\" on a node). /\n initialSourceAgentId?: string \| null;\n availablePermissions?: string[];\n onClose: () => void;\n onCompleted: () => void;\n}\n\ntype DeployMode = 'ssh' \| 'same';\ntype AuthMethod = 'agent' \| 'key';\n\nfunction asRecord(v: unknown): Record<string, unknown> \| null {\n return v && typeof v === 'object' && !Array.isArray(v) ? (v as Record<string, unknown>) : null;\n}\nfunction jstr(obj: Record<string, unknown> \| null, key: string): string \| null {\n const v = obj?.[key];\n return typeof v === 'string' ? v : null;\n}\n\nconst LABEL_CLASS = 'mb-1.5 block text-sm font-medium text-text-primary';\nconst CHIP_BASE_CLASS =\n 'rounded-lg border px-3 py-1.5 text-xs font-medium transition-colors max-md:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2';\nconst MODE_BUTTON_BASE_CLASS =\n 'inline-flex flex-1 items-center justify-center gap-2 rounded-md border px-3 py-2 text-sm transition-colors max-md:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2';\n\nexport function MeshDeployWizard({\n sourceAgents,\n initialSourceAgentId,\n availablePermissions,\n onClose,\n onCompleted,\n}: MeshDeployWizardProps) {\n const tr = useTr();\n\n const [sourceAgentId, setSourceAgentId] = useState<string>(\n initialSourceAgentId ?? sourceAgents[0]?.id ?? ''\n );\n const [mode, setMode] = useState<DeployMode>('ssh');\n const [host, setHost] = useState('');\n const [port, setPort] = useState(22);\n const [user, setUser] = useState('');\n const [authMethod, setAuthMethod] = useState<AuthMethod>('agent');\n const [keyPath, setKeyPath] = useState('');\n const [label, setLabel] = useState('');\n const [connectExisting, setConnectExisting] = useState(false);\n const [permissions, setPermissions] = useState<Set<string>>(new Set());\n\n const [jobId, setJobId] = useState<string \| null>(null);\n const [job, setJob] = useState<DeployJob \| null>(null);\n const [submitError, setSubmitError] = useState<string \| null>(null);\n\n const sourceField = useField();\n const hostField = useField();\n const portField = useField();\n const userField = useField();\n const keyField = useField();\n const labelField = useField();\n\n const [deploy, { loading: deploying }] = useDeployAgentViaMeshMutation();\n const [fetchJobStatus] = useMeshDeployJobStatusLazyQuery({ fetchPolicy: 'network-only' });\n\n const canSubmit = useMemo(() => {\n if (!sourceAgentId) return false;\n if (mode === 'ssh') {\n const targetSpec = host.trim();\n return targetSpec.length > 0 && user.trim().length > 0;\n }\n return true;\n }, [sourceAgentId, mode, host, user]);\n\n const togglePermission = useCallback((p: string) => {\n setPermissions((prev) => {\n const next = new Set(prev);\n if (next.has(p)) next.delete(p);\n else next.add(p);\n return next;\n });\n }, []);\n\n // Build the SSH `target` string the backend expects (user@host:port).\n const buildTargetString = useCallback((): string => {\n if (mode === 'same') return 'localhost';\n const trimmedHost = host.trim();\n const trimmedUser = user.trim();\n const base = trimmedUser ? `${trimmedUser}@${trimmedHost}` : trimmedHost;\n return port && port !== 22 ? `${base}:${port}` : base;\n }, [mode, host, user, port]);\n\n const handleSubmit = useCallback(async () => {\n if (!canSubmit) return;\n setSubmitError(null);\n setJob(null);\n setJobId(null);\n try {\n const res = await deploy({\n variables: {\n rootAgentId: sourceAgentId,\n input: {\n target: buildTargetString(),\n permissions: permissions.size > 0 ? Array.from(permissions) : undefined,\n identityFile: mode === 'ssh' && authMethod === 'key' ? keyPath \|\| undefined : undefined,\n label: label \|\| undefined,\n connectExisting,\n },\n },\n });\n const proxy = res.data?.deployAgentViaMesh;\n if (res.error \|\| proxy?.error \|\| proxy?.ok === false) {\n setSubmitError(\n proxy?.error ?? res.error?.message ?? tr('mesh.deploy.failed', 'Deploy failed')\n );\n return;\n }\n const data = asRecord(proxy?.data);\n const newJobId = jstr(data, 'jobId');\n if (!newJobId) {\n setSubmitError(\n tr('mesh.deploy.noJob', 'Deploy started but no job id was returned by the agent.')\n );\n return;\n }\n setJobId(newJobId);\n setJob({ status: jstr(data, 'status') ?? 'running', steps: [] });\n } catch (err) {\n setSubmitError(err instanceof Error ? err.message : String(err));\n }\n }, [\n canSubmit,\n deploy,\n sourceAgentId,\n buildTargetString,\n permissions,\n mode,\n authMethod,\n keyPath,\n label,\n connectExisting,\n tr,\n ]);\n\n // Poll the mesh-deploy job once a jobId is established.\n useEffect(() => {\n if (!jobId \|\| !sourceAgentId) return;\n let cancelled = false;\n\n const poll = () => {\n void fetchJobStatus({ variables: { rootAgentId: sourceAgentId, jobId } })\n .then((result) => {\n if (cancelled) return;\n const proxy = result.data?.meshDeployJobStatus;\n const data = asRecord(proxy?.data);\n if (!data) return;\n const rawSteps = Array.isArray(data.steps) ? (data.steps as DeployJobStep[]) : [];\n setJob({\n status: jstr(data, 'status') ?? 'running',\n steps: rawSteps,\n error: jstr(data, 'error') ?? proxy?.error ?? undefined,\n });\n const status = jstr(data, 'status');\n if (status === 'completed') {\n onCompleted();\n }\n })\n .catch(() => {\n // transient — retry on next interval\n });\n };\n\n poll();\n const interval = setInterval(poll, 2000);\n return () => {\n cancelled = true;\n clearInterval(interval);\n };\n }, [jobId, sourceAgentId, fetchJobStatus, onCompleted]);\n\n const jobRunning =\n job?.status === 'running' \|\|\n (jobId !== null && job?.status !== 'completed' && job?.status !== 'failed');\n\n const wizardSteps = [\n { key: 'configure', label: tr('mesh.deploy.steps.configure', 'Configure') },\n { key: 'deploy', label: tr('mesh.deploy.steps.deploy', 'Deploy') },\n ];\n\n return (\n <ResponsiveDialog\n open\n onOpenChange={(open) => {\n if (!open && !jobRunning) onClose();\n }}\n >\n <ResponsiveDialogContent\n className=\"max-h-[min(85vh,44rem)] overflow-y-auto sm:max-w-lg\"\n showCloseButton={!jobRunning}\n >\n <ResponsiveDialogHeader>\n <ResponsiveDialogTitle>\n {tr('mesh.deploy.title', 'Deploy Agent via Mesh')}\n </ResponsiveDialogTitle>\n <ResponsiveDialogDescription>\n {tr(\n 'mesh.deploy.description',\n 'Deploy a new agent through the mesh from a selected source agent.'\n )}\n </ResponsiveDialogDescription>\n </ResponsiveDialogHeader>\n\n <Stepper steps={wizardSteps} active={jobId ? 1 : 0} />\n\n {/ Job progress takes over once a job is running /}\n {jobId ? (\n <div className=\"space-y-3\">\n <p role=\"status\" className=\"text-sm text-text-secondary\">\n {tr('mesh.deploy.deploying', 'Deploying through {{agent}}…', {\n agent: sourceAgents.find((a) => a.id === sourceAgentId)?.name ?? 'agent',\n })}\n </p>\n <div className=\"space-y-2\">\n {job && job.steps.length > 0 ? (\n job.steps.map((step, idx) => (\n <div key={`${step.step}-${idx}`} className=\"flex items-center gap-3\">\n {step.status === 'running' && (\n <Loader2 className=\"size-4 animate-spin text-text-link\" aria-hidden=\"true\" />\n )}\n {step.status === 'completed' && (\n <CheckCircle className=\"size-4 text-status-success-text\" aria-hidden=\"true\" />\n )}\n {step.status === 'failed' && (\n <XCircle className=\"size-4 text-status-error-text\" aria-hidden=\"true\" />\n )}\n {step.status === 'skipped' && (\n <Check className=\"size-4 text-text-muted\" aria-hidden=\"true\" />\n )}\n {step.status === 'pending' && (\n <div\n className=\"size-4 rounded-full border-2 border-border-default\"\n aria-hidden=\"true\"\n />\n )}\n <div className=\"min-w-0\">\n <div className=\"text-sm font-medium text-text-primary\">\n {tr(`mesh.deploy.steps.${step.step}`, stepLabels[step.step] ?? step.step)}\n </div>\n {step.message ? (\n <div className=\"text-xs break-words text-text-muted\">{step.message}</div>\n ) : null}\n </div>\n </div>\n ))\n ) : (\n <div className=\"flex items-center gap-3\">\n <Loader2 className=\"size-4 animate-spin text-text-link\" aria-hidden=\"true\" />\n <span className=\"text-sm text-text-secondary\">\n {tr('mesh.deploy.starting', 'Starting deploy job…')}\n </span>\n </div>\n )}\n </div>\n\n {job?.status === 'completed' && (\n <div\n role=\"status\"\n className=\"rounded-lg border border-status-success-border bg-status-success-bg-subtle p-3 text-sm text-status-success-text\"\n >\n {tr('mesh.deploy.success', 'Agent deployed successfully!')}\n </div>\n )}\n {job?.status === 'failed' && (\n <div\n role=\"alert\"\n className=\"rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text\"\n >\n {job.error ?? tr('mesh.deploy.jobFailed', 'Deploy failed.')}\n </div>\n )}\n\n <ResponsiveDialogFooter>\n <Button\n type=\"button\"\n variant=\"outline\"\n onClick={onClose}\n disabled={jobRunning}\n aria-busy={jobRunning}\n className=\"w-full max-md:min-h-11\"\n >\n {jobRunning\n ? tr('mesh.deploy.deployingShort', 'Deploying…')\n : tr('common.close', 'Close')}\n </Button>\n </ResponsiveDialogFooter>\n </div>\n ) : (\n <div className=\"space-y-4\">\n {/ Source agent /}\n <div>\n <label className={LABEL_CLASS} htmlFor={sourceField.id}>\n {tr('mesh.deploy.sourceAgent', 'Source agent (deploys from)')}\n </label>\n <Select\n value={sourceAgentId \|\| undefined}\n onValueChange={setSourceAgentId}\n disabled={sourceAgents.length === 0}\n >\n <SelectTrigger id={sourceField.id} className=\"w-full text-base md:text-sm\">\n <SelectValue placeholder={tr('mesh.deploy.noAgents', 'No agents available')} />\n </SelectTrigger>\n <SelectContent>\n {sourceAgents.map((a) => (\n <SelectItem key={a.id} value={a.id}>\n {a.name} ({a.hostname}){a.isActive ? '' : ' · offline'}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n </div>\n\n {/ Mode toggle /}\n <div>\n <span className={LABEL_CLASS}>{tr('mesh.deploy.mode', 'Deploy mode')}</span>\n <div className=\"flex flex-wrap gap-2\">\n <button\n type=\"button\"\n aria-pressed={mode === 'ssh'}\n onClick={() => setMode('ssh')}\n className={`${MODE_BUTTON_BASE_CLASS} ${\n mode === 'ssh'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n <Server className=\"size-3.5\" aria-hidden=\"true\" />\n {tr('mesh.deploy.modeSsh', 'Remote (SSH)')}\n </button>\n <button\n type=\"button\"\n aria-pressed={mode === 'same'}\n onClick={() => setMode('same')}\n className={`${MODE_BUTTON_BASE_CLASS} ${\n mode === 'same'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n <Laptop className=\"size-3.5\" aria-hidden=\"true\" />\n {tr('mesh.deploy.modeSame', 'Same machine')}\n </button>\n </div>\n </div>\n\n {/ SSH fields /}\n {mode === 'ssh' && (\n <div className=\"space-y-3\">\n <div className=\"grid grid-cols-1 gap-2 sm:grid-cols-3\">\n <div className=\"sm:col-span-2\">\n <label className={LABEL_CLASS} htmlFor={hostField.id}>\n {tr('mesh.deploy.host', 'Host / alias')}\n </label>\n <Input\n {...hostField.inputProps}\n type=\"text\"\n value={host}\n onChange={(e) => setHost(e.target.value)}\n placeholder=\"prod-web-01 or 10.0.0.5\"\n className=\"font-mono text-base md:text-sm\"\n />\n </div>\n <div>\n <label className={LABEL_CLASS} htmlFor={portField.id}>\n {tr('mesh.deploy.port', 'Port')}\n </label>\n <Input\n {...portField.inputProps}\n type=\"number\"\n value={port}\n onChange={(e) => setPort(Number(e.target.value) \|\| 22)}\n className=\"text-base md:text-sm\"\n />\n </div>\n </div>\n <div>\n <label className={LABEL_CLASS} htmlFor={userField.id}>\n {tr('mesh.deploy.user', 'User')}\n </label>\n <Input\n {...userField.inputProps}\n type=\"text\"\n value={user}\n onChange={(e) => setUser(e.target.value)}\n placeholder=\"root\"\n className=\"font-mono text-base md:text-sm\"\n />\n </div>\n <div>\n <span className={LABEL_CLASS}>{tr('mesh.deploy.auth', 'Authentication')}</span>\n <div className=\"flex flex-wrap gap-x-4 gap-y-2\">\n <label className=\"inline-flex cursor-pointer items-center gap-2 text-sm text-text-primary max-md:min-h-11\">\n <input\n type=\"radio\"\n name=\"mesh-auth\"\n checked={authMethod === 'agent'}\n onChange={() => setAuthMethod('agent')}\n />\n {tr('mesh.deploy.authAgent', 'SSH agent / default key')}\n </label>\n <label className=\"inline-flex cursor-pointer items-center gap-2 text-sm text-text-primary max-md:min-h-11\">\n <input\n type=\"radio\"\n name=\"mesh-auth\"\n checked={authMethod === 'key'}\n onChange={() => setAuthMethod('key')}\n />\n {tr('mesh.deploy.authKey', 'Key path')}\n </label>\n </div>\n </div>\n {authMethod === 'key' && (\n <div>\n <label className={LABEL_CLASS} htmlFor={keyField.id}>\n {tr('mesh.deploy.keyPath', 'Identity file (key path)')}\n </label>\n <Input\n {...keyField.inputProps}\n type=\"text\"\n value={keyPath}\n onChange={(e) => setKeyPath(e.target.value)}\n placeholder=\"~/.ssh/id_ed25519\"\n className=\"font-mono text-base md:text-sm\"\n />\n </div>\n )}\n </div>\n )}\n\n {/ Label /}\n <div>\n <label className={LABEL_CLASS} htmlFor={labelField.id}>\n {tr('mesh.deploy.label', 'Label (optional)')}\n </label>\n <Input\n {...labelField.inputProps}\n type=\"text\"\n value={label}\n onChange={(e) => setLabel(e.target.value)}\n placeholder={tr('mesh.deploy.labelPlaceholder', 'e.g. Production web tier')}\n className=\"text-base md:text-sm\"\n />\n </div>\n\n {/ Permission chips */}\n {availablePermissions && availablePermissions.length > 0 && (\n <div>\n <span className={LABEL_CLASS}>\n {tr('mesh.deploy.permissions', 'Grant permissions on the new link')}\n </span>\n <div className=\"flex flex-wrap gap-2\">\n {availablePermissions.map((p) => (\n <button\n type=\"button\"\n key={p}\n aria-pressed={permissions.has(p)}\n onClick={() => togglePermission(p)}\n className={`${CHIP_BASE_CLASS} ${\n permissions.has(p)\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {p}\n </button>\n ))}\n </div>\n </div>\n )}\n\n <label className=\"flex cursor-pointer items-start gap-2 text-sm text-text-primary\">\n <Checkbox\n checked={connectExisting}\n onCheckedChange={(checked) => setConnectExisting(checked === true)}\n className=\"mt-0.5\"\n />\n <span>\n {tr(\n 'mesh.deploy.connectExisting',\n 'Connect to an existing agent on the target instead of installing'\n )}\n </span>\n </label>\n\n {submitError && (\n <div\n role=\"alert\"\n className=\"rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text\"\n >\n {submitError}\n </div>\n )}\n\n <ResponsiveDialogFooter>\n <Button type=\"button\" variant=\"outline\" onClick={onClose} className=\"max-md:min-h-11\">\n {tr('common.cancel', 'Cancel')}\n </Button>\n <Button\n type=\"button\"\n onClick={() => void handleSubmit()}\n disabled={!canSubmit \|\| deploying}\n aria-busy={deploying}\n className=\"max-md:min-h-11\"\n >\n {deploying ? <Loader2 className=\"size-4 animate-spin\" aria-hidden=\"true\" /> : null}\n {tr('mesh.deploy.submit', 'Deploy')}\n </Button>\n </ResponsiveDialogFooter>\n </div>\n )}\n </ResponsiveDialogContent>\n </ResponsiveDialog>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"MeshDeployWizard.js","names":[],"sources":["../../../src/components/graph/MeshDeployWizard.tsx"],"sourcesContent":["/*\n MeshDeployWizard — deploy a new agent THROUGH the mesh from a chosen source\n * (root) agent. Supports two modes:\n * - \"Remote (SSH)\": deploy onto another machine over SSH (host/user/port/key).\n * - \"Same machine\": deploy a sibling agent on the source agent's own host.\n \n Submitting calls `deployAgentViaMesh({ rootAgentId, input })`, reads the\n * `{ jobId }` out of the AgentProxyResponse, then polls\n * `meshDeployJobStatus(rootAgentId, jobId)` on a 2s interval, rendering the\n * job's step list in a progress panel. On completion it calls `onCompleted`\n * so the caller can refetch the mesh graph.\n /\n\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { Loader2, CheckCircle, XCircle, Check, Server, Laptop } from 'lucide-react';\nimport {\n Button,\n Checkbox,\n Input,\n ResponsiveDialog,\n ResponsiveDialogContent,\n ResponsiveDialogDescription,\n ResponsiveDialogFooter,\n ResponsiveDialogHeader,\n ResponsiveDialogTitle,\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n Stepper,\n} from '@burdenoff/fe-libs/ui';\nimport { useTr } from '../../shared/hooks/useTr';\nimport { useField } from '../../shared/hooks/useField';\nimport {\n useDeployAgentViaMeshMutation,\n useMeshDeployJobStatusLazyQuery,\n} from '@/generated/wspace-operations';\n\n// English fallbacks for the mesh-deploy job step labels. Extends the\n// install-job labels with the mesh-specific bootstrap/onboard/peer-probe\n// steps. Translated via `mesh.deploy.steps.{step}` keys.\nconst stepLabels: Record<string, string> = {\n probe: 'Probing target',\n 'install-bun': 'Installing Bun runtime',\n 'install-agent': 'Installing VibeControls Agent',\n autostart: 'Configuring autostart',\n plugins: 'Installing plugins',\n start: 'Starting agent',\n bootstrap: 'Bootstrapping tunnel',\n onboard: 'Onboarding agent',\n 'store-creds': 'Storing credentials',\n 'report-link': 'Linking into mesh',\n 'probe-peer': 'Probing new peer',\n};\n\ninterface DeployJobStep {\n step: string;\n status: string;\n message?: string;\n}\n\ninterface DeployJob {\n status: 'running' \| 'completed' \| 'failed' \| string;\n steps: DeployJobStep[];\n error?: string;\n}\n\ninterface SourceAgentOption {\n id: string;\n name: string;\n hostname: string;\n isActive: boolean;\n}\n\ninterface MeshDeployWizardProps {\n /* Agents that can act as the deploying root. /\n sourceAgents: SourceAgentOption[];\n /* Pre-seeded source (root) agent id (e.g. \"deploy from here\" on a node). /\n initialSourceAgentId?: string \| null;\n availablePermissions?: string[];\n onClose: () => void;\n onCompleted: () => void;\n}\n\ntype DeployMode = 'ssh' \| 'same';\ntype AuthMethod = 'agent' \| 'key';\n\nfunction asRecord(v: unknown): Record<string, unknown> \| null {\n return v && typeof v === 'object' && !Array.isArray(v) ? (v as Record<string, unknown>) : null;\n}\nfunction jstr(obj: Record<string, unknown> \| null, key: string): string \| null {\n const v = obj?.[key];\n return typeof v === 'string' ? v : null;\n}\n\nconst LABEL_CLASS = 'mb-1.5 block text-sm font-medium text-text-primary';\nconst CHIP_BASE_CLASS =\n 'rounded-lg border px-3 py-1.5 text-xs font-medium transition-colors max-md:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2';\nconst MODE_BUTTON_BASE_CLASS =\n 'inline-flex flex-1 items-center justify-center gap-2 rounded-md border px-3 py-2 text-sm transition-colors max-md:min-h-11 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2';\n\nexport function MeshDeployWizard({\n sourceAgents,\n initialSourceAgentId,\n availablePermissions,\n onClose,\n onCompleted,\n}: MeshDeployWizardProps) {\n const tr = useTr();\n\n const [sourceAgentId, setSourceAgentId] = useState<string>(\n initialSourceAgentId ?? sourceAgents[0]?.id ?? ''\n );\n const [mode, setMode] = useState<DeployMode>('ssh');\n const [host, setHost] = useState('');\n const [port, setPort] = useState(22);\n const [user, setUser] = useState('');\n const [authMethod, setAuthMethod] = useState<AuthMethod>('agent');\n const [keyPath, setKeyPath] = useState('');\n const [label, setLabel] = useState('');\n const [connectExisting, setConnectExisting] = useState(false);\n const [permissions, setPermissions] = useState<Set<string>>(new Set());\n\n const [jobId, setJobId] = useState<string \| null>(null);\n const [job, setJob] = useState<DeployJob \| null>(null);\n const [submitError, setSubmitError] = useState<string \| null>(null);\n\n const sourceField = useField();\n const hostField = useField();\n const portField = useField();\n const userField = useField();\n const keyField = useField();\n const labelField = useField();\n\n const [deploy, { loading: deploying }] = useDeployAgentViaMeshMutation();\n const [fetchJobStatus] = useMeshDeployJobStatusLazyQuery({ fetchPolicy: 'network-only' });\n\n const canSubmit = useMemo(() => {\n if (!sourceAgentId) return false;\n if (mode === 'ssh') {\n const targetSpec = host.trim();\n return targetSpec.length > 0 && user.trim().length > 0;\n }\n return true;\n }, [sourceAgentId, mode, host, user]);\n\n const togglePermission = useCallback((p: string) => {\n setPermissions((prev) => {\n const next = new Set(prev);\n if (next.has(p)) next.delete(p);\n else next.add(p);\n return next;\n });\n }, []);\n\n // Build the SSH `target` string the backend expects (user@host:port).\n const buildTargetString = useCallback((): string => {\n if (mode === 'same') return 'localhost';\n const trimmedHost = host.trim();\n const trimmedUser = user.trim();\n const base = trimmedUser ? `${trimmedUser}@${trimmedHost}` : trimmedHost;\n return port && port !== 22 ? `${base}:${port}` : base;\n }, [mode, host, user, port]);\n\n const handleSubmit = useCallback(async () => {\n if (!canSubmit) return;\n setSubmitError(null);\n setJob(null);\n setJobId(null);\n try {\n const res = await deploy({\n variables: {\n rootAgentId: sourceAgentId,\n input: {\n target: buildTargetString(),\n permissions: permissions.size > 0 ? Array.from(permissions) : undefined,\n identityFile: mode === 'ssh' && authMethod === 'key' ? keyPath \|\| undefined : undefined,\n label: label \|\| undefined,\n connectExisting,\n },\n },\n });\n const proxy = res.data?.deployAgentViaMesh;\n if (res.error \|\| proxy?.error \|\| proxy?.ok === false) {\n setSubmitError(\n proxy?.error ?? res.error?.message ?? tr('mesh.deploy.failed', 'Deploy failed')\n );\n return;\n }\n const data = asRecord(proxy?.data);\n const newJobId = jstr(data, 'jobId');\n if (!newJobId) {\n setSubmitError(\n tr('mesh.deploy.noJob', 'Deploy started but no job id was returned by the agent.')\n );\n return;\n }\n setJobId(newJobId);\n setJob({ status: jstr(data, 'status') ?? 'running', steps: [] });\n } catch (err) {\n setSubmitError(err instanceof Error ? err.message : String(err));\n }\n }, [\n canSubmit,\n deploy,\n sourceAgentId,\n buildTargetString,\n permissions,\n mode,\n authMethod,\n keyPath,\n label,\n connectExisting,\n tr,\n ]);\n\n // Poll the mesh-deploy job once a jobId is established.\n useEffect(() => {\n if (!jobId \|\| !sourceAgentId) return;\n let cancelled = false;\n\n const poll = () => {\n void fetchJobStatus({ variables: { rootAgentId: sourceAgentId, jobId } })\n .then((result) => {\n if (cancelled) return;\n const proxy = result.data?.meshDeployJobStatus;\n const data = asRecord(proxy?.data);\n if (!data) return;\n const rawSteps = Array.isArray(data.steps) ? (data.steps as DeployJobStep[]) : [];\n setJob({\n status: jstr(data, 'status') ?? 'running',\n steps: rawSteps,\n error: jstr(data, 'error') ?? proxy?.error ?? undefined,\n });\n const status = jstr(data, 'status');\n if (status === 'completed') {\n onCompleted();\n }\n })\n .catch(() => {\n // transient — retry on next interval\n });\n };\n\n poll();\n const interval = setInterval(poll, 2000);\n return () => {\n cancelled = true;\n clearInterval(interval);\n };\n }, [jobId, sourceAgentId, fetchJobStatus, onCompleted]);\n\n const jobRunning =\n job?.status === 'running' \|\|\n (jobId !== null && job?.status !== 'completed' && job?.status !== 'failed');\n\n const wizardSteps = [\n { key: 'configure', label: tr('mesh.deploy.steps.configure', 'Configure') },\n { key: 'deploy', label: tr('mesh.deploy.steps.deploy', 'Deploy') },\n ];\n\n return (\n <ResponsiveDialog\n open\n onOpenChange={(open) => {\n if (!open && !jobRunning) onClose();\n }}\n >\n <ResponsiveDialogContent\n className=\"max-h-[min(85vh,44rem)] overflow-y-auto sm:max-w-lg\"\n showCloseButton={!jobRunning}\n >\n <ResponsiveDialogHeader>\n <ResponsiveDialogTitle>\n {tr('mesh.deploy.title', 'Deploy Agent via Mesh')}\n </ResponsiveDialogTitle>\n <ResponsiveDialogDescription>\n {tr(\n 'mesh.deploy.description',\n 'Deploy a new agent through the mesh from a selected source agent.'\n )}\n </ResponsiveDialogDescription>\n </ResponsiveDialogHeader>\n\n <Stepper steps={wizardSteps} active={jobId ? 1 : 0} />\n\n {/ Job progress takes over once a job is running /}\n {jobId ? (\n <div className=\"space-y-3\">\n <p role=\"status\" className=\"text-sm text-text-secondary\">\n {tr('mesh.deploy.deploying', 'Deploying through {{agent}}…', {\n agent: sourceAgents.find((a) => a.id === sourceAgentId)?.name ?? 'agent',\n })}\n </p>\n <div className=\"space-y-2\">\n {job && job.steps.length > 0 ? (\n job.steps.map((step, idx) => (\n <div key={`${step.step}-${idx}`} className=\"flex items-center gap-3\">\n {step.status === 'running' && (\n <Loader2 className=\"size-4 animate-spin text-text-link\" aria-hidden=\"true\" />\n )}\n {step.status === 'completed' && (\n <CheckCircle className=\"size-4 text-status-success-text\" aria-hidden=\"true\" />\n )}\n {step.status === 'failed' && (\n <XCircle className=\"size-4 text-status-error-text\" aria-hidden=\"true\" />\n )}\n {step.status === 'skipped' && (\n <Check className=\"size-4 text-text-muted\" aria-hidden=\"true\" />\n )}\n {step.status === 'pending' && (\n <div\n className=\"size-4 rounded-full border-2 border-border-default\"\n aria-hidden=\"true\"\n />\n )}\n <div className=\"min-w-0\">\n <div className=\"text-sm font-medium text-text-primary\">\n {tr(`mesh.deploy.steps.${step.step}`, stepLabels[step.step] ?? step.step)}\n </div>\n {step.message ? (\n <div className=\"text-xs break-words text-text-muted\">{step.message}</div>\n ) : null}\n </div>\n </div>\n ))\n ) : (\n <div className=\"flex items-center gap-3\">\n <Loader2 className=\"size-4 animate-spin text-text-link\" aria-hidden=\"true\" />\n <span className=\"text-sm text-text-secondary\">\n {tr('mesh.deploy.starting', 'Starting deploy job…')}\n </span>\n </div>\n )}\n </div>\n\n {job?.status === 'completed' && (\n <div\n role=\"status\"\n className=\"rounded-lg border border-status-success-border bg-status-success-bg-subtle p-3 text-sm text-status-success-text\"\n >\n {tr('mesh.deploy.success', 'Agent deployed successfully!')}\n </div>\n )}\n {job?.status === 'failed' && (\n <div\n role=\"alert\"\n className=\"rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text\"\n >\n {job.error ?? tr('mesh.deploy.jobFailed', 'Deploy failed.')}\n </div>\n )}\n\n <ResponsiveDialogFooter>\n <Button\n type=\"button\"\n variant=\"outline\"\n onClick={onClose}\n disabled={jobRunning}\n aria-busy={jobRunning}\n className=\"w-full max-md:min-h-11\"\n >\n {jobRunning\n ? tr('mesh.deploy.deployingShort', 'Deploying…')\n : tr('common.close', 'Close')}\n </Button>\n </ResponsiveDialogFooter>\n </div>\n ) : (\n <div className=\"space-y-4\">\n {/ Source agent /}\n <div>\n <label className={LABEL_CLASS} htmlFor={sourceField.id}>\n {tr('mesh.deploy.sourceAgent', 'Source agent (deploys from)')}\n </label>\n <Select\n value={sourceAgentId \|\| undefined}\n onValueChange={setSourceAgentId}\n disabled={sourceAgents.length === 0}\n >\n <SelectTrigger id={sourceField.id} className=\"w-full text-base md:text-sm\">\n <SelectValue placeholder={tr('mesh.deploy.noAgents', 'No agents available')} />\n </SelectTrigger>\n <SelectContent>\n {sourceAgents.map((a) => (\n <SelectItem key={a.id} value={a.id}>\n {a.name} ({a.hostname}){a.isActive ? '' : ' · offline'}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n </div>\n\n {/ Mode toggle /}\n <div>\n <span className={LABEL_CLASS}>{tr('mesh.deploy.mode', 'Deploy mode')}</span>\n <div className=\"flex flex-wrap gap-2\">\n <button\n type=\"button\"\n aria-pressed={mode === 'ssh'}\n onClick={() => setMode('ssh')}\n className={`${MODE_BUTTON_BASE_CLASS} ${\n mode === 'ssh'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n <Server className=\"size-3.5\" aria-hidden=\"true\" />\n {tr('mesh.deploy.modeSsh', 'Remote (SSH)')}\n </button>\n <button\n type=\"button\"\n aria-pressed={mode === 'same'}\n onClick={() => setMode('same')}\n className={`${MODE_BUTTON_BASE_CLASS} ${\n mode === 'same'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n <Laptop className=\"size-3.5\" aria-hidden=\"true\" />\n {tr('mesh.deploy.modeSame', 'Same machine')}\n </button>\n </div>\n </div>\n\n {/ SSH fields /}\n {mode === 'ssh' && (\n <div className=\"space-y-3\">\n <div className=\"grid grid-cols-1 gap-2 sm:grid-cols-3\">\n <div className=\"sm:col-span-2\">\n <label className={LABEL_CLASS} htmlFor={hostField.id}>\n {tr('mesh.deploy.host', 'Host / alias')}\n </label>\n <Input\n {...hostField.inputProps}\n type=\"text\"\n value={host}\n onChange={(e) => setHost(e.target.value)}\n placeholder=\"prod-web-01 or 10.0.0.5\"\n className=\"font-mono text-base md:text-sm\"\n />\n </div>\n <div>\n <label className={LABEL_CLASS} htmlFor={portField.id}>\n {tr('mesh.deploy.port', 'Port')}\n </label>\n <Input\n {...portField.inputProps}\n type=\"number\"\n value={port}\n onChange={(e) => setPort(Number(e.target.value) \|\| 22)}\n className=\"text-base md:text-sm\"\n />\n </div>\n </div>\n <div>\n <label className={LABEL_CLASS} htmlFor={userField.id}>\n {tr('mesh.deploy.user', 'User')}\n </label>\n <Input\n {...userField.inputProps}\n type=\"text\"\n value={user}\n onChange={(e) => setUser(e.target.value)}\n placeholder=\"root\"\n className=\"font-mono text-base md:text-sm\"\n />\n </div>\n <div>\n <span className={LABEL_CLASS}>{tr('mesh.deploy.auth', 'Authentication')}</span>\n <div className=\"flex flex-wrap gap-x-4 gap-y-2\">\n <label className=\"inline-flex cursor-pointer items-center gap-2 text-sm text-text-primary max-md:min-h-11\">\n <input\n type=\"radio\"\n name=\"mesh-auth\"\n checked={authMethod === 'agent'}\n onChange={() => setAuthMethod('agent')}\n />\n {tr('mesh.deploy.authAgent', 'SSH agent / default key')}\n </label>\n <label className=\"inline-flex cursor-pointer items-center gap-2 text-sm text-text-primary max-md:min-h-11\">\n <input\n type=\"radio\"\n name=\"mesh-auth\"\n checked={authMethod === 'key'}\n onChange={() => setAuthMethod('key')}\n />\n {tr('mesh.deploy.authKey', 'Key path')}\n </label>\n </div>\n </div>\n {authMethod === 'key' && (\n <div>\n <label className={LABEL_CLASS} htmlFor={keyField.id}>\n {tr('mesh.deploy.keyPath', 'Identity file (key path)')}\n </label>\n <Input\n {...keyField.inputProps}\n type=\"text\"\n value={keyPath}\n onChange={(e) => setKeyPath(e.target.value)}\n placeholder=\"~/.ssh/id_ed25519\"\n className=\"font-mono text-base md:text-sm\"\n />\n </div>\n )}\n </div>\n )}\n\n {/ Label /}\n <div>\n <label className={LABEL_CLASS} htmlFor={labelField.id}>\n {tr('mesh.deploy.label', 'Label (optional)')}\n </label>\n <Input\n {...labelField.inputProps}\n type=\"text\"\n value={label}\n onChange={(e) => setLabel(e.target.value)}\n placeholder={tr('mesh.deploy.labelPlaceholder', 'e.g. Production web tier')}\n className=\"text-base md:text-sm\"\n />\n </div>\n\n {/ Permission chips */}\n {availablePermissions && availablePermissions.length > 0 && (\n <div>\n <span className={LABEL_CLASS}>\n {tr('mesh.deploy.permissions', 'Grant permissions on the new link')}\n </span>\n <div className=\"flex flex-wrap gap-2\">\n {availablePermissions.map((p) => (\n <button\n type=\"button\"\n key={p}\n aria-pressed={permissions.has(p)}\n onClick={() => togglePermission(p)}\n className={`${CHIP_BASE_CLASS} ${\n permissions.has(p)\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {p}\n </button>\n ))}\n </div>\n </div>\n )}\n\n <label className=\"flex cursor-pointer items-start gap-2 text-sm text-text-primary\">\n <Checkbox\n checked={connectExisting}\n onCheckedChange={(checked) => setConnectExisting(checked === true)}\n className=\"mt-0.5\"\n />\n <span>\n {tr(\n 'mesh.deploy.connectExisting',\n 'Connect to an existing agent on the target instead of installing'\n )}\n </span>\n </label>\n\n {submitError && (\n <div\n role=\"alert\"\n className=\"rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text\"\n >\n {submitError}\n </div>\n )}\n\n <ResponsiveDialogFooter>\n <Button type=\"button\" variant=\"outline\" onClick={onClose} className=\"max-md:min-h-11\">\n {tr('common.cancel', 'Cancel')}\n </Button>\n <Button\n type=\"button\"\n onClick={() => void handleSubmit()}\n disabled={!canSubmit \|\| deploying}\n aria-busy={deploying}\n className=\"max-md:min-h-11\"\n >\n {deploying ? <Loader2 className=\"size-4 animate-spin\" aria-hidden=\"true\" /> : null}\n {tr('mesh.deploy.submit', 'Deploy')}\n </Button>\n </ResponsiveDialogFooter>\n </div>\n )}\n </ResponsiveDialogContent>\n </ResponsiveDialog>\n );\n}\n"],"mappings":"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"}

package/dist/components/graph/MeshRequestPanel.js CHANGED Viewed

@@ -146,12 +146,12 @@ function h({ rootAgentId: h, destinations: g, initialDestinationId: _, onClose:
 						children: [/* @__PURE__ */ l("button", {
 							type: "button",
 							onClick: () => C("command"),
-							className: `px-3 py-2 text-sm rounded-md border transition-colors ${S === "command" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+							className: `px-3 py-2 text-sm rounded-md border transition-colors ${S === "command" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
 							children: y("mesh.request.command", "Command")
 						}), /* @__PURE__ */ l("button", {
 							type: "button",
 							onClick: () => C("api"),
-							className: `px-3 py-2 text-sm rounded-md border transition-colors ${S === "api" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+							className: `px-3 py-2 text-sm rounded-md border transition-colors ${S === "api" ? "border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
 							children: y("mesh.request.api", "API")
 						})]
 					})]

package/dist/components/graph/MeshRequestPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MeshRequestPanel.js","names":[],"sources":["../../../src/components/graph/MeshRequestPanel.tsx"],"sourcesContent":["/*\n MeshRequestPanel — run a request against a destination agent THROUGH the mesh.\n \n The backend computes the hop path from the chosen root (source) agent to the\n * destination, so the panel only supplies `rootAgentId` + `destinationAgentId`\n * + the request. Two request modes:\n * - COMMAND: type a `vibe` argv; we POST to\n * `/api/profiles/default/agent/commands/run` with body `{ argv }`.\n * - API: raw method + path + optional JSON body.\n \n The AgentProxyResponse is rendered like AgentMaintenanceTab's output pane,\n * and a hops breadcrumb is shown when the response surfaces hop info.\n /\n\nimport { useCallback, useMemo, useState } from 'react';\nimport { Loader2, Play, ChevronRight, Network } from 'lucide-react';\nimport { useTr } from '../../shared/hooks/useTr';\nimport { useExecuteAgentMeshRequestMutation } from '@/generated/wspace-operations';\nimport type { MeshAgentUi } from './meshTypes';\n\ntype RequestMode = 'command' \| 'api';\ntype HttpMethod = 'GET' \| 'POST' \| 'PUT' \| 'DELETE' \| 'PATCH';\n\nfunction asRecord(v: unknown): Record<string, unknown> \| null {\n return v && typeof v === 'object' && !Array.isArray(v) ? (v as Record<string, unknown>) : null;\n}\nfunction jstr(obj: Record<string, unknown> \| null, key: string): string \| null {\n const v = obj?.[key];\n return typeof v === 'string' ? v : null;\n}\n\nfunction extractHops(data: Record<string, unknown> \| null): string[] {\n if (!data) return [];\n const raw = data.hops ?? asRecord(data.meta)?.hops;\n if (Array.isArray(raw)) return raw.filter((h): h is string => typeof h === 'string');\n return [];\n}\n\nconst INPUT_CLASS =\n 'px-3 py-2 text-sm rounded-md bg-bg-sunken border border-border-default text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/40';\n\ninterface MeshRequestPanelProps {\n /* The root/source agent the request is dispatched from. /\n rootAgentId: string \| null;\n /* Candidate destination agents (typically the workspace mesh agents). /\n destinations: MeshAgentUi[];\n /* Pre-selected destination (e.g. clicked node). */\n initialDestinationId?: string \| null;\n onClose?: () => void;\n}\n\nexport function MeshRequestPanel({\n rootAgentId,\n destinations,\n initialDestinationId,\n onClose,\n}: MeshRequestPanelProps) {\n const tr = useTr();\n\n const [destinationId, setDestinationId] = useState<string>(\n initialDestinationId ?? destinations[0]?.id ?? ''\n );\n const [mode, setMode] = useState<RequestMode>('command');\n const [argv, setArgv] = useState('status');\n const [method, setMethod] = useState<HttpMethod>('GET');\n const [path, setPath] = useState('/api/health');\n const [bodyText, setBodyText] = useState('');\n const [output, setOutput] = useState<{ body: string; error?: boolean } \| null>(null);\n const [hops, setHops] = useState<string[]>([]);\n\n const [execute, { loading }] = useExecuteAgentMeshRequestMutation();\n\n const destName = useCallback(\n (id: string) => destinations.find((d) => d.id === id)?.name ?? id,\n [destinations]\n );\n\n const canRun = useMemo(() => {\n if (!rootAgentId \|\| !destinationId) return false;\n if (mode === 'command') return argv.trim().length > 0;\n return path.trim().length > 0;\n }, [rootAgentId, destinationId, mode, argv, path]);\n\n const handleRun = useCallback(async () => {\n if (!rootAgentId \|\| !destinationId) return;\n setOutput(null);\n setHops([]);\n\n let requestInput: {\n method: string;\n path: string;\n body?: Record<string, unknown>;\n };\n\n if (mode === 'command') {\n const parts = argv.trim().split(/\\s+/).filter(Boolean);\n requestInput = {\n method: 'POST',\n path: '/api/profiles/default/agent/commands/run',\n body: { argv: parts },\n };\n } else {\n let parsedBody: Record<string, unknown> \| undefined;\n if (bodyText.trim().length > 0) {\n try {\n const parsed: unknown = JSON.parse(bodyText);\n parsedBody = asRecord(parsed) ?? undefined;\n if (!parsedBody) {\n setOutput({\n body: tr('mesh.request.bodyNotObject', 'Body must be a JSON object.'),\n error: true,\n });\n return;\n }\n } catch {\n setOutput({\n body: tr('mesh.request.invalidJson', 'Request body is not valid JSON.'),\n error: true,\n });\n return;\n }\n }\n requestInput = { method, path: path.trim(), body: parsedBody };\n }\n\n try {\n const res = await execute({\n variables: {\n rootAgentId,\n destinationAgentId: destinationId,\n request: requestInput,\n },\n });\n const proxy = res.data?.executeAgentMeshRequest;\n const data = asRecord(proxy?.data);\n setHops(extractHops(data));\n\n if (res.error \|\| proxy?.error \|\| proxy?.ok === false) {\n setOutput({\n body:\n proxy?.error ??\n res.error?.message ??\n jstr(data, 'error') ??\n tr('mesh.request.failed', 'Request failed'),\n error: true,\n });\n return;\n }\n\n const stdout = jstr(data, 'stdout');\n const text = proxy?.text;\n const pretty = data ? JSON.stringify(data, null, 2) : (text ?? '(no output)');\n setOutput({ body: stdout \|\| text \|\| pretty });\n } catch (err) {\n setOutput({ body: err instanceof Error ? err.message : String(err), error: true });\n }\n }, [rootAgentId, destinationId, mode, argv, method, path, bodyText, execute, tr]);\n\n return (\n <div className=\"rounded-lg border border-border-default bg-bg-surface p-4 space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-2\">\n <Network className=\"size-4 text-text-secondary\" />\n <h3 className=\"text-sm font-semibold text-text-primary\">\n {tr('mesh.request.title', 'Run mesh request')}\n </h3>\n </div>\n {onClose && (\n <button\n type=\"button\"\n onClick={onClose}\n className=\"text-xs text-text-muted hover:text-text-primary\"\n >\n {tr('common.close', 'Close')}\n </button>\n )}\n </div>\n\n {!rootAgentId && (\n <p className=\"text-xs text-status-warning-text\">\n {tr('mesh.request.noRoot', 'Select a reachable root agent to dispatch from.')}\n </p>\n )}\n\n <div className=\"flex flex-wrap items-end gap-2\">\n <div className=\"flex flex-col gap-1\">\n <label className=\"text-xs text-text-muted\" htmlFor=\"mesh-dest\">\n {tr('mesh.request.destination', 'Destination agent')}\n </label>\n <select\n id=\"mesh-dest\"\n value={destinationId}\n onChange={(e) => setDestinationId(e.target.value)}\n className={`${INPUT_CLASS} min-w-44`}\n >\n {destinations.length === 0 && (\n <option value=\"\">{tr('mesh.request.noDest', 'No agents')}</option>\n )}\n {destinations.map((d) => (\n <option key={d.id} value={d.id}>\n {d.name} ({d.hostname})\n </option>\n ))}\n </select>\n </div>\n\n <div className=\"flex flex-col gap-1\">\n <span className=\"text-xs text-text-muted\">{tr('mesh.request.mode', 'Mode')}</span>\n <div className=\"flex gap-1\">\n <button\n type=\"button\"\n onClick={() => setMode('command')}\n className={`px-3 py-2 text-sm rounded-md border transition-colors ${\n mode === 'command'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {tr('mesh.request.command', 'Command')}\n </button>\n <button\n type=\"button\"\n onClick={() => setMode('api')}\n className={`px-3 py-2 text-sm rounded-md border transition-colors ${\n mode === 'api'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-action-primary-bg'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {tr('mesh.request.api', 'API')}\n </button>\n </div>\n </div>\n </div>\n\n {mode === 'command' ? (\n <div className=\"flex flex-col gap-1\">\n <label className=\"text-xs text-text-muted\" htmlFor=\"mesh-argv\">\n {tr('mesh.request.argv', 'Command (vibe …)')}\n </label>\n <input\n id=\"mesh-argv\"\n type=\"text\"\n value={argv}\n onChange={(e) => setArgv(e.target.value)}\n placeholder=\"status --json\"\n className={`${INPUT_CLASS} font-mono w-full`}\n />\n </div>\n ) : (\n <div className=\"space-y-2\">\n <div className=\"flex gap-2\">\n <select\n value={method}\n onChange={(e) => setMethod(e.target.value as HttpMethod)}\n className={`${INPUT_CLASS} w-28`}\n aria-label={tr('mesh.request.method', 'Method')}\n >\n {(['GET', 'POST', 'PUT', 'DELETE', 'PATCH'] as HttpMethod[]).map((m) => (\n <option key={m} value={m}>\n {m}\n </option>\n ))}\n </select>\n <input\n type=\"text\"\n value={path}\n onChange={(e) => setPath(e.target.value)}\n placeholder=\"/api/health\"\n className={`${INPUT_CLASS} font-mono flex-1`}\n aria-label={tr('mesh.request.path', 'Path')}\n />\n </div>\n <textarea\n value={bodyText}\n onChange={(e) => setBodyText(e.target.value)}\n placeholder={tr('mesh.request.bodyPlaceholder', 'JSON body (optional)')}\n rows={3}\n className={`${INPUT_CLASS} font-mono w-full resize-y`}\n aria-label={tr('mesh.request.body', 'Request body')}\n />\n </div>\n )}\n\n <button\n type=\"button\"\n onClick={() => void handleRun()}\n disabled={!canRun \|\| loading}\n className=\"inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50\"\n >\n {loading ? <Loader2 className=\"size-4 animate-spin\" /> : <Play className=\"size-4\" />}\n {tr('mesh.request.run', 'Run')}\n </button>\n\n {hops.length > 0 && (\n <div className=\"flex flex-wrap items-center gap-1 text-xs text-text-tertiary\">\n <span className=\"font-medium text-text-secondary\">\n {tr('mesh.request.hops', 'Hops:')}\n </span>\n {hops.map((hop, idx) => (\n <span key={`${hop}-${idx}`} className=\"inline-flex items-center gap-1\">\n <span className=\"rounded bg-bg-sunken px-1.5 py-0.5 text-text-primary\">\n {destName(hop)}\n </span>\n {idx < hops.length - 1 && <ChevronRight className=\"size-3\" />}\n </span>\n ))}\n </div>\n )}\n\n {output && (\n <pre\n className={`text-xs whitespace-pre-wrap break-words max-h-80 overflow-auto rounded-md p-3 ${\n output.error\n ? 'bg-status-error-bg-subtle text-status-error-text'\n : 'bg-bg-sunken text-text-primary'\n }`}\n >\n {output.body}\n </pre>\n )}\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"MeshRequestPanel.js","names":[],"sources":["../../../src/components/graph/MeshRequestPanel.tsx"],"sourcesContent":["/*\n MeshRequestPanel — run a request against a destination agent THROUGH the mesh.\n \n The backend computes the hop path from the chosen root (source) agent to the\n * destination, so the panel only supplies `rootAgentId` + `destinationAgentId`\n * + the request. Two request modes:\n * - COMMAND: type a `vibe` argv; we POST to\n * `/api/profiles/default/agent/commands/run` with body `{ argv }`.\n * - API: raw method + path + optional JSON body.\n \n The AgentProxyResponse is rendered like AgentMaintenanceTab's output pane,\n * and a hops breadcrumb is shown when the response surfaces hop info.\n /\n\nimport { useCallback, useMemo, useState } from 'react';\nimport { Loader2, Play, ChevronRight, Network } from 'lucide-react';\nimport { useTr } from '../../shared/hooks/useTr';\nimport { useExecuteAgentMeshRequestMutation } from '@/generated/wspace-operations';\nimport type { MeshAgentUi } from './meshTypes';\n\ntype RequestMode = 'command' \| 'api';\ntype HttpMethod = 'GET' \| 'POST' \| 'PUT' \| 'DELETE' \| 'PATCH';\n\nfunction asRecord(v: unknown): Record<string, unknown> \| null {\n return v && typeof v === 'object' && !Array.isArray(v) ? (v as Record<string, unknown>) : null;\n}\nfunction jstr(obj: Record<string, unknown> \| null, key: string): string \| null {\n const v = obj?.[key];\n return typeof v === 'string' ? v : null;\n}\n\nfunction extractHops(data: Record<string, unknown> \| null): string[] {\n if (!data) return [];\n const raw = data.hops ?? asRecord(data.meta)?.hops;\n if (Array.isArray(raw)) return raw.filter((h): h is string => typeof h === 'string');\n return [];\n}\n\nconst INPUT_CLASS =\n 'px-3 py-2 text-sm rounded-md bg-bg-sunken border border-border-default text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/40';\n\ninterface MeshRequestPanelProps {\n /* The root/source agent the request is dispatched from. /\n rootAgentId: string \| null;\n /* Candidate destination agents (typically the workspace mesh agents). /\n destinations: MeshAgentUi[];\n /* Pre-selected destination (e.g. clicked node). */\n initialDestinationId?: string \| null;\n onClose?: () => void;\n}\n\nexport function MeshRequestPanel({\n rootAgentId,\n destinations,\n initialDestinationId,\n onClose,\n}: MeshRequestPanelProps) {\n const tr = useTr();\n\n const [destinationId, setDestinationId] = useState<string>(\n initialDestinationId ?? destinations[0]?.id ?? ''\n );\n const [mode, setMode] = useState<RequestMode>('command');\n const [argv, setArgv] = useState('status');\n const [method, setMethod] = useState<HttpMethod>('GET');\n const [path, setPath] = useState('/api/health');\n const [bodyText, setBodyText] = useState('');\n const [output, setOutput] = useState<{ body: string; error?: boolean } \| null>(null);\n const [hops, setHops] = useState<string[]>([]);\n\n const [execute, { loading }] = useExecuteAgentMeshRequestMutation();\n\n const destName = useCallback(\n (id: string) => destinations.find((d) => d.id === id)?.name ?? id,\n [destinations]\n );\n\n const canRun = useMemo(() => {\n if (!rootAgentId \|\| !destinationId) return false;\n if (mode === 'command') return argv.trim().length > 0;\n return path.trim().length > 0;\n }, [rootAgentId, destinationId, mode, argv, path]);\n\n const handleRun = useCallback(async () => {\n if (!rootAgentId \|\| !destinationId) return;\n setOutput(null);\n setHops([]);\n\n let requestInput: {\n method: string;\n path: string;\n body?: Record<string, unknown>;\n };\n\n if (mode === 'command') {\n const parts = argv.trim().split(/\\s+/).filter(Boolean);\n requestInput = {\n method: 'POST',\n path: '/api/profiles/default/agent/commands/run',\n body: { argv: parts },\n };\n } else {\n let parsedBody: Record<string, unknown> \| undefined;\n if (bodyText.trim().length > 0) {\n try {\n const parsed: unknown = JSON.parse(bodyText);\n parsedBody = asRecord(parsed) ?? undefined;\n if (!parsedBody) {\n setOutput({\n body: tr('mesh.request.bodyNotObject', 'Body must be a JSON object.'),\n error: true,\n });\n return;\n }\n } catch {\n setOutput({\n body: tr('mesh.request.invalidJson', 'Request body is not valid JSON.'),\n error: true,\n });\n return;\n }\n }\n requestInput = { method, path: path.trim(), body: parsedBody };\n }\n\n try {\n const res = await execute({\n variables: {\n rootAgentId,\n destinationAgentId: destinationId,\n request: requestInput,\n },\n });\n const proxy = res.data?.executeAgentMeshRequest;\n const data = asRecord(proxy?.data);\n setHops(extractHops(data));\n\n if (res.error \|\| proxy?.error \|\| proxy?.ok === false) {\n setOutput({\n body:\n proxy?.error ??\n res.error?.message ??\n jstr(data, 'error') ??\n tr('mesh.request.failed', 'Request failed'),\n error: true,\n });\n return;\n }\n\n const stdout = jstr(data, 'stdout');\n const text = proxy?.text;\n const pretty = data ? JSON.stringify(data, null, 2) : (text ?? '(no output)');\n setOutput({ body: stdout \|\| text \|\| pretty });\n } catch (err) {\n setOutput({ body: err instanceof Error ? err.message : String(err), error: true });\n }\n }, [rootAgentId, destinationId, mode, argv, method, path, bodyText, execute, tr]);\n\n return (\n <div className=\"rounded-lg border border-border-default bg-bg-surface p-4 space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-2\">\n <Network className=\"size-4 text-text-secondary\" />\n <h3 className=\"text-sm font-semibold text-text-primary\">\n {tr('mesh.request.title', 'Run mesh request')}\n </h3>\n </div>\n {onClose && (\n <button\n type=\"button\"\n onClick={onClose}\n className=\"text-xs text-text-muted hover:text-text-primary\"\n >\n {tr('common.close', 'Close')}\n </button>\n )}\n </div>\n\n {!rootAgentId && (\n <p className=\"text-xs text-status-warning-text\">\n {tr('mesh.request.noRoot', 'Select a reachable root agent to dispatch from.')}\n </p>\n )}\n\n <div className=\"flex flex-wrap items-end gap-2\">\n <div className=\"flex flex-col gap-1\">\n <label className=\"text-xs text-text-muted\" htmlFor=\"mesh-dest\">\n {tr('mesh.request.destination', 'Destination agent')}\n </label>\n <select\n id=\"mesh-dest\"\n value={destinationId}\n onChange={(e) => setDestinationId(e.target.value)}\n className={`${INPUT_CLASS} min-w-44`}\n >\n {destinations.length === 0 && (\n <option value=\"\">{tr('mesh.request.noDest', 'No agents')}</option>\n )}\n {destinations.map((d) => (\n <option key={d.id} value={d.id}>\n {d.name} ({d.hostname})\n </option>\n ))}\n </select>\n </div>\n\n <div className=\"flex flex-col gap-1\">\n <span className=\"text-xs text-text-muted\">{tr('mesh.request.mode', 'Mode')}</span>\n <div className=\"flex gap-1\">\n <button\n type=\"button\"\n onClick={() => setMode('command')}\n className={`px-3 py-2 text-sm rounded-md border transition-colors ${\n mode === 'command'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {tr('mesh.request.command', 'Command')}\n </button>\n <button\n type=\"button\"\n onClick={() => setMode('api')}\n className={`px-3 py-2 text-sm rounded-md border transition-colors ${\n mode === 'api'\n ? 'border-action-primary-bg bg-[var(--color-accent-soft)] text-text-primary'\n : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n }`}\n >\n {tr('mesh.request.api', 'API')}\n </button>\n </div>\n </div>\n </div>\n\n {mode === 'command' ? (\n <div className=\"flex flex-col gap-1\">\n <label className=\"text-xs text-text-muted\" htmlFor=\"mesh-argv\">\n {tr('mesh.request.argv', 'Command (vibe …)')}\n </label>\n <input\n id=\"mesh-argv\"\n type=\"text\"\n value={argv}\n onChange={(e) => setArgv(e.target.value)}\n placeholder=\"status --json\"\n className={`${INPUT_CLASS} font-mono w-full`}\n />\n </div>\n ) : (\n <div className=\"space-y-2\">\n <div className=\"flex gap-2\">\n <select\n value={method}\n onChange={(e) => setMethod(e.target.value as HttpMethod)}\n className={`${INPUT_CLASS} w-28`}\n aria-label={tr('mesh.request.method', 'Method')}\n >\n {(['GET', 'POST', 'PUT', 'DELETE', 'PATCH'] as HttpMethod[]).map((m) => (\n <option key={m} value={m}>\n {m}\n </option>\n ))}\n </select>\n <input\n type=\"text\"\n value={path}\n onChange={(e) => setPath(e.target.value)}\n placeholder=\"/api/health\"\n className={`${INPUT_CLASS} font-mono flex-1`}\n aria-label={tr('mesh.request.path', 'Path')}\n />\n </div>\n <textarea\n value={bodyText}\n onChange={(e) => setBodyText(e.target.value)}\n placeholder={tr('mesh.request.bodyPlaceholder', 'JSON body (optional)')}\n rows={3}\n className={`${INPUT_CLASS} font-mono w-full resize-y`}\n aria-label={tr('mesh.request.body', 'Request body')}\n />\n </div>\n )}\n\n <button\n type=\"button\"\n onClick={() => void handleRun()}\n disabled={!canRun \|\| loading}\n className=\"inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50\"\n >\n {loading ? <Loader2 className=\"size-4 animate-spin\" /> : <Play className=\"size-4\" />}\n {tr('mesh.request.run', 'Run')}\n </button>\n\n {hops.length > 0 && (\n <div className=\"flex flex-wrap items-center gap-1 text-xs text-text-tertiary\">\n <span className=\"font-medium text-text-secondary\">\n {tr('mesh.request.hops', 'Hops:')}\n </span>\n {hops.map((hop, idx) => (\n <span key={`${hop}-${idx}`} className=\"inline-flex items-center gap-1\">\n <span className=\"rounded bg-bg-sunken px-1.5 py-0.5 text-text-primary\">\n {destName(hop)}\n </span>\n {idx < hops.length - 1 && <ChevronRight className=\"size-3\" />}\n </span>\n ))}\n </div>\n )}\n\n {output && (\n <pre\n className={`text-xs whitespace-pre-wrap break-words max-h-80 overflow-auto rounded-md p-3 ${\n output.error\n ? 'bg-status-error-bg-subtle text-status-error-text'\n : 'bg-bg-sunken text-text-primary'\n }`}\n >\n {output.body}\n </pre>\n )}\n </div>\n );\n}\n"],"mappings":";;;;;;AAuBA,SAAS,EAAS,GAA4C;AAC5D,QAAO,KAAK,OAAO,KAAM,YAAY,CAAC,MAAM,QAAQ,EAAE,GAAI,IAAgC;;AAE5F,SAAS,EAAK,GAAqC,GAA4B;CAC7E,IAAM,IAAI,IAAM;AAChB,QAAO,OAAO,KAAM,WAAW,IAAI;;AAGrC,SAAS,EAAY,GAAgD;AACnE,KAAI,CAAC,EAAM,QAAO,EAAE;CACpB,IAAM,IAAM,EAAK,QAAQ,EAAS,EAAK,KAAK,EAAE;AAE9C,QADI,MAAM,QAAQ,EAAI,GAAS,EAAI,QAAQ,MAAmB,OAAO,KAAM,SAAS,GAC7E,EAAE;;AAGX,IAAM,IACJ;AAYF,SAAgB,EAAiB,EAC/B,gBACA,iBACA,yBACA,cACwB;CACxB,IAAM,IAAK,GAAO,EAEZ,CAAC,GAAe,KAAoB,EACxC,KAAwB,EAAa,IAAI,MAAM,GAChD,EACK,CAAC,GAAM,KAAW,EAAsB,UAAU,EAClD,CAAC,GAAM,KAAW,EAAS,SAAS,EACpC,CAAC,GAAQ,KAAa,EAAqB,MAAM,EACjD,CAAC,GAAM,KAAW,EAAS,cAAc,EACzC,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAQ,KAAa,EAAmD,KAAK,EAC9E,CAAC,GAAM,KAAW,EAAmB,EAAE,CAAC,EAExC,CAAC,GAAS,EAAE,gBAAa,GAAoC,EAE7D,IAAW,GACd,MAAe,EAAa,MAAM,MAAM,EAAE,OAAO,EAAG,EAAE,QAAQ,GAC/D,CAAC,EAAa,CACf,EAEK,IAAS,QACT,CAAC,KAAe,CAAC,IAAsB,KACvC,MAAS,YAAkB,EAAK,MAAM,CAAC,SAAS,IAC7C,EAAK,MAAM,CAAC,SAAS,GAC3B;EAAC;EAAa;EAAe;EAAM;EAAM;EAAK,CAAC,EAE5C,IAAY,EAAY,YAAY;AACxC,MAAI,CAAC,KAAe,CAAC,EAAe;AAEpC,EADA,EAAU,KAAK,EACf,EAAQ,EAAE,CAAC;EAEX,IAAI;AAMJ,MAAI,MAAS,UAEX,KAAe;GACb,QAAQ;GACR,MAAM;GACN,MAAM,EAAE,MAJI,EAAK,MAAM,CAAC,MAAM,MAAM,CAAC,OAAO,QAAQ,EAI/B;GACtB;OACI;GACL,IAAI;AACJ,OAAI,EAAS,MAAM,CAAC,SAAS,EAC3B,KAAI;AAGF,QADA,IAAa,EADW,KAAK,MAAM,EAAS,CACf,IAAI,KAAA,GAC7B,CAAC,GAAY;AACf,OAAU;MACR,MAAM,EAAG,8BAA8B,8BAA8B;MACrE,OAAO;MACR,CAAC;AACF;;WAEI;AACN,MAAU;KACR,MAAM,EAAG,4BAA4B,kCAAkC;KACvE,OAAO;KACR,CAAC;AACF;;AAGJ,OAAe;IAAE;IAAQ,MAAM,EAAK,MAAM;IAAE,MAAM;IAAY;;AAGhE,MAAI;GACF,IAAM,IAAM,MAAM,EAAQ,EACxB,WAAW;IACT;IACA,oBAAoB;IACpB,SAAS;IACV,EACF,CAAC,EACI,IAAQ,EAAI,MAAM,yBAClB,IAAO,EAAS,GAAO,KAAK;AAGlC,OAFA,EAAQ,EAAY,EAAK,CAAC,EAEtB,EAAI,SAAS,GAAO,SAAS,GAAO,OAAO,IAAO;AACpD,MAAU;KACR,MACE,GAAO,SACP,EAAI,OAAO,WACX,EAAK,GAAM,QAAQ,IACnB,EAAG,uBAAuB,iBAAiB;KAC7C,OAAO;KACR,CAAC;AACF;;GAGF,IAAM,IAAS,EAAK,GAAM,SAAS,EAC7B,IAAO,GAAO,MACd,IAAS,IAAO,KAAK,UAAU,GAAM,MAAM,EAAE,GAAI,KAAQ;AAC/D,KAAU,EAAE,MAAM,KAAU,KAAQ,GAAQ,CAAC;WACtC,GAAK;AACZ,KAAU;IAAE,MAAM,aAAe,QAAQ,EAAI,UAAU,OAAO,EAAI;IAAE,OAAO;IAAM,CAAC;;IAEnF;EAAC;EAAa;EAAe;EAAM;EAAM;EAAQ;EAAM;EAAU;EAAS;EAAG,CAAC;AAEjF,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAS,WAAU,8BAA+B,CAAA,EAClD,kBAAC,MAAD;MAAI,WAAU;gBACX,EAAG,sBAAsB,mBAAmB;MAC1C,CAAA,CACD;QACL,KACC,kBAAC,UAAD;KACE,MAAK;KACL,SAAS;KACT,WAAU;eAET,EAAG,gBAAgB,QAAQ;KACrB,CAAA,CAEP;;GAEL,CAAC,KACA,kBAAC,KAAD;IAAG,WAAU;cACV,EAAG,uBAAuB,kDAAkD;IAC3E,CAAA;GAGN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,SAAD;MAAO,WAAU;MAA0B,SAAQ;gBAChD,EAAG,4BAA4B,oBAAoB;MAC9C,CAAA,EACR,kBAAC,UAAD;MACE,IAAG;MACH,OAAO;MACP,WAAW,MAAM,EAAiB,EAAE,OAAO,MAAM;MACjD,WAAW,GAAG,EAAY;gBAJ5B,CAMG,EAAa,WAAW,KACvB,kBAAC,UAAD;OAAQ,OAAM;iBAAI,EAAG,uBAAuB,YAAY;OAAU,CAAA,EAEnE,EAAa,KAAK,MACjB,kBAAC,UAAD;OAAmB,OAAO,EAAE;iBAA5B;QACG,EAAE;QAAK;QAAG,EAAE;QAAS;QACf;SAFI,EAAE,GAEN,CACT,CACK;QACL;QAEN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,QAAD;MAAM,WAAU;gBAA2B,EAAG,qBAAqB,OAAO;MAAQ,CAAA,EAClF,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,UAAD;OACE,MAAK;OACL,eAAe,EAAQ,UAAU;OACjC,WAAW,yDACT,MAAS,YACL,6EACA;iBAGL,EAAG,wBAAwB,UAAU;OAC/B,CAAA,EACT,kBAAC,UAAD;OACE,MAAK;OACL,eAAe,EAAQ,MAAM;OAC7B,WAAW,yDACT,MAAS,QACL,6EACA;iBAGL,EAAG,oBAAoB,MAAM;OACvB,CAAA,CACL;QACF;OACF;;GAEL,MAAS,YACR,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,SAAD;KAAO,WAAU;KAA0B,SAAQ;eAChD,EAAG,qBAAqB,mBAAmB;KACtC,CAAA,EACR,kBAAC,SAAD;KACE,IAAG;KACH,MAAK;KACL,OAAO;KACP,WAAW,MAAM,EAAQ,EAAE,OAAO,MAAM;KACxC,aAAY;KACZ,WAAW,GAAG,EAAY;KAC1B,CAAA,CACE;QAEN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,UAAD;MACE,OAAO;MACP,WAAW,MAAM,EAAU,EAAE,OAAO,MAAoB;MACxD,WAAW,GAAG,EAAY;MAC1B,cAAY,EAAG,uBAAuB,SAAS;gBAE7C;OAAC;OAAO;OAAQ;OAAO;OAAU;OAAQ,CAAkB,KAAK,MAChE,kBAAC,UAAD;OAAgB,OAAO;iBACpB;OACM,EAFI,EAEJ,CACT;MACK,CAAA,EACT,kBAAC,SAAD;MACE,MAAK;MACL,OAAO;MACP,WAAW,MAAM,EAAQ,EAAE,OAAO,MAAM;MACxC,aAAY;MACZ,WAAW,GAAG,EAAY;MAC1B,cAAY,EAAG,qBAAqB,OAAO;MAC3C,CAAA,CACE;QACN,kBAAC,YAAD;KACE,OAAO;KACP,WAAW,MAAM,EAAY,EAAE,OAAO,MAAM;KAC5C,aAAa,EAAG,gCAAgC,uBAAuB;KACvE,MAAM;KACN,WAAW,GAAG,EAAY;KAC1B,cAAY,EAAG,qBAAqB,eAAe;KACnD,CAAA,CACE;;GAGR,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,KAAK,GAAW;IAC/B,UAAU,CAAC,KAAU;IACrB,WAAU;cAJZ,CAMG,IAAU,kBAAC,GAAD,EAAS,WAAU,uBAAwB,CAAA,GAAG,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA,EACnF,EAAG,oBAAoB,MAAM,CACvB;;GAER,EAAK,SAAS,KACb,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,QAAD;KAAM,WAAU;eACb,EAAG,qBAAqB,QAAQ;KAC5B,CAAA,EACN,EAAK,KAAK,GAAK,MACd,kBAAC,QAAD;KAA4B,WAAU;eAAtC,CACE,kBAAC,QAAD;MAAM,WAAU;gBACb,EAAS,EAAI;MACT,CAAA,EACN,IAAM,EAAK,SAAS,KAAK,kBAAC,GAAD,EAAc,WAAU,UAAW,CAAA,CACxD;OALI,GAAG,EAAI,GAAG,IAKd,CACP,CACE;;GAGP,KACC,kBAAC,OAAD;IACE,WAAW,iFACT,EAAO,QACH,qDACA;cAGL,EAAO;IACJ,CAAA;GAEJ"}

package/dist/components/notes/NoteCard.js CHANGED Viewed

@@ -156,7 +156,7 @@ function g({ note: g, onOpen: _, onEdit: v, onDelete: y, onPin: b, onUnpin: x, o
 			g.tagAssignments && g.tagAssignments.length > 0 ? /* @__PURE__ */ h("div", {
 				className: "mt-3 flex flex-wrap gap-1",
 				children: [g.tagAssignments.slice(0, 3).map((e) => /* @__PURE__ */ h("span", {
-					className: "inline-flex items-center gap-1 px-2 py-0.5 text-xs bg-[var(--color-accent-soft)] text-action-primary-bg rounded",
+					className: "inline-flex items-center gap-1 px-2 py-0.5 text-xs bg-[var(--color-accent-soft)] text-text-primary rounded",
 					style: e.tag?.color ? { borderLeft: `3px solid ${e.tag.color}` } : void 0,
 					children: [/* @__PURE__ */ m(u, { className: "size-3" }), e.tag?.label ?? e.tagId.slice(0, 8)]
 				}, e.id)), g.tagAssignments.length > 3 && /* @__PURE__ */ h("span", {