@burdenoff/microfe-vibecontrols 2026.623.1 → 2026.623.2

package/dist/pages/PluginsCatalogPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"PluginsCatalogPage.js","names":[],"sources":["../../src/pages/PluginsCatalogPage.tsx"],"sourcesContent":["import { useMemo, useState, useCallback } from 'react';\nimport { Check, ChevronDown, Copy, Package, Plug, Search, X } from 'lucide-react';\nimport { MotionPage } from '@burdenoff/fe-libs/shared/motion';\nimport { PageContainer, Card } from '@burdenoff/fe-libs/ui';\nimport { PLUGIN_CATALOG, type PluginMeta } from '@/constants/pluginCatalog';\nimport { useTr } from '@/shared/hooks/useTr';\n\ntype PluginType = 'Meta' | 'Provider' | 'Plugin';\n\ninterface CategoryOption {\n  value: string;\n  labelKey: string;\n  labelFallback: string;\n}\n\nconst CATEGORY_OPTIONS: CategoryOption[] = [\n  { value: 'all', labelKey: 'vibecontrols.plugins.category.all', labelFallback: 'All' },\n  { value: 'ai-core', labelKey: 'vibecontrols.plugins.category.aiCore', labelFallback: 'AI Core' },\n  {\n    value: 'ai-provider',\n    labelKey: 'vibecontrols.plugins.category.aiProvider',\n    labelFallback: 'AI Providers',\n  },\n  {\n    value: 'plan-core',\n    labelKey: 'vibecontrols.plugins.category.planCore',\n    labelFallback: 'Plan Core',\n  },\n  {\n    value: 'plan-provider',\n    labelKey: 'vibecontrols.plugins.category.planProvider',\n    labelFallback: 'Plan Providers',\n  },\n  {\n    value: 'session-core',\n    labelKey: 'vibecontrols.plugins.category.sessionCore',\n    labelFallback: 'Session Core',\n  },\n  {\n    value: 'session-provider',\n    labelKey: 'vibecontrols.plugins.category.sessionProvider',\n    labelFallback: 'Session Providers',\n  },\n  { value: 'tunnel', labelKey: 'vibecontrols.plugins.category.tunnel', labelFallback: 'Tunnel' },\n  { value: 'vcs', labelKey: 'vibecontrols.plugins.category.vcs', labelFallback: 'VCS' },\n  {\n    value: 'api-playground',\n    labelKey: 'vibecontrols.plugins.category.apiPlayground',\n    labelFallback: 'API Playground',\n  },\n  {\n    value: 'gitops-core',\n    labelKey: 'vibecontrols.plugins.category.gitopsCore',\n    labelFallback: 'GitOps Core',\n  },\n  {\n    value: 'gitops-provider',\n    labelKey: 'vibecontrols.plugins.category.gitopsProvider',\n    labelFallback: 'GitOps Providers',\n  },\n  {\n    value: 'security-core',\n    labelKey: 'vibecontrols.plugins.category.securityCore',\n    labelFallback: 'Security Core',\n  },\n  {\n    value: 'security-provider',\n    labelKey: 'vibecontrols.plugins.category.securityProvider',\n    labelFallback: 'Security Providers',\n  },\n  { value: 'tool', labelKey: 'vibecontrols.plugins.category.tool', labelFallback: 'Tools' },\n];\n\nfunction derivePluginType(category: PluginMeta['category']): PluginType {\n  if (category.endsWith('-core')) return 'Meta';\n  if (category.endsWith('-provider')) return 'Provider';\n  return 'Plugin';\n}\n\nfunction typeBadgeClasses(type: PluginType): string {\n  switch (type) {\n    case 'Meta':\n      return 'bg-accent-purple-subtle text-accent-purple border-accent-purple/30';\n    case 'Provider':\n      return 'bg-status-info-bg text-status-info-text border-status-info-border';\n    default:\n      return 'bg-bg-sunken text-text-secondary border-border-default';\n  }\n}\n\ninterface CopyButtonProps {\n  text: string;\n  ariaLabel: string;\n}\n\nfunction CopyButton({ text, ariaLabel }: CopyButtonProps) {\n  const [copied, setCopied] = useState(false);\n  const handleCopy = useCallback(async () => {\n    try {\n      if (typeof navigator !== 'undefined' && navigator.clipboard) {\n        await navigator.clipboard.writeText(text);\n      }\n      setCopied(true);\n      window.setTimeout(() => setCopied(false), 1500);\n    } catch {\n      setCopied(false);\n    }\n  }, [text]);\n\n  return (\n    <button\n      type=\"button\"\n      onClick={handleCopy}\n      aria-label={ariaLabel}\n      className=\"inline-flex items-center justify-center size-7 rounded border border-border-default bg-bg-surface text-text-secondary hover:text-text-primary hover:bg-bg-elevated transition-colors flex-shrink-0\"\n    >\n      {copied ? <Check className=\"size-3.5\" /> : <Copy className=\"size-3.5\" />}\n    </button>\n  );\n}\n\ninterface PluginCardProps {\n  plugin: PluginMeta;\n}\n\nfunction PluginCard({ plugin }: PluginCardProps) {\n  const tr = useTr();\n  const type = derivePluginType(plugin.category);\n  const installCommand = `npm install ${plugin.packageName}`;\n  const usageSnippet = `import plugin from '${plugin.packageName}';`;\n\n  const [showUsage, setShowUsage] = useState(false);\n  const [showCommands, setShowCommands] = useState(false);\n\n  return (\n    <Card className=\"flex flex-col h-full p-0 bg-bg-surface border-border-default\">\n      <div className=\"flex flex-col gap-3 p-4\">\n        <div className=\"flex items-start justify-between gap-3\">\n          <div className=\"min-w-0 flex-1\">\n            <h3 className=\"text-base font-semibold text-text-primary truncate\">\n              {plugin.displayName}\n            </h3>\n            <p className=\"text-xs text-text-secondary font-mono truncate mt-1\">\n              {plugin.packageName}\n            </p>\n          </div>\n          <span\n            className={`inline-flex items-center gap-1 px-2 py-0.5 text-[10px] uppercase tracking-wide font-semibold rounded-full border ${typeBadgeClasses(type)} flex-shrink-0`}\n          >\n            {type}\n          </span>\n        </div>\n\n        <p className=\"text-sm text-text-secondary leading-snug\">{plugin.description}</p>\n\n        <div className=\"mt-1 space-y-1.5\">\n          <p className=\"text-[11px] font-medium uppercase tracking-wide text-text-secondary\">\n            {tr('vibecontrols.plugins.install', 'Install')}\n          </p>\n          <div className=\"flex items-center gap-2 rounded-md border border-border-default bg-bg-sunken px-2.5 py-1.5\">\n            <code className=\"flex-1 text-xs font-mono text-text-primary truncate\">\n              {installCommand}\n            </code>\n            <CopyButton\n              text={installCommand}\n              ariaLabel={tr(\n                'vibecontrols.plugins.copyInstall',\n                'Copy install command for {{name}}',\n                {\n                  name: plugin.displayName,\n                }\n              )}\n            />\n          </div>\n        </div>\n\n        <div className=\"space-y-2\">\n          <button\n            type=\"button\"\n            onClick={() => setShowUsage((value) => !value)}\n            className=\"w-full flex items-center justify-between gap-2 text-left text-xs font-medium text-text-secondary hover:text-text-primary transition-colors\"\n            aria-expanded={showUsage}\n          >\n            <span>{tr('vibecontrols.plugins.usage', 'Usage')}</span>\n            <ChevronDown\n              className={`size-3.5 transition-transform ${showUsage ? 'rotate-180' : ''}`}\n            />\n          </button>\n          {showUsage && (\n            <div className=\"flex items-start gap-2 rounded-md border border-border-default bg-bg-sunken px-2.5 py-2\">\n              <code className=\"flex-1 text-xs font-mono text-text-primary whitespace-pre-wrap break-all\">\n                {usageSnippet}\n              </code>\n              <CopyButton\n                text={usageSnippet}\n                ariaLabel={tr('vibecontrols.plugins.copyUsage', 'Copy usage snippet for {{name}}', {\n                  name: plugin.displayName,\n                })}\n              />\n            </div>\n          )}\n        </div>\n\n        <div className=\"space-y-2\">\n          <button\n            type=\"button\"\n            onClick={() => setShowCommands((value) => !value)}\n            className=\"w-full flex items-center justify-between gap-2 text-left text-xs font-medium text-text-secondary hover:text-text-primary transition-colors\"\n            aria-expanded={showCommands}\n          >\n            <span>{tr('vibecontrols.plugins.commands', 'Command reference')}</span>\n            <ChevronDown\n              className={`size-3.5 transition-transform ${showCommands ? 'rotate-180' : ''}`}\n            />\n          </button>\n          {showCommands && (\n            <div className=\"rounded-md border border-border-default bg-bg-sunken px-2.5 py-2\">\n              <p className=\"text-xs text-text-secondary\">\n                {tr(\n                  'vibecontrols.plugins.commandsHint',\n                  'See the agent admin sub-panel or the plugin README for the documented command list.'\n                )}\n              </p>\n            </div>\n          )}\n        </div>\n      </div>\n    </Card>\n  );\n}\n\nexport function PluginsCatalogPage() {\n  const tr = useTr();\n  const [search, setSearch] = useState('');\n  const [activeCategory, setActiveCategory] = useState<string>('all');\n\n  const pluginList = useMemo(() => {\n    return Object.values(PLUGIN_CATALOG).sort((a, b) => a.displayName.localeCompare(b.displayName));\n  }, []);\n\n  const filteredPlugins = useMemo(() => {\n    const term = search.trim().toLowerCase();\n    return pluginList.filter((plugin) => {\n      if (activeCategory !== 'all' && plugin.category !== activeCategory) return false;\n      if (!term) return true;\n      const haystack =\n        `${plugin.displayName} ${plugin.description} ${plugin.packageName}`.toLowerCase();\n      return haystack.includes(term);\n    });\n  }, [pluginList, search, activeCategory]);\n\n  return (\n    <PageContainer padded={false}>\n      <MotionPage className=\"flex flex-col h-full\">\n        {/* Sticky header with search + filter chips */}\n        <div className=\"sticky top-0 z-10 border-b border-border-default bg-bg-surface px-4 sm:px-6 pt-4 pb-3 space-y-3\">\n          <div className=\"flex items-start gap-3\">\n            <Plug className=\"size-6 text-text-primary mt-0.5 flex-shrink-0\" />\n            <div className=\"min-w-0 flex-1\">\n              <h1 className=\"text-xl font-bold text-text-primary\">\n                {tr('vibecontrols.plugins.title', 'Plugins')}\n              </h1>\n              <p className=\"text-sm text-text-secondary mt-0.5\">\n                {tr(\n                  'vibecontrols.plugins.description',\n                  'Browse and install plugins to extend your VibeControls agents.'\n                )}\n              </p>\n            </div>\n          </div>\n\n          <div className=\"relative\">\n            <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 size-4 text-text-secondary\" />\n            <input\n              type=\"search\"\n              value={search}\n              onChange={(event) => setSearch(event.target.value)}\n              placeholder={tr(\n                'vibecontrols.plugins.searchPlaceholder',\n                'Search by name, description, or package…'\n              )}\n              aria-label={tr('vibecontrols.plugins.searchLabel', 'Search plugins')}\n              className=\"w-full pl-10 pr-10 py-2 text-sm bg-bg-sunken border border-border-default rounded-md text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg focus:border-transparent transition-all\"\n            />\n            {search && (\n              <button\n                type=\"button\"\n                onClick={() => setSearch('')}\n                aria-label={tr('vibecontrols.plugins.clearSearch', 'Clear search')}\n                className=\"absolute right-3 top-1/2 -translate-y-1/2 p-0.5 rounded hover:bg-bg-elevated transition-colors\"\n              >\n                <X className=\"size-4 text-text-secondary\" />\n              </button>\n            )}\n          </div>\n\n          <div\n            className=\"flex flex-wrap gap-2\"\n            role=\"tablist\"\n            aria-label={tr('vibecontrols.plugins.categories', 'Plugin categories')}\n          >\n            {CATEGORY_OPTIONS.map((option) => {\n              const isActive = activeCategory === option.value;\n              return (\n                <button\n                  key={option.value}\n                  type=\"button\"\n                  role=\"tab\"\n                  aria-selected={isActive}\n                  onClick={() => setActiveCategory(option.value)}\n                  className={`px-3 py-1 text-xs rounded-full border transition-colors ${\n                    isActive\n                      ? 'bg-action-primary-bg text-action-primary-text border-action-primary-bg'\n                      : 'bg-bg-surface text-text-secondary border-border-default hover:bg-bg-sunken hover:text-text-primary'\n                  }`}\n                >\n                  {tr(option.labelKey, option.labelFallback)}\n                </button>\n              );\n            })}\n          </div>\n        </div>\n\n        {/* Grid body */}\n        <div className=\"flex-1 px-4 sm:px-6 py-4\">\n          {filteredPlugins.length === 0 ? (\n            <div className=\"flex flex-col items-center justify-center text-center py-16 text-text-secondary\">\n              <Package className=\"size-12 mb-3 opacity-50\" />\n              <p className=\"text-sm font-medium text-text-primary\">\n                {tr('vibecontrols.plugins.empty.title', 'No matching plugins')}\n              </p>\n              <p className=\"text-xs mt-1\">\n                {tr(\n                  'vibecontrols.plugins.empty.description',\n                  'Try a different search term or category.'\n                )}\n              </p>\n            </div>\n          ) : (\n            <div className=\"grid gap-3 grid-cols-1 sm:grid-cols-2 xl:grid-cols-3\">\n              {filteredPlugins.map((plugin) => (\n                <PluginCard key={plugin.packageName} plugin={plugin} />\n              ))}\n            </div>\n          )}\n        </div>\n      </MotionPage>\n    </PageContainer>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"PluginsCatalogPage.js","names":[],"sources":["../../src/pages/PluginsCatalogPage.tsx"],"sourcesContent":["import { useMemo, useState, useCallback } from 'react';\nimport { Check, ChevronDown, Copy, Package, Plug, Search, X } from 'lucide-react';\nimport { MotionPage } from '@burdenoff/fe-libs/shared/motion';\nimport { PageContainer, Card } from '@burdenoff/fe-libs/ui';\nimport { PLUGIN_CATALOG, type PluginMeta } from '@/constants/pluginCatalog';\nimport { useTr } from '@/shared/hooks/useTr';\n\ntype PluginType = 'Meta' | 'Provider' | 'Plugin';\n\ninterface CategoryOption {\n  value: string;\n  labelKey: string;\n  labelFallback: string;\n}\n\nconst CATEGORY_OPTIONS: CategoryOption[] = [\n  { value: 'all', labelKey: 'vibecontrols.plugins.category.all', labelFallback: 'All' },\n  { value: 'ai-core', labelKey: 'vibecontrols.plugins.category.aiCore', labelFallback: 'AI Core' },\n  {\n    value: 'ai-provider',\n    labelKey: 'vibecontrols.plugins.category.aiProvider',\n    labelFallback: 'AI Providers',\n  },\n  {\n    value: 'plan-core',\n    labelKey: 'vibecontrols.plugins.category.planCore',\n    labelFallback: 'Plan Core',\n  },\n  {\n    value: 'plan-provider',\n    labelKey: 'vibecontrols.plugins.category.planProvider',\n    labelFallback: 'Plan Providers',\n  },\n  {\n    value: 'session-core',\n    labelKey: 'vibecontrols.plugins.category.sessionCore',\n    labelFallback: 'Session Core',\n  },\n  {\n    value: 'session-provider',\n    labelKey: 'vibecontrols.plugins.category.sessionProvider',\n    labelFallback: 'Session Providers',\n  },\n  { value: 'tunnel', labelKey: 'vibecontrols.plugins.category.tunnel', labelFallback: 'Tunnel' },\n  { value: 'vcs', labelKey: 'vibecontrols.plugins.category.vcs', labelFallback: 'VCS' },\n  {\n    value: 'api-playground',\n    labelKey: 'vibecontrols.plugins.category.apiPlayground',\n    labelFallback: 'API Playground',\n  },\n  {\n    value: 'gitops-core',\n    labelKey: 'vibecontrols.plugins.category.gitopsCore',\n    labelFallback: 'GitOps Core',\n  },\n  {\n    value: 'gitops-provider',\n    labelKey: 'vibecontrols.plugins.category.gitopsProvider',\n    labelFallback: 'GitOps Providers',\n  },\n  {\n    value: 'security-core',\n    labelKey: 'vibecontrols.plugins.category.securityCore',\n    labelFallback: 'Security Core',\n  },\n  {\n    value: 'security-provider',\n    labelKey: 'vibecontrols.plugins.category.securityProvider',\n    labelFallback: 'Security Providers',\n  },\n  { value: 'tool', labelKey: 'vibecontrols.plugins.category.tool', labelFallback: 'Tools' },\n];\n\nfunction derivePluginType(category: PluginMeta['category']): PluginType {\n  if (category.endsWith('-core')) return 'Meta';\n  if (category.endsWith('-provider')) return 'Provider';\n  return 'Plugin';\n}\n\nfunction typeBadgeClasses(type: PluginType): string {\n  switch (type) {\n    case 'Meta':\n      return 'bg-accent-purple-subtle text-accent-purple border-accent-purple/30';\n    case 'Provider':\n      return 'bg-status-info-bg text-status-info-text border-status-info-border';\n    default:\n      return 'bg-bg-sunken text-text-secondary border-border-default';\n  }\n}\n\ninterface CopyButtonProps {\n  text: string;\n  ariaLabel: string;\n}\n\nfunction CopyButton({ text, ariaLabel }: CopyButtonProps) {\n  const [copied, setCopied] = useState(false);\n  const handleCopy = useCallback(async () => {\n    try {\n      if (typeof navigator !== 'undefined' && navigator.clipboard) {\n        await navigator.clipboard.writeText(text);\n      }\n      setCopied(true);\n      window.setTimeout(() => setCopied(false), 1500);\n    } catch {\n      setCopied(false);\n    }\n  }, [text]);\n\n  return (\n    <button\n      type=\"button\"\n      onClick={handleCopy}\n      aria-label={ariaLabel}\n      className=\"inline-flex items-center justify-center size-7 rounded border border-border-default bg-bg-surface text-text-secondary hover:text-text-primary hover:bg-bg-elevated transition-colors flex-shrink-0\"\n    >\n      {copied ? <Check className=\"size-3.5\" /> : <Copy className=\"size-3.5\" />}\n    </button>\n  );\n}\n\ninterface PluginCardProps {\n  plugin: PluginMeta;\n}\n\nfunction PluginCard({ plugin }: PluginCardProps) {\n  const tr = useTr();\n  const type = derivePluginType(plugin.category);\n  const installCommand = `npm install ${plugin.packageName}`;\n  const usageSnippet = `import plugin from '${plugin.packageName}';`;\n\n  const [showUsage, setShowUsage] = useState(false);\n  const [showCommands, setShowCommands] = useState(false);\n\n  return (\n    <Card className=\"flex flex-col h-full p-0 bg-bg-surface border-border-default\">\n      <div className=\"flex flex-col gap-3 p-4\">\n        <div className=\"flex items-start justify-between gap-3\">\n          <div className=\"min-w-0 flex-1\">\n            <h3 className=\"text-base font-semibold text-text-primary truncate\">\n              {plugin.displayName}\n            </h3>\n            <p className=\"text-xs text-text-secondary font-mono truncate mt-1\">\n              {plugin.packageName}\n            </p>\n          </div>\n          <span\n            className={`inline-flex items-center gap-1 px-2 py-0.5 text-[10px] uppercase tracking-wide font-semibold rounded-full border ${typeBadgeClasses(type)} flex-shrink-0`}\n          >\n            {type}\n          </span>\n        </div>\n\n        <p className=\"text-sm text-text-secondary leading-snug\">{plugin.description}</p>\n\n        <div className=\"mt-1 space-y-1.5\">\n          <p className=\"text-[11px] font-medium uppercase tracking-wide text-text-secondary\">\n            {tr('vibecontrols.plugins.install', 'Install')}\n          </p>\n          <div className=\"flex items-center gap-2 rounded-md border border-border-default bg-bg-sunken px-2.5 py-1.5\">\n            <code className=\"flex-1 text-xs font-mono text-text-primary truncate\">\n              {installCommand}\n            </code>\n            <CopyButton\n              text={installCommand}\n              ariaLabel={tr(\n                'vibecontrols.plugins.copyInstall',\n                'Copy install command for {{name}}',\n                {\n                  name: plugin.displayName,\n                }\n              )}\n            />\n          </div>\n        </div>\n\n        <div className=\"space-y-2\">\n          <button\n            type=\"button\"\n            onClick={() => setShowUsage((value) => !value)}\n            className=\"w-full flex items-center justify-between gap-2 text-left text-xs font-medium text-text-secondary hover:text-text-primary transition-colors\"\n            aria-expanded={showUsage}\n          >\n            <span>{tr('vibecontrols.plugins.usage', 'Usage')}</span>\n            <ChevronDown\n              className={`size-3.5 transition-transform ${showUsage ? 'rotate-180' : ''}`}\n            />\n          </button>\n          {showUsage && (\n            <div className=\"flex items-start gap-2 rounded-md border border-border-default bg-bg-sunken px-2.5 py-2\">\n              <code className=\"flex-1 text-xs font-mono text-text-primary whitespace-pre-wrap break-all\">\n                {usageSnippet}\n              </code>\n              <CopyButton\n                text={usageSnippet}\n                ariaLabel={tr('vibecontrols.plugins.copyUsage', 'Copy usage snippet for {{name}}', {\n                  name: plugin.displayName,\n                })}\n              />\n            </div>\n          )}\n        </div>\n\n        <div className=\"space-y-2\">\n          <button\n            type=\"button\"\n            onClick={() => setShowCommands((value) => !value)}\n            className=\"w-full flex items-center justify-between gap-2 text-left text-xs font-medium text-text-secondary hover:text-text-primary transition-colors\"\n            aria-expanded={showCommands}\n          >\n            <span>{tr('vibecontrols.plugins.commands', 'Command reference')}</span>\n            <ChevronDown\n              className={`size-3.5 transition-transform ${showCommands ? 'rotate-180' : ''}`}\n            />\n          </button>\n          {showCommands && (\n            <div className=\"rounded-md border border-border-default bg-bg-sunken px-2.5 py-2\">\n              <p className=\"text-xs text-text-secondary\">\n                {tr(\n                  'vibecontrols.plugins.commandsHint',\n                  'See the agent admin sub-panel or the plugin README for the documented command list.'\n                )}\n              </p>\n            </div>\n          )}\n        </div>\n      </div>\n    </Card>\n  );\n}\n\nexport function PluginsCatalogPage() {\n  const tr = useTr();\n  const [search, setSearch] = useState('');\n  const [activeCategory, setActiveCategory] = useState<string>('all');\n\n  const pluginList = useMemo(() => {\n    return Object.values(PLUGIN_CATALOG).sort((a, b) => a.displayName.localeCompare(b.displayName));\n  }, []);\n\n  const filteredPlugins = useMemo(() => {\n    const term = search.trim().toLowerCase();\n    return pluginList.filter((plugin) => {\n      if (activeCategory !== 'all' && plugin.category !== activeCategory) return false;\n      if (!term) return true;\n      const haystack =\n        `${plugin.displayName} ${plugin.description} ${plugin.packageName}`.toLowerCase();\n      return haystack.includes(term);\n    });\n  }, [pluginList, search, activeCategory]);\n\n  return (\n    <PageContainer padded={false}>\n      <MotionPage className=\"flex flex-col h-full\">\n        {/* Sticky header with search + filter chips */}\n        <div className=\"sticky top-0 z-10 border-b border-border-subtle bg-bg-surface px-6 lg:px-8 pt-5 pb-4 space-y-3\">\n          <div className=\"flex items-start gap-3\">\n            <div className=\"flex size-9 flex-shrink-0 items-center justify-center rounded-lg bg-[var(--color-accent-soft)]\">\n              <Plug className=\"size-5 text-action-primary-bg\" />\n            </div>\n            <div className=\"min-w-0 flex-1\">\n              <h1 className=\"text-2xl font-semibold tracking-tight text-text-primary\">\n                {tr('vibecontrols.plugins.title', 'Plugins')}\n              </h1>\n              <p className=\"text-sm text-text-secondary mt-0.5\">\n                {tr(\n                  'vibecontrols.plugins.description',\n                  'Browse and install plugins to extend your VibeControls agents.'\n                )}\n              </p>\n            </div>\n          </div>\n\n          <div className=\"relative\">\n            <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 size-4 text-text-secondary\" />\n            <input\n              type=\"search\"\n              value={search}\n              onChange={(event) => setSearch(event.target.value)}\n              placeholder={tr(\n                'vibecontrols.plugins.searchPlaceholder',\n                'Search by name, description, or package…'\n              )}\n              aria-label={tr('vibecontrols.plugins.searchLabel', 'Search plugins')}\n              className=\"w-full pl-10 pr-10 py-2 text-sm bg-bg-sunken border border-border-default rounded-md text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg focus:border-transparent transition-all\"\n            />\n            {search && (\n              <button\n                type=\"button\"\n                onClick={() => setSearch('')}\n                aria-label={tr('vibecontrols.plugins.clearSearch', 'Clear search')}\n                className=\"absolute right-3 top-1/2 -translate-y-1/2 p-0.5 rounded hover:bg-bg-elevated transition-colors\"\n              >\n                <X className=\"size-4 text-text-secondary\" />\n              </button>\n            )}\n          </div>\n\n          <div\n            className=\"flex flex-wrap gap-2\"\n            role=\"tablist\"\n            aria-label={tr('vibecontrols.plugins.categories', 'Plugin categories')}\n          >\n            {CATEGORY_OPTIONS.map((option) => {\n              const isActive = activeCategory === option.value;\n              return (\n                <button\n                  key={option.value}\n                  type=\"button\"\n                  role=\"tab\"\n                  aria-selected={isActive}\n                  onClick={() => setActiveCategory(option.value)}\n                  className={`px-3 py-1 text-xs rounded-full border transition-colors ${\n                    isActive\n                      ? 'bg-action-primary-bg text-action-primary-text border-action-primary-bg'\n                      : 'bg-bg-surface text-text-secondary border-border-default hover:bg-bg-sunken hover:text-text-primary'\n                  }`}\n                >\n                  {tr(option.labelKey, option.labelFallback)}\n                </button>\n              );\n            })}\n          </div>\n        </div>\n\n        {/* Grid body */}\n        <div className=\"flex-1 px-4 sm:px-6 py-4\">\n          {filteredPlugins.length === 0 ? (\n            <div className=\"flex flex-col items-center justify-center text-center py-16 text-text-secondary\">\n              <Package className=\"size-12 mb-3 opacity-50\" />\n              <p className=\"text-sm font-medium text-text-primary\">\n                {tr('vibecontrols.plugins.empty.title', 'No matching plugins')}\n              </p>\n              <p className=\"text-xs mt-1\">\n                {tr(\n                  'vibecontrols.plugins.empty.description',\n                  'Try a different search term or category.'\n                )}\n              </p>\n            </div>\n          ) : (\n            <div className=\"grid gap-3 grid-cols-1 sm:grid-cols-2 xl:grid-cols-3\">\n              {filteredPlugins.map((plugin) => (\n                <PluginCard key={plugin.packageName} plugin={plugin} />\n              ))}\n            </div>\n          )}\n        </div>\n      </MotionPage>\n    </PageContainer>\n  );\n}\n"],"mappings":";;;;;;;;AAeA,IAAM,IAAqC;CACzC;EAAE,OAAO;EAAO,UAAU;EAAqC,eAAe;EAAO;CACrF;EAAE,OAAO;EAAW,UAAU;EAAwC,eAAe;EAAW;CAChG;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EAAE,OAAO;EAAU,UAAU;EAAwC,eAAe;EAAU;CAC9F;EAAE,OAAO;EAAO,UAAU;EAAqC,eAAe;EAAO;CACrF;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EACE,OAAO;EACP,UAAU;EACV,eAAe;EAChB;CACD;EAAE,OAAO;EAAQ,UAAU;EAAsC,eAAe;EAAS;CAC1F;AAED,SAAS,EAAiB,GAA8C;AAGtE,QAFI,EAAS,SAAS,QAAQ,GAAS,SACnC,EAAS,SAAS,YAAY,GAAS,aACpC;;AAGT,SAAS,EAAiB,GAA0B;AAClD,SAAQ,GAAR;EACE,KAAK,OACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,QACE,QAAO;;;AASb,SAAS,EAAW,EAAE,SAAM,gBAA8B;CACxD,IAAM,CAAC,GAAQ,KAAa,EAAS,GAAM;AAa3C,QACE,kBAAC,UAAD;EACE,MAAK;EACL,SAfe,EAAY,YAAY;AACzC,OAAI;AAKF,IAJI,OAAO,YAAc,OAAe,UAAU,aAChD,MAAM,UAAU,UAAU,UAAU,EAAK,EAE3C,EAAU,GAAK,EACf,OAAO,iBAAiB,EAAU,GAAM,EAAE,KAAK;WACzC;AACN,MAAU,GAAM;;KAEjB,CAAC,EAAK,CAAC;EAMN,cAAY;EACZ,WAAU;YAEA,EAAT,IAAU,IAAiC,GAAlC,EAAO,WAAU,YAAa,CAAgC;EACjE,CAAA;;AAQb,SAAS,EAAW,EAAE,aAA2B;CAC/C,IAAM,IAAK,GAAO,EACZ,IAAO,EAAiB,EAAO,SAAS,EACxC,IAAiB,eAAe,EAAO,eACvC,IAAe,uBAAuB,EAAO,YAAY,KAEzD,CAAC,GAAW,KAAgB,EAAS,GAAM,EAC3C,CAAC,GAAc,KAAmB,EAAS,GAAM;AAEvD,QACE,kBAAC,GAAD;EAAM,WAAU;YACd,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,MAAD;OAAI,WAAU;iBACX,EAAO;OACL,CAAA,EACL,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAO;OACN,CAAA,CACA;SACN,kBAAC,QAAD;MACE,WAAW,oHAAoH,EAAiB,EAAK,CAAC;gBAErJ;MACI,CAAA,CACH;;IAEN,kBAAC,KAAD;KAAG,WAAU;eAA4C,EAAO;KAAgB,CAAA;IAEhF,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBACV,EAAG,gCAAgC,UAAU;MAC5C,CAAA,EACJ,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,QAAD;OAAM,WAAU;iBACb;OACI,CAAA,EACP,kBAAC,GAAD;OACE,MAAM;OACN,WAAW,EACT,oCACA,qCACA,EACE,MAAM,EAAO,aACd,CACF;OACD,CAAA,CACE;QACF;;IAEN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,UAAD;MACE,MAAK;MACL,eAAe,GAAc,MAAU,CAAC,EAAM;MAC9C,WAAU;MACV,iBAAe;gBAJjB,CAME,kBAAC,QAAD,EAAA,UAAO,EAAG,8BAA8B,QAAQ,EAAQ,CAAA,EACxD,kBAAC,GAAD,EACE,WAAW,iCAAiC,IAAY,eAAe,MACvE,CAAA,CACK;SACR,KACC,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,QAAD;OAAM,WAAU;iBACb;OACI,CAAA,EACP,kBAAC,GAAD;OACE,MAAM;OACN,WAAW,EAAG,kCAAkC,mCAAmC,EACjF,MAAM,EAAO,aACd,CAAC;OACF,CAAA,CACE;QAEJ;;IAEN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,UAAD;MACE,MAAK;MACL,eAAe,GAAiB,MAAU,CAAC,EAAM;MACjD,WAAU;MACV,iBAAe;gBAJjB,CAME,kBAAC,QAAD,EAAA,UAAO,EAAG,iCAAiC,oBAAoB,EAAQ,CAAA,EACvE,kBAAC,GAAD,EACE,WAAW,iCAAiC,IAAe,eAAe,MAC1E,CAAA,CACK;SACR,KACC,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,KAAD;OAAG,WAAU;iBACV,EACC,qCACA,sFACD;OACC,CAAA;MACA,CAAA,CAEJ;;IACF;;EACD,CAAA;;AAIX,SAAgB,IAAqB;CACnC,IAAM,IAAK,GAAO,EACZ,CAAC,GAAQ,KAAa,EAAS,GAAG,EAClC,CAAC,GAAgB,KAAqB,EAAiB,MAAM,EAE7D,IAAa,QACV,OAAO,OAAO,EAAe,CAAC,MAAM,GAAG,MAAM,EAAE,YAAY,cAAc,EAAE,YAAY,CAAC,EAC9F,EAAE,CAAC,EAEA,IAAkB,QAAc;EACpC,IAAM,IAAO,EAAO,MAAM,CAAC,aAAa;AACxC,SAAO,EAAW,QAAQ,MACpB,MAAmB,SAAS,EAAO,aAAa,IAAuB,KACtE,IAEH,GAAG,EAAO,YAAY,GAAG,EAAO,YAAY,GAAG,EAAO,cAAc,aAAa,CACnE,SAAS,EAAK,GAHZ,GAIlB;IACD;EAAC;EAAY;EAAQ;EAAe,CAAC;AAExC,QACE,kBAAC,GAAD;EAAe,QAAQ;YACrB,kBAAC,GAAD;GAAY,WAAU;aAAtB,CAEE,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,GAAD,EAAM,WAAU,iCAAkC,CAAA;OAC9C,CAAA,EACN,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,MAAD;QAAI,WAAU;kBACX,EAAG,8BAA8B,UAAU;QACzC,CAAA,EACL,kBAAC,KAAD;QAAG,WAAU;kBACV,EACC,oCACA,iEACD;QACC,CAAA,CACA;SACF;;KAEN,kBAAC,OAAD;MAAK,WAAU;gBAAf;OACE,kBAAC,GAAD,EAAQ,WAAU,uEAAwE,CAAA;OAC1F,kBAAC,SAAD;QACE,MAAK;QACL,OAAO;QACP,WAAW,MAAU,EAAU,EAAM,OAAO,MAAM;QAClD,aAAa,EACX,0CACA,2CACD;QACD,cAAY,EAAG,oCAAoC,iBAAiB;QACpE,WAAU;QACV,CAAA;OACD,KACC,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAU,GAAG;QAC5B,cAAY,EAAG,oCAAoC,eAAe;QAClE,WAAU;kBAEV,kBAAC,GAAD,EAAG,WAAU,8BAA+B,CAAA;QACrC,CAAA;OAEP;;KAEN,kBAAC,OAAD;MACE,WAAU;MACV,MAAK;MACL,cAAY,EAAG,mCAAmC,oBAAoB;gBAErE,EAAiB,KAAK,MAAW;OAChC,IAAM,IAAW,MAAmB,EAAO;AAC3C,cACE,kBAAC,UAAD;QAEE,MAAK;QACL,MAAK;QACL,iBAAe;QACf,eAAe,EAAkB,EAAO,MAAM;QAC9C,WAAW,2DACT,IACI,2EACA;kBAGL,EAAG,EAAO,UAAU,EAAO,cAAc;QACnC,EAZF,EAAO,MAYL;QAEX;MACE,CAAA;KACF;OAGN,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAgB,WAAW,IAC1B,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,GAAD,EAAS,WAAU,2BAA4B,CAAA;MAC/C,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAG,oCAAoC,sBAAsB;OAC5D,CAAA;MACJ,kBAAC,KAAD;OAAG,WAAU;iBACV,EACC,0CACA,2CACD;OACC,CAAA;MACA;SAEN,kBAAC,OAAD;KAAK,WAAU;eACZ,EAAgB,KAAK,MACpB,kBAAC,GAAD,EAA6C,WAAU,EAAtC,EAAO,YAA+B,CACvD;KACE,CAAA;IAEJ,CAAA,CACK;;EACC,CAAA"}

package/dist/pages/ScheduledJobDetailPage.js

@@ -138,7 +138,7 @@ function S() {
 			/* @__PURE__ */ _("button", {
 				type: "button",
 				onClick: Q,
-				className: "mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-secondary transition-colors",
+				className: "mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-sunken transition-colors",
 				children: C("common.back", "Back")
 			})
 		]
@@ -167,7 +167,7 @@ function S() {
 			/* @__PURE__ */ _("button", {
 				type: "button",
 				onClick: Q,
-				className: "mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-secondary transition-colors",
+				className: "mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-sunken transition-colors",
 				children: C("common.back", "Back")
 			})
 		]
@@ -182,7 +182,7 @@ function S() {
 					/* @__PURE__ */ _("button", {
 						type: "button",
 						onClick: Q,
-						className: "p-1.5 rounded hover:bg-bg-secondary transition-colors w-fit",
+						className: "p-1.5 rounded hover:bg-bg-sunken transition-colors w-fit",
 						"aria-label": C("common.back", "Back"),
 						children: /* @__PURE__ */ _(ee, { size: 18 })
 					}),
@@ -209,7 +209,7 @@ function S() {
 							type: "button",
 							onClick: ue,
 							disabled: le,
-							className: "flex items-center gap-1.5 px-3 py-1.5 text-sm bg-status-success-bg/10 text-status-success-text border border-status-success-border/30 rounded-lg hover:bg-status-success-bg/20 transition-colors disabled:opacity-50",
+							className: "flex items-center gap-1.5 px-3 py-1.5 text-sm bg-status-success-bg-subtle text-status-success-text border border-status-success-border rounded-button hover:bg-bg-sunken transition-colors disabled:opacity-50",
 							children: [/* @__PURE__ */ _(ne, { size: 14 }), C("scheduledJob.detail.executeNow", "Execute Now")]
 						})
 					})
@@ -217,7 +217,7 @@ function S() {
 			}),
 			L && /* @__PURE__ */ v("div", {
 				role: "alert",
-				className: "flex items-start gap-2 rounded-lg border border-status-error-border/30 bg-status-error-bg/10 px-3 py-2 text-sm text-status-error-text",
+				className: "flex items-start gap-2 rounded-lg border border-status-error-border bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text",
 				children: [
 					/* @__PURE__ */ _(f, {
 						size: 16,
@@ -230,7 +230,7 @@ function S() {
 					/* @__PURE__ */ _("button", {
 						type: "button",
 						onClick: () => R(null),
-						className: "p-0.5 rounded hover:bg-status-error-bg/20 transition-colors",
+						className: "p-0.5 rounded hover:bg-bg-sunken transition-colors",
 						"aria-label": C("common.dismiss", "Dismiss"),
 						children: /* @__PURE__ */ _(m, { size: 14 })
 					})
@@ -391,7 +391,7 @@ function S() {
 								M && /* @__PURE__ */ _("button", {
 									type: "button",
 									onClick: () => de(e),
-									className: "p-1 rounded hover:bg-bg-secondary transition-colors flex-shrink-0",
+									className: "p-1 rounded hover:bg-bg-sunken transition-colors flex-shrink-0",
 									"aria-label": C("scheduledJob.detail.viewLogs", "View logs"),
 									title: C("scheduledJob.detail.viewLogs", "View logs"),
 									children: /* @__PURE__ */ _(te, { size: 14 })

package/dist/pages/ScheduledJobDetailPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScheduledJobDetailPage.js","names":[],"sources":["../../src/pages/ScheduledJobDetailPage.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport { useParams, useNavigate, useSearchParams } from 'react-router-dom';\nimport { useTenantContext } from '@/hooks/useTenantContext';\nimport { useVibeNavigate } from '@/providers/VibeControlsProvider';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { ArrowLeft, Play, Loader2, Eye, AlertCircle, X } from 'lucide-react';\nimport { MotionPage, MotionList, MotionItem } from '@burdenoff/fe-libs/shared/motion';\nimport { LogsDrawer } from '../components/vibecalendar/LogsDrawer';\nimport { STATUS_COLORS } from '../components/vibecalendar/types';\nimport type { VibeCalendarExecution } from '../components/vibecalendar/types';\nimport { VIBE_PERMISSIONS } from '../constants/permissions';\nimport {\n  useExecuteScheduledJobNowMutation,\n  useGetScheduledJobDetailQuery,\n} from '@/generated/wspace-operations';\n\n// INTERNAL_API jobs persist the worker envelope as\n// `{ statusCode, duration, responseData: { executeAction: { output,\n// exitCode, status, errorMessage } } }`. `adaptExecution` unwraps\n// that into the flat shape the LogsDrawer consumes.\ntype JobExecutionShape = {\n  id: string;\n  status?: string | null;\n  startedAt?: string | null;\n  completedAt?: string | null;\n  output?: unknown;\n  errorMessage?: string | null;\n  statusCode?: number | null;\n};\nfunction adaptExecution(\n  ex: JobExecutionShape,\n  canReadExecutionLogs: boolean\n): VibeCalendarExecution {\n  let stdout: string | null = null;\n  let exitCode: number | null = ex.statusCode ?? null;\n  // Nested action errors are the only failure signal on agent-exit\n  // failures (top-level `errorMessage` only fires for scheduler-side\n  // dispatch failures), so capture both and let the chain below\n  // prefer the top-level when present.\n  let nestedActionError: string | null = null;\n  if (typeof ex.output === 'string') {\n    stdout = ex.output;\n  } else if (ex.output && typeof ex.output === 'object') {\n    const envelope = ex.output as Record<string, unknown>;\n    const action = (envelope.responseData as Record<string, unknown> | undefined)?.executeAction as\n      | Record<string, unknown>\n      | undefined;\n    if (action && typeof action.output === 'string') {\n      stdout = action.output;\n    }\n    if (action && typeof action.exitCode === 'number') {\n      exitCode = action.exitCode;\n    }\n    if (action && typeof action.errorMessage === 'string' && action.errorMessage.length > 0) {\n      nestedActionError = action.errorMessage;\n    }\n    if (stdout === null) {\n      stdout = JSON.stringify(envelope, null, 2);\n    }\n  }\n  // `??` only falls back for null/undefined; an empty top-level\n  // string would otherwise mask a populated nested error.\n  const topErrorTrimmed =\n    typeof ex.errorMessage === 'string' && ex.errorMessage.trim().length > 0\n      ? ex.errorMessage\n      : null;\n  return {\n    id: ex.id,\n    taskId: '',\n    status: ex.status ?? 'UNKNOWN',\n    // Suppress raw envelope fields for callers without `log:read`.\n    output: canReadExecutionLogs ? stdout : null,\n    exitCode,\n    webhookStatusCode: null,\n    startedAt: ex.startedAt ?? null,\n    completedAt: ex.completedAt ?? null,\n    error: canReadExecutionLogs ? (topErrorTrimmed ?? nestedActionError ?? null) : null,\n  };\n}\n\n// In-product detail view for a wspace-scheduler-svc ScheduledJob.\n// Lives next to VibeTaskDetailPage but reads/executes through the\n// scheduler subgraph (different id space, different RBAC resource).\nexport function ScheduledJobDetailPage() {\n  const { t } = useI18n();\n  const tr = useCallback(\n    (key: string, fallback: string): string => {\n      const v = t(key);\n      return v === key ? fallback : v;\n    },\n    [t]\n  );\n  const { jobId } = useParams<{ jobId: string }>();\n  // Two navigators: `navigate(-1)` only goes through react-router's\n  // browser-history API (no basePath rewriting needed), but the\n  // absolute-path fallback has to thread the MFE basePath via\n  // `useVibeNavigate` so production mounts under `/vibecontrols`\n  // land on the right calendar route instead of a host 404.\n  const navigate = useNavigate();\n  const vibeNavigate = useVibeNavigate();\n  const [searchParams] = useSearchParams();\n  // Support deep-link flow: carries `?org=…&tenant=…` URL\n  // overrides into the Apollo auth-link headers for this page's\n  // query + mutation, so they reach the gateway even when the\n  // Apollo client's storage refs point at a different tenant.\n  const tenantContext = useTenantContext();\n\n  // Gateway enforces `schedule:read` on `scheduledJob(id)` and\n  // `schedule:execute` on `executeJobNow` — gate the UI on the\n  // matching strings so users aren't UI-locked out of server actions\n  // they hold or shown buttons that the server will deny.\n  const { hasPermission, isLoading: permissionsLoading, permissions } = usePermissions();\n  const canReadExecutionLogs = hasPermission(VIBE_PERMISSIONS.LOG_READ);\n  const canExecute = hasPermission(VIBE_PERMISSIONS.SCHEDULE_EXECUTE);\n  // Skip the network query for users without `schedule:read` so the\n  // raw envelope never reaches the browser. The dev/legacy fallback\n  // mirrors VibeTaskDetailPage's denial check (no permission strings\n  // declared = no enforcement).\n  const canFetchScheduledJob =\n    !permissionsLoading &&\n    (!permissions ||\n      (permissions.permissionStrings?.length ?? 0) === 0 ||\n      hasPermission(VIBE_PERMISSIONS.SCHEDULE_READ));\n\n  const [showLogsDrawer, setShowLogsDrawer] = useState(false);\n  const [selectedExecution, setSelectedExecution] = useState<VibeCalendarExecution | null>(null);\n  // Inline-banner state — the MFE has no toast provider, so Execute\n  // Now failures surface here.\n  const [executionError, setExecutionError] = useState<string | null>(null);\n  // `executing` flips false the moment `executeJobNow` returns, but\n  // the worker still takes 1–6 s to write the new row. Surface a\n  // subtle \"waiting for execution\" hint next to the executions list\n  // for the duration of the poll window so the user knows the\n  // system is still working.\n  const [polling, setPolling] = useState(false);\n  // Set when the 12 s cap fires without seeing a new row — gives\n  // the user a clear cue that the worker didn't land in the\n  // expected window without claiming the run actually failed\n  // (it may have completed; the row may surface on a manual refresh).\n  const [pollingTimedOut, setPollingTimedOut] = useState(false);\n\n  const { data, loading, error, refetch } = useGetScheduledJobDetailQuery({\n    variables: { id: jobId ?? '', canReadLogs: canReadExecutionLogs },\n    skip: !jobId || !canFetchScheduledJob,\n    fetchPolicy: 'cache-and-network',\n    context: tenantContext,\n  });\n  const [executeNow, { loading: executing }] = useExecuteScheduledJobNowMutation();\n\n  // Latest query result mirrored into a ref so handleExecuteNow can\n  // snapshot `executions.total` without taking `data` as a dep\n  // (which would re-mint the callback on every cache-and-network\n  // refetch and bust downstream memoization).\n  const dataRef = useRef(data);\n  dataRef.current = data;\n\n  // Poll interval owned by a ref + cleared on unmount AND on\n  // jobId change so a stale `before` snapshot from a prior job\n  // can't keep ticking on the new one's URL.\n  const pollIntervalRef = useRef<ReturnType<typeof setInterval> | null>(null);\n  useEffect(() => {\n    return () => {\n      if (pollIntervalRef.current) {\n        clearInterval(pollIntervalRef.current);\n        pollIntervalRef.current = null;\n      }\n    };\n  }, [jobId]);\n\n  // Mount tracking is split into its own effect (no deps) so\n  // jobId-change cleanup above doesn't flip the flag false on a\n  // still-mounted component. handleExecuteNow awaits a mutation\n  // before arming the interval, so it has to verify it's still\n  // mounted before starting one that the cleanup would otherwise\n  // miss (unmount mid-await with ref=null).\n  const mountedRef = useRef(true);\n  useEffect(() => {\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  const job = data?.scheduledJob;\n  const executions = job?.executions?.executions ?? [];\n\n  // Deep-link / new-tab fallback: when there's no prior history\n  // entry (user opened the URL directly), `navigate(-1)` is a no-op.\n  // Land them back on the calendar list via the basePath-aware\n  // shell navigator so production mounts under `/vibecontrols`\n  // resolve to the right route, not a host 404. Carry the current\n  // query string through so a `?org=…&tenant=…` deep-link doesn't\n  // lose its tenant context and snap the calendar back to the\n  // default/stored tenant.\n  const handleBack = useCallback(() => {\n    if (window.history.length > 1) {\n      navigate(-1);\n      return;\n    }\n    const search = searchParams.toString();\n    vibeNavigate(search ? `/calendar?${search}` : '/calendar');\n  }, [navigate, vibeNavigate, searchParams]);\n\n  const handleExecuteNow = useCallback(async () => {\n    if (!jobId) return;\n    // Clear any prior failure banner before we re-attempt — if the\n    // mutation phase below also fails its catch block will set a\n    // fresh message.\n    setExecutionError(null);\n\n    // `executeJobNow` returns once queued; the worker writes the\n    // new row 1–6 s later. Snapshot the total now and poll until it\n    // increases or the 12 s cap fires. dataRef instead of data so\n    // the callback stays referentially stable across refetches.\n    const before = dataRef.current?.scheduledJob?.executions?.total ?? 0;\n\n    // Mutation failure is the only error path the user must see.\n    // A later refetch failure must not surface as \"Execute failed\"\n    // because the job already ran server-side.\n    //\n    // VibeControlsProvider sets `errorPolicy: 'all'`, so RBAC /\n    // GraphQL errors resolve into `result.error` (ApolloError)\n    // instead of throwing. Inspect both paths or denials silently\n    // kick off the poll cycle for a job that never ran.\n    const fallbackMsg = tr(\n      'scheduledJob.detail.executeFailedFallback',\n      'Failed to execute job. Try again or contact support.'\n    );\n    try {\n      const result = await executeNow({\n        variables: { id: jobId, canReadLogs: canReadExecutionLogs },\n        context: tenantContext,\n      });\n      if (result.error) {\n        console.error('executeJobNow returned an Apollo error:', result.error);\n        setExecutionError(result.error.message || fallbackMsg);\n        return;\n      }\n    } catch (err) {\n      console.error('Failed to execute job:', err);\n      const msg = err instanceof Error && err.message ? err.message : fallbackMsg;\n      setExecutionError(msg);\n      return;\n    }\n\n    // Bail before any state writes if the component unmounted\n    // mid-await — without this we'd arm a new setInterval that the\n    // effect cleanup already missed (cleanup ran with ref=null).\n    if (!mountedRef.current) return;\n\n    try {\n      await refetch();\n    } catch (err) {\n      console.error('Post-execute refetch failed (mutation already succeeded):', err);\n    }\n\n    if (!mountedRef.current) return;\n\n    // Latest click owns the polling window — drop any prior cycle.\n    if (pollIntervalRef.current) {\n      clearInterval(pollIntervalRef.current);\n      pollIntervalRef.current = null;\n    }\n    setPollingTimedOut(false);\n    setPolling(true);\n    let attempts = 0;\n    // Locals (not the shared ref) own this cycle's bookkeeping so a\n    // stale promise from a prior cycle can't cancel this interval\n    // or its in-flight flag. `inFlight` skips ticks that arrive\n    // before the previous refetch has resolved — a slow gateway\n    // (cold start, GC pause) shouldn't pile up concurrent requests\n    // against the same Apollo cache key.\n    let inFlight = false;\n    const intervalId = setInterval(() => {\n      if (inFlight) return;\n      if (attempts >= 12) {\n        if (pollIntervalRef.current === intervalId) {\n          clearInterval(intervalId);\n          pollIntervalRef.current = null;\n          if (mountedRef.current) {\n            setPolling(false);\n            setPollingTimedOut(true);\n          }\n        }\n        return;\n      }\n      attempts += 1;\n      inFlight = true;\n      void refetch()\n        .then((r) => {\n          const now = r.data?.scheduledJob?.executions?.total ?? before;\n          if (now > before) {\n            if (pollIntervalRef.current === intervalId) {\n              clearInterval(intervalId);\n              pollIntervalRef.current = null;\n              if (mountedRef.current) setPolling(false);\n            }\n          }\n        })\n        .catch(() => {\n          // Cap is enforced on the next tick.\n        })\n        .finally(() => {\n          inFlight = false;\n        });\n    }, 1000);\n    pollIntervalRef.current = intervalId;\n  }, [jobId, executeNow, refetch, canReadExecutionLogs, tenantContext, tr]);\n\n  const handleViewExecution = useCallback(\n    (ex: JobExecutionShape) => {\n      setSelectedExecution(adaptExecution(ex, canReadExecutionLogs));\n      setShowLogsDrawer(true);\n    },\n    [canReadExecutionLogs]\n  );\n\n  // Wait for the permissions provider to settle so we don't flash\n  // an access-denied screen for users who actually hold the\n  // permission (race: query resolves before permissions do).\n  if (permissionsLoading) {\n    return (\n      <MotionPage className=\"flex items-center justify-center h-full p-6\">\n        <p className=\"text-sm text-text-secondary\">\n          {tr('scheduledJob.detail.loadingPermissions', 'Loading permissions…')}\n        </p>\n      </MotionPage>\n    );\n  }\n  // Deep-link / bookmark deny — the calendar route gate only\n  // protects the page mount, not this specific resource read.\n  if (\n    permissions &&\n    (permissions.permissionStrings?.length ?? 0) > 0 &&\n    !hasPermission(VIBE_PERMISSIONS.SCHEDULE_READ)\n  ) {\n    return (\n      <MotionPage className=\"flex flex-col items-center justify-center h-full p-6 gap-3\">\n        <h2 className=\"text-base font-semibold text-text-primary\">\n          {tr('scheduledJob.detail.accessDenied', 'Access Denied')}\n        </h2>\n        <p className=\"text-sm text-text-secondary text-center max-w-md\">\n          {tr(\n            'scheduledJob.detail.accessDeniedHint',\n            'You do not have permission to view scheduled-job details. Contact your workspace owner if you believe you should.'\n          )}\n        </p>\n        <button\n          type=\"button\"\n          onClick={handleBack}\n          className=\"mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-secondary transition-colors\"\n        >\n          {tr('common.back', 'Back')}\n        </button>\n      </MotionPage>\n    );\n  }\n\n  // ----- loading / error / not-found states -----\n  if (loading && !job) {\n    return (\n      <MotionPage className=\"flex items-center justify-center h-full p-6\">\n        <Loader2 size={20} className=\"animate-spin text-text-tertiary\" />\n        <p className=\"ml-2 text-sm text-text-secondary\">\n          {tr('scheduledJob.detail.loading', 'Loading job…')}\n        </p>\n      </MotionPage>\n    );\n  }\n  // `cache-and-network` keeps `job` populated from cache while a\n  // background refetch is in flight; a transient network error\n  // during that refetch sets `error` without nulling `data`, so\n  // dropping to the not-found state on `error` alone would discard\n  // a perfectly usable cached view. Only treat the page as\n  // not-found when there's actually no data to render.\n  if (!job && !loading) {\n    return (\n      <MotionPage className=\"flex flex-col items-center justify-center h-full p-6 gap-3\">\n        <p className=\"text-base font-semibold text-text-primary\">\n          {tr('scheduledJob.detail.notFound', 'Job not found')}\n        </p>\n        <p className=\"text-sm text-text-secondary text-center max-w-md\">\n          {tr(\n            'scheduledJob.detail.notFoundHint',\n            'It may have been deleted, archived, or moved to a workspace you no longer have access to.'\n          )}\n        </p>\n        <button\n          type=\"button\"\n          onClick={handleBack}\n          className=\"mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-secondary transition-colors\"\n        >\n          {tr('common.back', 'Back')}\n        </button>\n      </MotionPage>\n    );\n  }\n\n  const statusColor = STATUS_COLORS[job.status] || STATUS_COLORS.PENDING;\n  const fmtTime = (iso?: string | null) =>\n    iso ? new Date(iso).toLocaleString() : tr('common.notAvailable', 'Not available');\n\n  return (\n    <MotionPage className=\"flex flex-col h-full p-4 gap-6\">\n      {/* Header */}\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center\">\n        <button\n          type=\"button\"\n          onClick={handleBack}\n          className=\"p-1.5 rounded hover:bg-bg-secondary transition-colors w-fit\"\n          aria-label={tr('common.back', 'Back')}\n        >\n          <ArrowLeft size={18} />\n        </button>\n        <div className=\"flex-1 min-w-0\">\n          <div className=\"flex items-center gap-2 flex-wrap\">\n            <h1 className=\"text-xl font-bold text-text-primary truncate\">\n              {job.name || tr('scheduledJob.detail.untitled', 'Untitled job')}\n            </h1>\n            <span\n              className={`px-2 py-0.5 text-xs font-medium rounded border ${statusColor}`}\n              aria-label={`Status ${job.status}`}\n            >\n              {job.status}\n            </span>\n          </div>\n          {job.description && (\n            <p className=\"text-sm text-text-secondary mt-1 line-clamp-2\">{job.description}</p>\n          )}\n        </div>\n        <div className=\"flex w-full flex-wrap items-center gap-2 sm:w-auto sm:justify-end\">\n          {canExecute && (\n            <button\n              type=\"button\"\n              onClick={handleExecuteNow}\n              disabled={executing}\n              className=\"flex items-center gap-1.5 px-3 py-1.5 text-sm bg-status-success-bg/10 text-status-success-text border border-status-success-border/30 rounded-lg hover:bg-status-success-bg/20 transition-colors disabled:opacity-50\"\n            >\n              <Play size={14} />\n              {tr('scheduledJob.detail.executeNow', 'Execute Now')}\n            </button>\n          )}\n        </div>\n      </div>\n\n      {executionError && (\n        <div\n          role=\"alert\"\n          className=\"flex items-start gap-2 rounded-lg border border-status-error-border/30 bg-status-error-bg/10 px-3 py-2 text-sm text-status-error-text\"\n        >\n          <AlertCircle size={16} className=\"mt-0.5 flex-shrink-0\" />\n          <p className=\"flex-1 break-words\">{executionError}</p>\n          <button\n            type=\"button\"\n            onClick={() => setExecutionError(null)}\n            className=\"p-0.5 rounded hover:bg-status-error-bg/20 transition-colors\"\n            aria-label={tr('common.dismiss', 'Dismiss')}\n          >\n            <X size={14} />\n          </button>\n        </div>\n      )}\n\n      {/* Info Cards */}\n      <MotionList stagger={0.04} className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3\">\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.scheduleType', 'Schedule Type')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">{job.scheduleType}</p>\n          {job.cronExpression && (\n            <p className=\"text-xs text-text-secondary font-mono mt-1 truncate\">\n              {job.cronExpression}\n            </p>\n          )}\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.timezone', 'Timezone')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">{job.timezone || 'UTC'}</p>\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.nextExecution', 'Next Execution')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">\n            {fmtTime(job.nextExecutionAt)}\n          </p>\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.lastExecution', 'Last Execution')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">\n            {fmtTime(job.lastExecutionAt)}\n          </p>\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.executor', 'Executor')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">\n            {job.executorType || tr('common.notAvailable', 'Not available')}\n          </p>\n          {job.actionId && (\n            <p className=\"text-xs text-text-secondary font-mono mt-1 truncate\">\n              {tr('scheduledJob.detail.action', 'Action')}: {job.actionId}\n            </p>\n          )}\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.priority', 'Priority')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">{job.priority}</p>\n        </MotionItem>\n      </MotionList>\n\n      {/* Executions List */}\n      <div className=\"flex flex-col gap-2 flex-1 min-h-0\">\n        <div className=\"flex items-center justify-between flex-wrap gap-2\">\n          <div className=\"flex items-center gap-2\">\n            <h2 className=\"text-sm font-semibold text-text-primary\">\n              {tr('scheduledJob.detail.executions', 'Executions')}\n            </h2>\n            {polling && (\n              <span className=\"flex items-center gap-1 text-xs text-text-tertiary\">\n                <Loader2 size={12} className=\"animate-spin\" />\n                {tr('scheduledJob.detail.waitingForExecution', 'Waiting for execution…')}\n              </span>\n            )}\n            {!polling && pollingTimedOut && (\n              <span className=\"text-xs text-text-tertiary\">\n                {tr(\n                  'scheduledJob.detail.pollingTimedOut',\n                  \"Didn't see a new execution yet — refresh to check again.\"\n                )}\n              </span>\n            )}\n          </div>\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.executionsCount', 'Total')}: {job.executions?.total ?? 0}\n          </p>\n        </div>\n        {executions.length === 0 ? (\n          <div className=\"flex items-center justify-center py-12 border border-border-default border-dashed rounded-lg\">\n            <p className=\"text-sm text-text-secondary\">\n              {tr('scheduledJob.detail.noExecutions', 'No executions yet')}\n            </p>\n          </div>\n        ) : (\n          <MotionList\n            stagger={0.02}\n            className=\"flex flex-col gap-2 overflow-auto pr-1 max-h-[60vh]\"\n          >\n            {executions.map((ex: JobExecutionShape) => {\n              // `??` keeps null/undefined out of the badge text.\n              const exStatus = ex.status ?? 'UNKNOWN';\n              const exColor = STATUS_COLORS[exStatus] || STATUS_COLORS.PENDING;\n              return (\n                <MotionItem\n                  key={ex.id}\n                  className=\"flex items-center gap-3 bg-bg-surface border border-border-default rounded-lg p-3\"\n                >\n                  <span\n                    className={`px-2 py-0.5 text-xs font-medium rounded border ${exColor} flex-shrink-0`}\n                  >\n                    {exStatus}\n                  </span>\n                  <div className=\"flex-1 min-w-0\">\n                    <p className=\"text-sm text-text-primary truncate\">{fmtTime(ex.startedAt)}</p>\n                    {ex.completedAt && (\n                      <p className=\"text-xs text-text-tertiary truncate\">\n                        {tr('scheduledJob.detail.completedAt', 'Completed')}:{' '}\n                        {fmtTime(ex.completedAt)}\n                      </p>\n                    )}\n                  </div>\n                  {ex.statusCode !== null && ex.statusCode !== undefined && (\n                    <span className=\"text-xs font-mono text-text-secondary flex-shrink-0\">\n                      {ex.statusCode}\n                    </span>\n                  )}\n                  {canReadExecutionLogs && (\n                    <button\n                      type=\"button\"\n                      onClick={() => handleViewExecution(ex)}\n                      className=\"p-1 rounded hover:bg-bg-secondary transition-colors flex-shrink-0\"\n                      aria-label={tr('scheduledJob.detail.viewLogs', 'View logs')}\n                      title={tr('scheduledJob.detail.viewLogs', 'View logs')}\n                    >\n                      <Eye size={14} />\n                    </button>\n                  )}\n                </MotionItem>\n              );\n            })}\n          </MotionList>\n        )}\n      </div>\n\n      {/* Per-execution Logs Drawer (reused) */}\n      <LogsDrawer\n        isOpen={showLogsDrawer}\n        onClose={() => setShowLogsDrawer(false)}\n        execution={selectedExecution}\n        taskTitle={job.name || tr('scheduledJob.detail.untitled', 'Untitled job')}\n        // ScheduledJob executions resolve the agent through the\n        // linked Action at run time, so there's no agentId to\n        // associate with the drawer view — LogsDrawer destructures\n        // this as `_agentId` and never reads it.\n        agentId=\"\"\n      />\n    </MotionPage>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ScheduledJobDetailPage.js","names":[],"sources":["../../src/pages/ScheduledJobDetailPage.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport { useParams, useNavigate, useSearchParams } from 'react-router-dom';\nimport { useTenantContext } from '@/hooks/useTenantContext';\nimport { useVibeNavigate } from '@/providers/VibeControlsProvider';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { ArrowLeft, Play, Loader2, Eye, AlertCircle, X } from 'lucide-react';\nimport { MotionPage, MotionList, MotionItem } from '@burdenoff/fe-libs/shared/motion';\nimport { LogsDrawer } from '../components/vibecalendar/LogsDrawer';\nimport { STATUS_COLORS } from '../components/vibecalendar/types';\nimport type { VibeCalendarExecution } from '../components/vibecalendar/types';\nimport { VIBE_PERMISSIONS } from '../constants/permissions';\nimport {\n  useExecuteScheduledJobNowMutation,\n  useGetScheduledJobDetailQuery,\n} from '@/generated/wspace-operations';\n\n// INTERNAL_API jobs persist the worker envelope as\n// `{ statusCode, duration, responseData: { executeAction: { output,\n// exitCode, status, errorMessage } } }`. `adaptExecution` unwraps\n// that into the flat shape the LogsDrawer consumes.\ntype JobExecutionShape = {\n  id: string;\n  status?: string | null;\n  startedAt?: string | null;\n  completedAt?: string | null;\n  output?: unknown;\n  errorMessage?: string | null;\n  statusCode?: number | null;\n};\nfunction adaptExecution(\n  ex: JobExecutionShape,\n  canReadExecutionLogs: boolean\n): VibeCalendarExecution {\n  let stdout: string | null = null;\n  let exitCode: number | null = ex.statusCode ?? null;\n  // Nested action errors are the only failure signal on agent-exit\n  // failures (top-level `errorMessage` only fires for scheduler-side\n  // dispatch failures), so capture both and let the chain below\n  // prefer the top-level when present.\n  let nestedActionError: string | null = null;\n  if (typeof ex.output === 'string') {\n    stdout = ex.output;\n  } else if (ex.output && typeof ex.output === 'object') {\n    const envelope = ex.output as Record<string, unknown>;\n    const action = (envelope.responseData as Record<string, unknown> | undefined)?.executeAction as\n      | Record<string, unknown>\n      | undefined;\n    if (action && typeof action.output === 'string') {\n      stdout = action.output;\n    }\n    if (action && typeof action.exitCode === 'number') {\n      exitCode = action.exitCode;\n    }\n    if (action && typeof action.errorMessage === 'string' && action.errorMessage.length > 0) {\n      nestedActionError = action.errorMessage;\n    }\n    if (stdout === null) {\n      stdout = JSON.stringify(envelope, null, 2);\n    }\n  }\n  // `??` only falls back for null/undefined; an empty top-level\n  // string would otherwise mask a populated nested error.\n  const topErrorTrimmed =\n    typeof ex.errorMessage === 'string' && ex.errorMessage.trim().length > 0\n      ? ex.errorMessage\n      : null;\n  return {\n    id: ex.id,\n    taskId: '',\n    status: ex.status ?? 'UNKNOWN',\n    // Suppress raw envelope fields for callers without `log:read`.\n    output: canReadExecutionLogs ? stdout : null,\n    exitCode,\n    webhookStatusCode: null,\n    startedAt: ex.startedAt ?? null,\n    completedAt: ex.completedAt ?? null,\n    error: canReadExecutionLogs ? (topErrorTrimmed ?? nestedActionError ?? null) : null,\n  };\n}\n\n// In-product detail view for a wspace-scheduler-svc ScheduledJob.\n// Lives next to VibeTaskDetailPage but reads/executes through the\n// scheduler subgraph (different id space, different RBAC resource).\nexport function ScheduledJobDetailPage() {\n  const { t } = useI18n();\n  const tr = useCallback(\n    (key: string, fallback: string): string => {\n      const v = t(key);\n      return v === key ? fallback : v;\n    },\n    [t]\n  );\n  const { jobId } = useParams<{ jobId: string }>();\n  // Two navigators: `navigate(-1)` only goes through react-router's\n  // browser-history API (no basePath rewriting needed), but the\n  // absolute-path fallback has to thread the MFE basePath via\n  // `useVibeNavigate` so production mounts under `/vibecontrols`\n  // land on the right calendar route instead of a host 404.\n  const navigate = useNavigate();\n  const vibeNavigate = useVibeNavigate();\n  const [searchParams] = useSearchParams();\n  // Support deep-link flow: carries `?org=…&tenant=…` URL\n  // overrides into the Apollo auth-link headers for this page's\n  // query + mutation, so they reach the gateway even when the\n  // Apollo client's storage refs point at a different tenant.\n  const tenantContext = useTenantContext();\n\n  // Gateway enforces `schedule:read` on `scheduledJob(id)` and\n  // `schedule:execute` on `executeJobNow` — gate the UI on the\n  // matching strings so users aren't UI-locked out of server actions\n  // they hold or shown buttons that the server will deny.\n  const { hasPermission, isLoading: permissionsLoading, permissions } = usePermissions();\n  const canReadExecutionLogs = hasPermission(VIBE_PERMISSIONS.LOG_READ);\n  const canExecute = hasPermission(VIBE_PERMISSIONS.SCHEDULE_EXECUTE);\n  // Skip the network query for users without `schedule:read` so the\n  // raw envelope never reaches the browser. The dev/legacy fallback\n  // mirrors VibeTaskDetailPage's denial check (no permission strings\n  // declared = no enforcement).\n  const canFetchScheduledJob =\n    !permissionsLoading &&\n    (!permissions ||\n      (permissions.permissionStrings?.length ?? 0) === 0 ||\n      hasPermission(VIBE_PERMISSIONS.SCHEDULE_READ));\n\n  const [showLogsDrawer, setShowLogsDrawer] = useState(false);\n  const [selectedExecution, setSelectedExecution] = useState<VibeCalendarExecution | null>(null);\n  // Inline-banner state — the MFE has no toast provider, so Execute\n  // Now failures surface here.\n  const [executionError, setExecutionError] = useState<string | null>(null);\n  // `executing` flips false the moment `executeJobNow` returns, but\n  // the worker still takes 1–6 s to write the new row. Surface a\n  // subtle \"waiting for execution\" hint next to the executions list\n  // for the duration of the poll window so the user knows the\n  // system is still working.\n  const [polling, setPolling] = useState(false);\n  // Set when the 12 s cap fires without seeing a new row — gives\n  // the user a clear cue that the worker didn't land in the\n  // expected window without claiming the run actually failed\n  // (it may have completed; the row may surface on a manual refresh).\n  const [pollingTimedOut, setPollingTimedOut] = useState(false);\n\n  const { data, loading, error, refetch } = useGetScheduledJobDetailQuery({\n    variables: { id: jobId ?? '', canReadLogs: canReadExecutionLogs },\n    skip: !jobId || !canFetchScheduledJob,\n    fetchPolicy: 'cache-and-network',\n    context: tenantContext,\n  });\n  const [executeNow, { loading: executing }] = useExecuteScheduledJobNowMutation();\n\n  // Latest query result mirrored into a ref so handleExecuteNow can\n  // snapshot `executions.total` without taking `data` as a dep\n  // (which would re-mint the callback on every cache-and-network\n  // refetch and bust downstream memoization).\n  const dataRef = useRef(data);\n  dataRef.current = data;\n\n  // Poll interval owned by a ref + cleared on unmount AND on\n  // jobId change so a stale `before` snapshot from a prior job\n  // can't keep ticking on the new one's URL.\n  const pollIntervalRef = useRef<ReturnType<typeof setInterval> | null>(null);\n  useEffect(() => {\n    return () => {\n      if (pollIntervalRef.current) {\n        clearInterval(pollIntervalRef.current);\n        pollIntervalRef.current = null;\n      }\n    };\n  }, [jobId]);\n\n  // Mount tracking is split into its own effect (no deps) so\n  // jobId-change cleanup above doesn't flip the flag false on a\n  // still-mounted component. handleExecuteNow awaits a mutation\n  // before arming the interval, so it has to verify it's still\n  // mounted before starting one that the cleanup would otherwise\n  // miss (unmount mid-await with ref=null).\n  const mountedRef = useRef(true);\n  useEffect(() => {\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  const job = data?.scheduledJob;\n  const executions = job?.executions?.executions ?? [];\n\n  // Deep-link / new-tab fallback: when there's no prior history\n  // entry (user opened the URL directly), `navigate(-1)` is a no-op.\n  // Land them back on the calendar list via the basePath-aware\n  // shell navigator so production mounts under `/vibecontrols`\n  // resolve to the right route, not a host 404. Carry the current\n  // query string through so a `?org=…&tenant=…` deep-link doesn't\n  // lose its tenant context and snap the calendar back to the\n  // default/stored tenant.\n  const handleBack = useCallback(() => {\n    if (window.history.length > 1) {\n      navigate(-1);\n      return;\n    }\n    const search = searchParams.toString();\n    vibeNavigate(search ? `/calendar?${search}` : '/calendar');\n  }, [navigate, vibeNavigate, searchParams]);\n\n  const handleExecuteNow = useCallback(async () => {\n    if (!jobId) return;\n    // Clear any prior failure banner before we re-attempt — if the\n    // mutation phase below also fails its catch block will set a\n    // fresh message.\n    setExecutionError(null);\n\n    // `executeJobNow` returns once queued; the worker writes the\n    // new row 1–6 s later. Snapshot the total now and poll until it\n    // increases or the 12 s cap fires. dataRef instead of data so\n    // the callback stays referentially stable across refetches.\n    const before = dataRef.current?.scheduledJob?.executions?.total ?? 0;\n\n    // Mutation failure is the only error path the user must see.\n    // A later refetch failure must not surface as \"Execute failed\"\n    // because the job already ran server-side.\n    //\n    // VibeControlsProvider sets `errorPolicy: 'all'`, so RBAC /\n    // GraphQL errors resolve into `result.error` (ApolloError)\n    // instead of throwing. Inspect both paths or denials silently\n    // kick off the poll cycle for a job that never ran.\n    const fallbackMsg = tr(\n      'scheduledJob.detail.executeFailedFallback',\n      'Failed to execute job. Try again or contact support.'\n    );\n    try {\n      const result = await executeNow({\n        variables: { id: jobId, canReadLogs: canReadExecutionLogs },\n        context: tenantContext,\n      });\n      if (result.error) {\n        console.error('executeJobNow returned an Apollo error:', result.error);\n        setExecutionError(result.error.message || fallbackMsg);\n        return;\n      }\n    } catch (err) {\n      console.error('Failed to execute job:', err);\n      const msg = err instanceof Error && err.message ? err.message : fallbackMsg;\n      setExecutionError(msg);\n      return;\n    }\n\n    // Bail before any state writes if the component unmounted\n    // mid-await — without this we'd arm a new setInterval that the\n    // effect cleanup already missed (cleanup ran with ref=null).\n    if (!mountedRef.current) return;\n\n    try {\n      await refetch();\n    } catch (err) {\n      console.error('Post-execute refetch failed (mutation already succeeded):', err);\n    }\n\n    if (!mountedRef.current) return;\n\n    // Latest click owns the polling window — drop any prior cycle.\n    if (pollIntervalRef.current) {\n      clearInterval(pollIntervalRef.current);\n      pollIntervalRef.current = null;\n    }\n    setPollingTimedOut(false);\n    setPolling(true);\n    let attempts = 0;\n    // Locals (not the shared ref) own this cycle's bookkeeping so a\n    // stale promise from a prior cycle can't cancel this interval\n    // or its in-flight flag. `inFlight` skips ticks that arrive\n    // before the previous refetch has resolved — a slow gateway\n    // (cold start, GC pause) shouldn't pile up concurrent requests\n    // against the same Apollo cache key.\n    let inFlight = false;\n    const intervalId = setInterval(() => {\n      if (inFlight) return;\n      if (attempts >= 12) {\n        if (pollIntervalRef.current === intervalId) {\n          clearInterval(intervalId);\n          pollIntervalRef.current = null;\n          if (mountedRef.current) {\n            setPolling(false);\n            setPollingTimedOut(true);\n          }\n        }\n        return;\n      }\n      attempts += 1;\n      inFlight = true;\n      void refetch()\n        .then((r) => {\n          const now = r.data?.scheduledJob?.executions?.total ?? before;\n          if (now > before) {\n            if (pollIntervalRef.current === intervalId) {\n              clearInterval(intervalId);\n              pollIntervalRef.current = null;\n              if (mountedRef.current) setPolling(false);\n            }\n          }\n        })\n        .catch(() => {\n          // Cap is enforced on the next tick.\n        })\n        .finally(() => {\n          inFlight = false;\n        });\n    }, 1000);\n    pollIntervalRef.current = intervalId;\n  }, [jobId, executeNow, refetch, canReadExecutionLogs, tenantContext, tr]);\n\n  const handleViewExecution = useCallback(\n    (ex: JobExecutionShape) => {\n      setSelectedExecution(adaptExecution(ex, canReadExecutionLogs));\n      setShowLogsDrawer(true);\n    },\n    [canReadExecutionLogs]\n  );\n\n  // Wait for the permissions provider to settle so we don't flash\n  // an access-denied screen for users who actually hold the\n  // permission (race: query resolves before permissions do).\n  if (permissionsLoading) {\n    return (\n      <MotionPage className=\"flex items-center justify-center h-full p-6\">\n        <p className=\"text-sm text-text-secondary\">\n          {tr('scheduledJob.detail.loadingPermissions', 'Loading permissions…')}\n        </p>\n      </MotionPage>\n    );\n  }\n  // Deep-link / bookmark deny — the calendar route gate only\n  // protects the page mount, not this specific resource read.\n  if (\n    permissions &&\n    (permissions.permissionStrings?.length ?? 0) > 0 &&\n    !hasPermission(VIBE_PERMISSIONS.SCHEDULE_READ)\n  ) {\n    return (\n      <MotionPage className=\"flex flex-col items-center justify-center h-full p-6 gap-3\">\n        <h2 className=\"text-base font-semibold text-text-primary\">\n          {tr('scheduledJob.detail.accessDenied', 'Access Denied')}\n        </h2>\n        <p className=\"text-sm text-text-secondary text-center max-w-md\">\n          {tr(\n            'scheduledJob.detail.accessDeniedHint',\n            'You do not have permission to view scheduled-job details. Contact your workspace owner if you believe you should.'\n          )}\n        </p>\n        <button\n          type=\"button\"\n          onClick={handleBack}\n          className=\"mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-sunken transition-colors\"\n        >\n          {tr('common.back', 'Back')}\n        </button>\n      </MotionPage>\n    );\n  }\n\n  // ----- loading / error / not-found states -----\n  if (loading && !job) {\n    return (\n      <MotionPage className=\"flex items-center justify-center h-full p-6\">\n        <Loader2 size={20} className=\"animate-spin text-text-tertiary\" />\n        <p className=\"ml-2 text-sm text-text-secondary\">\n          {tr('scheduledJob.detail.loading', 'Loading job…')}\n        </p>\n      </MotionPage>\n    );\n  }\n  // `cache-and-network` keeps `job` populated from cache while a\n  // background refetch is in flight; a transient network error\n  // during that refetch sets `error` without nulling `data`, so\n  // dropping to the not-found state on `error` alone would discard\n  // a perfectly usable cached view. Only treat the page as\n  // not-found when there's actually no data to render.\n  if (!job && !loading) {\n    return (\n      <MotionPage className=\"flex flex-col items-center justify-center h-full p-6 gap-3\">\n        <p className=\"text-base font-semibold text-text-primary\">\n          {tr('scheduledJob.detail.notFound', 'Job not found')}\n        </p>\n        <p className=\"text-sm text-text-secondary text-center max-w-md\">\n          {tr(\n            'scheduledJob.detail.notFoundHint',\n            'It may have been deleted, archived, or moved to a workspace you no longer have access to.'\n          )}\n        </p>\n        <button\n          type=\"button\"\n          onClick={handleBack}\n          className=\"mt-2 px-3 py-1.5 text-sm rounded-lg border border-border-default hover:bg-bg-sunken transition-colors\"\n        >\n          {tr('common.back', 'Back')}\n        </button>\n      </MotionPage>\n    );\n  }\n\n  const statusColor = STATUS_COLORS[job.status] || STATUS_COLORS.PENDING;\n  const fmtTime = (iso?: string | null) =>\n    iso ? new Date(iso).toLocaleString() : tr('common.notAvailable', 'Not available');\n\n  return (\n    <MotionPage className=\"flex flex-col h-full p-4 gap-6\">\n      {/* Header */}\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center\">\n        <button\n          type=\"button\"\n          onClick={handleBack}\n          className=\"p-1.5 rounded hover:bg-bg-sunken transition-colors w-fit\"\n          aria-label={tr('common.back', 'Back')}\n        >\n          <ArrowLeft size={18} />\n        </button>\n        <div className=\"flex-1 min-w-0\">\n          <div className=\"flex items-center gap-2 flex-wrap\">\n            <h1 className=\"text-xl font-bold text-text-primary truncate\">\n              {job.name || tr('scheduledJob.detail.untitled', 'Untitled job')}\n            </h1>\n            <span\n              className={`px-2 py-0.5 text-xs font-medium rounded border ${statusColor}`}\n              aria-label={`Status ${job.status}`}\n            >\n              {job.status}\n            </span>\n          </div>\n          {job.description && (\n            <p className=\"text-sm text-text-secondary mt-1 line-clamp-2\">{job.description}</p>\n          )}\n        </div>\n        <div className=\"flex w-full flex-wrap items-center gap-2 sm:w-auto sm:justify-end\">\n          {canExecute && (\n            <button\n              type=\"button\"\n              onClick={handleExecuteNow}\n              disabled={executing}\n              className=\"flex items-center gap-1.5 px-3 py-1.5 text-sm bg-status-success-bg-subtle text-status-success-text border border-status-success-border rounded-button hover:bg-bg-sunken transition-colors disabled:opacity-50\"\n            >\n              <Play size={14} />\n              {tr('scheduledJob.detail.executeNow', 'Execute Now')}\n            </button>\n          )}\n        </div>\n      </div>\n\n      {executionError && (\n        <div\n          role=\"alert\"\n          className=\"flex items-start gap-2 rounded-lg border border-status-error-border bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text\"\n        >\n          <AlertCircle size={16} className=\"mt-0.5 flex-shrink-0\" />\n          <p className=\"flex-1 break-words\">{executionError}</p>\n          <button\n            type=\"button\"\n            onClick={() => setExecutionError(null)}\n            className=\"p-0.5 rounded hover:bg-bg-sunken transition-colors\"\n            aria-label={tr('common.dismiss', 'Dismiss')}\n          >\n            <X size={14} />\n          </button>\n        </div>\n      )}\n\n      {/* Info Cards */}\n      <MotionList stagger={0.04} className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3\">\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.scheduleType', 'Schedule Type')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">{job.scheduleType}</p>\n          {job.cronExpression && (\n            <p className=\"text-xs text-text-secondary font-mono mt-1 truncate\">\n              {job.cronExpression}\n            </p>\n          )}\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.timezone', 'Timezone')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">{job.timezone || 'UTC'}</p>\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.nextExecution', 'Next Execution')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">\n            {fmtTime(job.nextExecutionAt)}\n          </p>\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.lastExecution', 'Last Execution')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">\n            {fmtTime(job.lastExecutionAt)}\n          </p>\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.executor', 'Executor')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">\n            {job.executorType || tr('common.notAvailable', 'Not available')}\n          </p>\n          {job.actionId && (\n            <p className=\"text-xs text-text-secondary font-mono mt-1 truncate\">\n              {tr('scheduledJob.detail.action', 'Action')}: {job.actionId}\n            </p>\n          )}\n        </MotionItem>\n        <MotionItem className=\"bg-bg-surface border border-border-default rounded-lg p-3\">\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.priority', 'Priority')}\n          </p>\n          <p className=\"text-sm font-medium text-text-primary mt-0.5\">{job.priority}</p>\n        </MotionItem>\n      </MotionList>\n\n      {/* Executions List */}\n      <div className=\"flex flex-col gap-2 flex-1 min-h-0\">\n        <div className=\"flex items-center justify-between flex-wrap gap-2\">\n          <div className=\"flex items-center gap-2\">\n            <h2 className=\"text-sm font-semibold text-text-primary\">\n              {tr('scheduledJob.detail.executions', 'Executions')}\n            </h2>\n            {polling && (\n              <span className=\"flex items-center gap-1 text-xs text-text-tertiary\">\n                <Loader2 size={12} className=\"animate-spin\" />\n                {tr('scheduledJob.detail.waitingForExecution', 'Waiting for execution…')}\n              </span>\n            )}\n            {!polling && pollingTimedOut && (\n              <span className=\"text-xs text-text-tertiary\">\n                {tr(\n                  'scheduledJob.detail.pollingTimedOut',\n                  \"Didn't see a new execution yet — refresh to check again.\"\n                )}\n              </span>\n            )}\n          </div>\n          <p className=\"text-xs text-text-tertiary\">\n            {tr('scheduledJob.detail.executionsCount', 'Total')}: {job.executions?.total ?? 0}\n          </p>\n        </div>\n        {executions.length === 0 ? (\n          <div className=\"flex items-center justify-center py-12 border border-border-default border-dashed rounded-lg\">\n            <p className=\"text-sm text-text-secondary\">\n              {tr('scheduledJob.detail.noExecutions', 'No executions yet')}\n            </p>\n          </div>\n        ) : (\n          <MotionList\n            stagger={0.02}\n            className=\"flex flex-col gap-2 overflow-auto pr-1 max-h-[60vh]\"\n          >\n            {executions.map((ex: JobExecutionShape) => {\n              // `??` keeps null/undefined out of the badge text.\n              const exStatus = ex.status ?? 'UNKNOWN';\n              const exColor = STATUS_COLORS[exStatus] || STATUS_COLORS.PENDING;\n              return (\n                <MotionItem\n                  key={ex.id}\n                  className=\"flex items-center gap-3 bg-bg-surface border border-border-default rounded-lg p-3\"\n                >\n                  <span\n                    className={`px-2 py-0.5 text-xs font-medium rounded border ${exColor} flex-shrink-0`}\n                  >\n                    {exStatus}\n                  </span>\n                  <div className=\"flex-1 min-w-0\">\n                    <p className=\"text-sm text-text-primary truncate\">{fmtTime(ex.startedAt)}</p>\n                    {ex.completedAt && (\n                      <p className=\"text-xs text-text-tertiary truncate\">\n                        {tr('scheduledJob.detail.completedAt', 'Completed')}:{' '}\n                        {fmtTime(ex.completedAt)}\n                      </p>\n                    )}\n                  </div>\n                  {ex.statusCode !== null && ex.statusCode !== undefined && (\n                    <span className=\"text-xs font-mono text-text-secondary flex-shrink-0\">\n                      {ex.statusCode}\n                    </span>\n                  )}\n                  {canReadExecutionLogs && (\n                    <button\n                      type=\"button\"\n                      onClick={() => handleViewExecution(ex)}\n                      className=\"p-1 rounded hover:bg-bg-sunken transition-colors flex-shrink-0\"\n                      aria-label={tr('scheduledJob.detail.viewLogs', 'View logs')}\n                      title={tr('scheduledJob.detail.viewLogs', 'View logs')}\n                    >\n                      <Eye size={14} />\n                    </button>\n                  )}\n                </MotionItem>\n              );\n            })}\n          </MotionList>\n        )}\n      </div>\n\n      {/* Per-execution Logs Drawer (reused) */}\n      <LogsDrawer\n        isOpen={showLogsDrawer}\n        onClose={() => setShowLogsDrawer(false)}\n        execution={selectedExecution}\n        taskTitle={job.name || tr('scheduledJob.detail.untitled', 'Untitled job')}\n        // ScheduledJob executions resolve the agent through the\n        // linked Action at run time, so there's no agentId to\n        // associate with the drawer view — LogsDrawer destructures\n        // this as `_agentId` and never reads it.\n        agentId=\"\"\n      />\n    </MotionPage>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/SessionDetailsPage.js

@@ -263,11 +263,11 @@ function S() {
 		})
 	});
 	if (st && (st.permissionStrings?.length ?? 0) > 0 && !at(xe.SESSION_READ)) return /* @__PURE__ */ v("div", {
-		className: "flex items-center justify-center min-h-[400px]",
+		className: "flex items-center justify-center min-h-[400px] px-4",
 		children: /* @__PURE__ */ y("div", {
-			className: "text-center space-y-2",
+			className: "text-center space-y-2 max-w-sm",
 			children: [/* @__PURE__ */ v("h2", {
-				className: "text-lg font-semibold text-foreground",
+				className: "text-lg font-semibold tracking-tight text-text-primary",
 				children: C("sessionDetails.accessDenied", "Access Denied")
 			}), /* @__PURE__ */ v("p", {
 				className: "text-sm text-text-secondary",
@@ -316,7 +316,7 @@ function S() {
 			action: /* @__PURE__ */ v("button", {
 				type: "button",
 				onClick: Z,
-				className: "px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors",
+				className: "px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
 				children: C("sessionDetails.backToSessions", "Back to Sessions")
 			})
 		})]
@@ -382,7 +382,7 @@ function S() {
 								})] }) : /* @__PURE__ */ y("button", {
 									type: "button",
 									onClick: sn,
-									className: "flex items-center gap-2 px-3 py-2 bg-status-success-bg text-status-success-text rounded-md hover:opacity-80 transition-colors",
+									className: "flex items-center gap-2 px-3 py-2 bg-status-success-bg-subtle text-status-success-text border border-status-success-border rounded-button hover:bg-status-success-bg-subtle/80 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
 									children: [/* @__PURE__ */ v(Ve, { className: "size-4" }), C("sessionDetails.runCommand", "Run Command")]
 								}),
 								X ? /* @__PURE__ */ y(_, { children: [
@@ -415,7 +415,7 @@ function S() {
 									type: "button",
 									onClick: un,
 									disabled: z || !A,
-									className: "flex items-center gap-2 px-3 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50",
+									className: "flex items-center gap-2 px-3 py-2 bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-all duration-200 disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
 									title: A ? A.tunnelUrl ? C("sessionDetails.openTerminal", "Open terminal") : C("sessionDetails.agentNoTunnelUrl", "Agent has no tunnel URL configured") : C("sessionDetails.noAgentAssigned", "No agent assigned"),
 									children: [z ? /* @__PURE__ */ v(h, { className: "size-4 animate-spin" }) : /* @__PURE__ */ v(g, { className: "size-4" }), C("sessionDetails.openTerminal", "Open Terminal")]
 								})
@@ -431,8 +431,8 @@ function S() {
 								children: /* @__PURE__ */ y("div", {
 									className: "flex items-center gap-3",
 									children: [/* @__PURE__ */ v("div", {
-										className: "size-10 rounded-lg bg-bg-sunken flex items-center justify-center",
-										children: /* @__PURE__ */ v(g, { className: "size-5 text-text-secondary" })
+										className: "size-10 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
+										children: /* @__PURE__ */ v(g, { className: "size-5 text-action-primary-bg" })
 									}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
 										className: "text-sm text-text-secondary",
 										children: C("sessionDetails.statusLabel", "Status")
@@ -447,8 +447,8 @@ function S() {
 								children: /* @__PURE__ */ y("div", {
 									className: "flex items-center gap-3",
 									children: [/* @__PURE__ */ v("div", {
-										className: "size-10 rounded-lg bg-bg-sunken flex items-center justify-center",
-										children: /* @__PURE__ */ v(Me, { className: "size-5 text-text-secondary" })
+										className: "size-10 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
+										children: /* @__PURE__ */ v(Me, { className: "size-5 text-action-primary-bg" })
 									}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
 										className: "text-sm text-text-secondary",
 										children: C("sessionDetails.typeLabel", "Type")
@@ -463,8 +463,8 @@ function S() {
 								children: /* @__PURE__ */ y("div", {
 									className: "flex items-center gap-3",
 									children: [/* @__PURE__ */ v("div", {
-										className: "size-10 rounded-lg bg-bg-sunken flex items-center justify-center",
-										children: /* @__PURE__ */ v(Fe, { className: "size-5 text-text-secondary" })
+										className: "size-10 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
+										children: /* @__PURE__ */ v(Fe, { className: "size-5 text-action-primary-bg" })
 									}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
 										className: "text-sm text-text-secondary",
 										children: C("sessionDetails.pidLabel", "PID")
@@ -479,8 +479,8 @@ function S() {
 								children: /* @__PURE__ */ y("div", {
 									className: "flex items-center gap-3",
 									children: [/* @__PURE__ */ v("div", {
-										className: "size-10 rounded-lg bg-bg-sunken flex items-center justify-center",
-										children: /* @__PURE__ */ v(We, { className: "size-5 text-text-secondary" })
+										className: "size-10 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
+										children: /* @__PURE__ */ v(We, { className: "size-5 text-action-primary-bg" })
 									}), /* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("p", {
 										className: "text-sm text-text-secondary",
 										children: C("sessionDetails.agentLabel", "Agent")
@@ -518,7 +518,7 @@ function S() {
 									value: gt,
 									onChange: (e) => _t(e.target.value),
 									placeholder: C("sessionDetails.commandPlaceholder", "bun run dev"),
-									className: "w-full px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-md text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg font-mono"
+									className: "w-full px-3 py-2 text-sm bg-bg-sunken border border-border-subtle rounded-input text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-1 focus:ring-[var(--color-focus-ring)] focus:border-border-strong font-mono transition-colors"
 								})] }),
 								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
 									className: "block text-xs font-medium text-text-secondary mb-1",
@@ -529,7 +529,7 @@ function S() {
 									value: vt,
 									onChange: (e) => yt(e.target.value),
 									placeholder: C("sessionDetails.workingDirPlaceholder", "/home/user/myproject"),
-									className: "w-full px-3 py-2 text-sm bg-bg-sunken border border-border-default rounded-md text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-2 focus:ring-action-primary-bg font-mono"
+									className: "w-full px-3 py-2 text-sm bg-bg-sunken border border-border-subtle rounded-input text-text-primary placeholder:text-text-placeholder focus:outline-none focus:ring-1 focus:ring-[var(--color-focus-ring)] focus:border-border-strong font-mono transition-colors"
 								})] }),
 								/* @__PURE__ */ y("div", {
 									className: "flex items-center gap-2",
@@ -537,7 +537,7 @@ function S() {
 										type: "button",
 										onClick: Ct,
 										disabled: bt,
-										className: "flex items-center gap-1.5 px-3 py-1.5 text-sm bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50",
+										className: "flex items-center gap-1.5 px-3 py-1.5 text-sm bg-action-primary-bg text-action-primary-text rounded-button hover:bg-action-primary-bgHover transition-all duration-200 disabled:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
 										children: [bt ? /* @__PURE__ */ v(h, { className: "size-3.5 animate-spin" }) : /* @__PURE__ */ v(Oe, { className: "size-3.5" }), C("sessionDetails.save", "Save")]
 									}), /* @__PURE__ */ y("button", {
 										type: "button",
@@ -646,8 +646,8 @@ function S() {
 							children: [/* @__PURE__ */ y("div", {
 								className: "flex items-center gap-3",
 								children: [/* @__PURE__ */ v("div", {
-									className: "size-10 rounded-lg bg-bg-sunken flex items-center justify-center",
-									children: /* @__PURE__ */ v(We, { className: "size-5 text-text-secondary" })
+									className: "size-10 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center",
+									children: /* @__PURE__ */ v(We, { className: "size-5 text-action-primary-bg" })
 								}), /* @__PURE__ */ y("div", { children: [
 									/* @__PURE__ */ v("p", {
 										className: "text-sm text-text-secondary",
@@ -830,7 +830,7 @@ function S() {
 									/* @__PURE__ */ v("button", {
 										type: "button",
 										onClick: un,
-										className: "mt-4 px-4 py-2 bg-bg-muted text-text-primary text-sm rounded-md hover:bg-bg-sunken transition-colors",
+										className: "mt-4 px-4 py-2 bg-bg-sunken text-text-primary text-sm rounded-button hover:bg-bg-elevated transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
 										children: C("sessionDetails.retry", "Retry")
 									})
 								]
@@ -869,7 +869,7 @@ function S() {
 									/* @__PURE__ */ v("button", {
 										type: "button",
 										onClick: rn,
-										className: "mt-4 px-4 py-2 bg-bg-muted text-text-primary text-sm rounded-md hover:bg-bg-sunken transition-colors",
+										className: "mt-4 px-4 py-2 bg-bg-sunken text-text-primary text-sm rounded-button hover:bg-bg-elevated transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
 										children: C("sessionDetails.retry", "Retry")
 									})
 								] }) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(h, { className: "size-6 text-text-tertiary mx-auto mb-3 animate-spin" }), /* @__PURE__ */ v("p", {