@burdenoff/microfe-vibecontrols 2026.511.1

package/dist/pages/VibesPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VibesPage.js","names":[],"sources":["../../src/pages/VibesPage.tsx"],"sourcesContent":["import { useState, useMemo, useRef, useEffect, useCallback } from 'react';\nimport { Plus, Zap, Grid, List, RefreshCw, Archive, Play } from 'lucide-react';\nimport { VibeCard, VibeList } from '@/components/vibes';\nimport type { Vibe } from '@/components/vibes';\nimport {\n  PageHeader,\n  SearchInput,\n  FilterDropdown,\n  EmptyState,\n  LoadingState,\n  ErrorState,\n  ConfirmDialog,\n  QuotaExhaustedDialog,\n  SelectionCheckbox,\n  GetHelpButton,\n} from '@/components/shared';\nimport { MotionPage, MotionList, MotionItem } from '@burdenoff/fe-libs/shared/motion';\nimport { AnimatePresence } from 'framer-motion';\nimport { useVibeControls, useVibeNavigate } from '@/providers/VibeControlsProvider';\nimport {\n  useListVibesQuery,\n  useCreateVibeMutation,\n  useUpdateVibeStatusMutation,\n  useArchiveVibeMutation,\n  useListAgentsQuery,\n  type ListAgentsQuery,\n} from '@/generated/wspace-operations';\n\ntype Agent = NonNullable<ListAgentsQuery['vibecontrolsAgents']>[number];\nimport {\n  PermissionGate,\n  PermissionButton,\n  AccessDenied,\n} from '@burdenoff/fe-libs/shared/components';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { VIBE_PERMISSIONS } from '@/constants/permissions';\nimport { isQuotaExhaustedError } from '@/utils/quotaUtils';\n\ntype ViewMode = 'grid' | 'list';\n\n/**\n * Vibes (projects/repositories) management page\n */\nexport function VibesPage() {\n  const { onVibeActivate } = useVibeControls();\n  const navigate = useVibeNavigate();\n  const { hasPermission, isLoading: permissionsLoading, permissions } = usePermissions();\n  const { t } = useI18n();\n\n  const tr = useCallback(\n    (key: string, fallback: string, params?: Record<string, string | number>): string => {\n      const translated = t(key, params);\n      const template = translated === key ? fallback : translated;\n\n      if (!params) return template;\n\n      return Object.entries(params).reduce(\n        (acc, [paramKey, paramValue]) => acc.replace(`{{${paramKey}}}`, String(paramValue)),\n        template\n      );\n    },\n    [t]\n  );\n\n  const statusOptions = [\n    { value: 'all', label: tr('vibesPage.statusAll', 'All Statuses') },\n    { value: 'ACTIVE', label: tr('vibesPage.statusActive', 'Active') },\n    { value: 'INACTIVE', label: tr('vibesPage.statusInactive', 'Inactive') },\n    { value: 'ARCHIVED', label: tr('vibesPage.statusArchived', 'Archived') },\n    { value: 'ERROR', label: tr('vibesPage.statusError', 'Error') },\n  ];\n\n  const typeOptions = [\n    { value: 'all', label: tr('vibesPage.typeAll', 'All Types') },\n    { value: 'PROJECT', label: tr('vibesPage.typeProject', 'Project') },\n    { value: 'REPOSITORY', label: tr('vibesPage.typeRepository', 'Repository') },\n    { value: 'WORKSPACE', label: tr('vibesPage.typeWorkspace', 'Workspace') },\n    { value: 'MONOREPO', label: tr('vibesPage.typeMonorepo', 'Monorepo') },\n    { value: 'PACKAGE', label: tr('vibesPage.typePackage', 'Package') },\n    { value: 'CUSTOM', label: tr('vibesPage.typeCustom', 'Custom') },\n  ];\n\n  // Check permissions\n  const canListVibes = hasPermission(VIBE_PERMISSIONS.VIBE_LIST);\n  const canUpdateVibe = hasPermission(VIBE_PERMISSIONS.VIBE_UPDATE);\n\n  // Skip queries until permissions are loaded and user has permission\n  // This prevents FORBIDDEN errors from triggering auth error handlers\n  const shouldSkipQueries = permissionsLoading || !canListVibes;\n\n  const [searchQuery, setSearchQuery] = useState('');\n  const [statusFilter, setStatusFilter] = useState('all');\n  const [typeFilter, setTypeFilter] = useState('all');\n  const [agentFilter, setAgentFilter] = useState('all');\n  const [viewMode, setViewMode] = useState<ViewMode>('grid');\n  const [showCreateForm, setShowCreateForm] = useState(false);\n  const [createError, setCreateError] = useState<string | null>(null);\n  const [createLoading, setCreateLoading] = useState(false);\n  const [successMessage, setSuccessMessage] = useState<string | null>(null);\n  const [showQuotaExhausted, setShowQuotaExhausted] = useState(false);\n  const [fieldErrors, setFieldErrors] = useState<{ name?: string; path?: string }>({});\n  const [pageError, setPageError] = useState<string | null>(null);\n  const [selectedVibeIds, setSelectedVibeIds] = useState<Set<string>>(new Set());\n  const [bulkAction, setBulkAction] = useState<'activate' | 'archive' | null>(null);\n  const pageErrorTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    return () => {\n      if (pageErrorTimer.current) clearTimeout(pageErrorTimer.current);\n    };\n  }, []);\n\n  const clearPageError = useCallback(() => {\n    setPageError(null);\n    if (pageErrorTimer.current) {\n      clearTimeout(pageErrorTimer.current);\n      pageErrorTimer.current = null;\n    }\n  }, []);\n\n  // Form refs for create modal\n  const nameRef = useRef<HTMLInputElement>(null);\n  const pathRef = useRef<HTMLInputElement>(null);\n  const agentRef = useRef<HTMLSelectElement>(null);\n  const typeRef = useRef<HTMLSelectElement>(null);\n\n  const [createVibe] = useCreateVibeMutation();\n  const [updateVibeStatus] = useUpdateVibeStatusMutation();\n  const [archiveVibe] = useArchiveVibeMutation();\n\n  // Memoise variables so a stable identity keeps Apollo from treating each\n  // render as a new query (which caused multiple loading flashes).\n  // NOTE: we intentionally do NOT include `searchQuery` in the query\n  // variables — the list is filtered client-side by name below, and keying\n  // the query on `searchQuery` caused a fresh refetch on every keystroke\n  // (previously mitigated by an unusable `limit: 1000` fire-hose). Rely on\n  // the default backend pagination and filter client-side within the page.\n  const listVibesVariables = useMemo(\n    () => ({\n      filter: {\n        status:\n          statusFilter !== 'all'\n            ? (statusFilter as 'ACTIVE' | 'INACTIVE' | 'ARCHIVED' | 'ERROR')\n            : undefined,\n        type:\n          typeFilter !== 'all'\n            ? (typeFilter as\n                | 'PROJECT'\n                | 'REPOSITORY'\n                | 'WORKSPACE'\n                | 'MONOREPO'\n                | 'PACKAGE'\n                | 'CUSTOM')\n            : undefined,\n        agentId: agentFilter !== 'all' ? agentFilter : undefined,\n      },\n    }),\n    [statusFilter, typeFilter, agentFilter]\n  );\n\n  // Fetch vibes from GraphQL API. cache-and-network returns the cached list\n  // immediately while revalidating once in the background — avoids the\n  // \"loading → cache → network → cache\" double-flash seen with cache-first\n  // plus mutation refetchQueries. `notifyOnNetworkStatusChange` keeps the\n  // loading flag true during refetches so the UI can show a spinner rather\n  // than showing stale data silently.\n  const { data, loading, error, refetch } = useListVibesQuery({\n    variables: listVibesVariables,\n    fetchPolicy: 'cache-and-network',\n    nextFetchPolicy: 'cache-first',\n    skip: shouldSkipQueries,\n    notifyOnNetworkStatusChange: true,\n  });\n\n  // Fetch agents directly for the filter and create form dropdowns.\n  // Uses cache-first since InitialDataPrefetcher keeps the cache warm;\n  // avoids a redundant network hit on every page visit.\n  const { data: agentsData } = useListAgentsQuery({\n    variables: { pagination: { limit: 100 } },\n    fetchPolicy: 'cache-first',\n    skip: shouldSkipQueries,\n  });\n\n  // Build agent options for filter using fetched data\n  const agentOptions = useMemo(() => {\n    const agents = agentsData?.vibecontrolsAgents ?? [];\n    return [\n      { value: 'all', label: tr('vibesPage.allAgents', 'All Agents') },\n      ...agents.map((agent: Agent) => ({\n        value: agent.id,\n        label: agent.name,\n      })),\n    ];\n  }, [agentsData?.vibecontrolsAgents, tr]);\n\n  // Map GraphQL response to Vibe type\n  const vibes: Vibe[] = useMemo(() => {\n    const rawVibes = data?.vibes?.items ?? [];\n    return rawVibes.map((vibe: NonNullable<typeof rawVibes>[number]) => ({\n      id: vibe.id,\n      workspaceId: vibe.workspaceId,\n      name: vibe.name,\n      description: vibe.description || null,\n      type: vibe.type as Vibe['type'],\n      status: vibe.status as Vibe['status'],\n      path: vibe.path || null,\n      agentId: vibe.agentId || null,\n      parentId: vibe.parentId || null,\n      gitBranch: vibe.gitBranch || null,\n      gitRemote: vibe.gitRemote || null,\n      gitStatus: vibe.gitStatus\n        ? typeof vibe.gitStatus === 'string'\n          ? vibe.gitStatus\n          : typeof vibe.gitStatus === 'object' &&\n              vibe.gitStatus !== null &&\n              'status' in vibe.gitStatus\n            ? String((vibe.gitStatus as Record<string, unknown>).status)\n            : JSON.stringify(vibe.gitStatus)\n        : null,\n      environmentVariables: (vibe.environmentVariables as Record<string, string>) || {},\n      tags: vibe.tags || [],\n      metadata: (vibe.metadata as Record<string, unknown>) || {},\n      createdAt: vibe.createdAt,\n      updatedAt: vibe.updatedAt,\n      agent: vibe.agent ? { id: vibe.agent.id, name: vibe.agent.name } : undefined,\n    }));\n  }, [data?.vibes?.items]);\n\n  // Filter vibes based on search (client-side filtering for search)\n  const filteredVibes = useMemo(() => {\n    return vibes.filter((vibe) => {\n      // Search filter\n      if (searchQuery) {\n        const query = searchQuery.toLowerCase();\n        const matchesSearch =\n          vibe.name.toLowerCase().includes(query) ||\n          vibe.description?.toLowerCase().includes(query) ||\n          vibe.path?.toLowerCase().includes(query) ||\n          vibe.tags?.some((tag) => tag.toLowerCase().includes(query));\n        if (!matchesSearch) return false;\n      }\n\n      return true;\n    });\n  }, [vibes, searchQuery]);\n\n  const selectedVibes = useMemo(\n    () => vibes.filter((vibe) => selectedVibeIds.has(vibe.id)),\n    [vibes, selectedVibeIds]\n  );\n  const activatableVibes = selectedVibes.filter((vibe) => vibe.status !== 'ACTIVE');\n  const archivableVibes = selectedVibes.filter((vibe) => vibe.status !== 'ARCHIVED');\n  const allVisibleSelected =\n    filteredVibes.length > 0 && filteredVibes.every((vibe) => selectedVibeIds.has(vibe.id));\n  const partiallySelected =\n    filteredVibes.some((vibe) => selectedVibeIds.has(vibe.id)) && !allVisibleSelected;\n\n  const handleVibeSelect = (vibe: Vibe) => {\n    navigate(`/vibes/${vibe.id}`);\n  };\n\n  const handleVibeActivate = async (vibe: Vibe) => {\n    try {\n      const result = await updateVibeStatus({\n        variables: { id: vibe.id, status: 'ACTIVE' as const },\n      });\n      if (result.data?.updateVibeStatus) {\n        onVibeActivate?.({ id: vibe.id, name: vibe.name, type: vibe.type, status: 'ACTIVE' });\n      }\n    } catch (err) {\n      console.error('Failed to activate vibe:', err);\n    }\n  };\n\n  const handleVibeArchive = async (vibe: Vibe) => {\n    try {\n      await archiveVibe({ variables: { id: vibe.id } });\n    } catch (err) {\n      console.error('Failed to archive vibe:', err);\n    }\n  };\n\n  const handleOpenInEditor = (vibe: Vibe) => {\n    if (vibe.path) {\n      window.location.href = `vscode://file/${vibe.path}`;\n    } else {\n      setPageError(tr('vibesPage.openEditorPathMissing', 'No path available to open in editor'));\n      pageErrorTimer.current = setTimeout(() => {\n        setPageError(null);\n        pageErrorTimer.current = null;\n      }, 3000);\n    }\n  };\n\n  const handleCreateVibe = () => {\n    setCreateError(null);\n    setShowCreateForm(true);\n  };\n\n  const toggleVibeSelection = (vibe: Vibe, checked: boolean) => {\n    setSelectedVibeIds((prev) => {\n      const next = new Set(prev);\n      if (checked) {\n        next.add(vibe.id);\n      } else {\n        next.delete(vibe.id);\n      }\n      return next;\n    });\n  };\n\n  const toggleAllVisibleVibes = (checked: boolean) => {\n    setSelectedVibeIds((prev) => {\n      const next = new Set(prev);\n      filteredVibes.forEach((vibe) => {\n        if (checked) {\n          next.add(vibe.id);\n        } else {\n          next.delete(vibe.id);\n        }\n      });\n      return next;\n    });\n  };\n\n  const clearSelection = () => setSelectedVibeIds(new Set());\n\n  const handleBulkActivate = async () => {\n    if (activatableVibes.length === 0) return;\n\n    const results = await Promise.allSettled(\n      activatableVibes.map((vibe) =>\n        updateVibeStatus({ variables: { id: vibe.id, status: 'ACTIVE' as const } })\n      )\n    );\n\n    const succeeded = results.filter((result) => result.status === 'fulfilled').length;\n    const failed = results.length - succeeded;\n\n    setSuccessMessage(\n      `Activated ${succeeded} vibe${succeeded === 1 ? '' : 's'}${failed > 0 ? ` • ${failed} failed` : ''}`\n    );\n    setTimeout(() => setSuccessMessage(null), 4000);\n    clearSelection();\n    setBulkAction(null);\n    await refetch();\n  };\n\n  const handleBulkArchive = async () => {\n    if (archivableVibes.length === 0) return;\n\n    const results = await Promise.allSettled(\n      archivableVibes.map((vibe) => archiveVibe({ variables: { id: vibe.id } }))\n    );\n\n    const succeeded = results.filter((result) => result.status === 'fulfilled').length;\n    const failed = results.length - succeeded;\n\n    setSuccessMessage(\n      `Archived ${succeeded} vibe${succeeded === 1 ? '' : 's'}${failed > 0 ? ` • ${failed} failed` : ''}`\n    );\n    setTimeout(() => setSuccessMessage(null), 4000);\n    clearSelection();\n    setBulkAction(null);\n    await refetch();\n  };\n\n  const handleSubmitCreateVibe = async () => {\n    const name = nameRef.current?.value?.trim();\n    const path = pathRef.current?.value?.trim();\n    const agentId = agentRef.current?.value;\n    const type = typeRef.current?.value;\n\n    const errors: { name?: string; path?: string } = {};\n    if (!name) errors.name = tr('vibesPage.nameRequired', 'Name is required');\n    if (!path) errors.path = tr('vibesPage.pathRequired', 'Path is required');\n    if (errors.name || errors.path) {\n      setFieldErrors(errors);\n      setCreateError(tr('vibesPage.fillRequired', 'Please fill in all required fields'));\n      return;\n    }\n    setFieldErrors({});\n\n    // Validate type against allowed enum values\n    const validTypes = [\n      'PROJECT',\n      'REPOSITORY',\n      'WORKSPACE',\n      'MONOREPO',\n      'PACKAGE',\n      'CUSTOM',\n    ] as const;\n    const resolvedType = validTypes.includes(type as (typeof validTypes)[number])\n      ? (type as (typeof validTypes)[number])\n      : 'PROJECT';\n\n    setCreateLoading(true);\n    setCreateError(null);\n    try {\n      const result = await createVibe({\n        variables: {\n          input: {\n            name,\n            path,\n            type: resolvedType,\n            agentId: agentId || undefined,\n          },\n        },\n      });\n      if (!result.data?.createVibe?.id) {\n        throw new Error(tr('vibesPage.failedCreate', 'Failed to create vibe'));\n      }\n      await refetch();\n      setShowCreateForm(false);\n      setSuccessMessage(tr('vibesPage.createdSuccess', 'Vibe created successfully'));\n      setTimeout(() => setSuccessMessage(null), 3000);\n    } catch (err) {\n      if (isQuotaExhaustedError(err)) {\n        setShowCreateForm(false);\n        setCreateError(null);\n        setFieldErrors({});\n        setShowQuotaExhausted(true);\n        return;\n      }\n\n      setCreateError(\n        err instanceof Error ? err.message : tr('vibesPage.failedCreate', 'Failed to create vibe')\n      );\n    } finally {\n      setCreateLoading(false);\n    }\n  };\n\n  // Stats\n  const stats = {\n    total: vibes.length,\n    active: vibes.filter((v) => v.status === 'ACTIVE').length,\n    inactive: vibes.filter((v) => v.status === 'INACTIVE').length,\n  };\n\n  // Collapse guard states into a single MotionPage shell so transitioning\n  // between loading / error / data does not unmount+remount and replay the\n  // entrance animation. Contents are swapped in-place.\n  const showPermissionsLoading = permissionsLoading;\n  const showAccessDenied =\n    !permissionsLoading &&\n    !!permissions &&\n    (permissions.permissionStrings?.length ?? 0) > 0 &&\n    !canListVibes;\n  const showInitialLoading =\n    !showPermissionsLoading && !showAccessDenied && loading && vibes.length === 0;\n  const showInitialError =\n    !showPermissionsLoading && !showAccessDenied && !!error && vibes.length === 0;\n  const showDataShell =\n    !showPermissionsLoading && !showAccessDenied && !showInitialLoading && !showInitialError;\n\n  return (\n    <MotionPage className=\"space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen\">\n      {showPermissionsLoading && (\n        <LoadingState message={tr('vibesPage.loadingPermissions', 'Loading permissions...')} />\n      )}\n      {showAccessDenied && (\n        <AccessDenied\n          title={tr('vibesPage.accessDeniedTitle', 'Access Denied')}\n          description={tr(\n            'vibesPage.accessDeniedDescription',\n            \"You don't have permission to view vibes. Contact your workspace administrator for access.\"\n          )}\n        />\n      )}\n      {showInitialLoading && (\n        <LoadingState message={tr('vibesPage.loadingVibes', 'Loading vibes...')} />\n      )}\n      {showInitialError && (\n        <ErrorState\n          title={tr('vibesPage.failedLoad', 'Failed to load vibes')}\n          message={error?.message ?? ''}\n          onRetry={() => refetch()}\n        />\n      )}\n      {showDataShell && (\n        <>\n          <PageHeader\n            title={tr('vibesPage.title', 'Vibes')}\n            description={tr('vibesPage.descriptionActive', '{{active}} of {{total}} vibes active', {\n              active: stats.active,\n              total: stats.total,\n            })}\n            actions={\n              <div className=\"flex items-center gap-2\">\n                <button\n                  onClick={() => refetch()}\n                  disabled={loading}\n                  className=\"flex items-center gap-2 px-3 py-2 text-text-secondary hover:bg-bg-sunken rounded-md transition-colors disabled:opacity-50\"\n                  title={tr('vibesPage.refreshTitle', 'Refresh vibes')}\n                >\n                  <RefreshCw className={`w-4 h-4 ${loading ? 'animate-spin' : ''}`} />\n                </button>\n                <PermissionButton\n                  permission={VIBE_PERMISSIONS.VIBE_CREATE}\n                  deniedBehavior=\"disable\"\n                  deniedTooltip={tr(\n                    'vibesPage.deniedCreateTooltip',\n                    \"You don't have permission to create vibes\"\n                  )}\n                >\n                  <button\n                    onClick={handleCreateVibe}\n                    className=\"flex items-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50 disabled:cursor-not-allowed\"\n                  >\n                    <Plus className=\"w-4 h-4\" />\n                    {tr('vibesPage.addVibe', 'Add Vibe')}\n                  </button>\n                </PermissionButton>\n              </div>\n            }\n          />\n\n          {/* Filters Bar */}\n          <div className=\"space-y-3\">\n            {/* Row 1: Search + View Toggle */}\n            <div className=\"flex items-center gap-2\">\n              <SearchInput\n                value={searchQuery}\n                onChange={setSearchQuery}\n                placeholder={tr('vibesPage.searchPlaceholder', 'Search vibes...')}\n                className=\"flex-1 sm:w-64 sm:flex-none\"\n              />\n              {/* View Toggle */}\n              <div className=\"flex items-center gap-1 bg-bg-sunken rounded-md p-1 flex-shrink-0\">\n                <button\n                  onClick={() => setViewMode('grid')}\n                  className={`p-1.5 sm:p-2 rounded ${viewMode === 'grid' ? 'bg-bg-surface shadow-sm' : 'hover:bg-bg-surface/50'}`}\n                  title={tr('vibesPage.gridViewTitle', 'Grid view')}\n                >\n                  <Grid className=\"w-4 h-4 text-text-secondary\" />\n                </button>\n                <button\n                  onClick={() => setViewMode('list')}\n                  className={`p-1.5 sm:p-2 rounded ${viewMode === 'list' ? 'bg-bg-surface shadow-sm' : 'hover:bg-bg-surface/50'}`}\n                  title={tr('vibesPage.listViewTitle', 'List view')}\n                >\n                  <List className=\"w-4 h-4 text-text-secondary\" />\n                </button>\n              </div>\n            </div>\n\n            {/* Row 2: Filters - wrap on all screens */}\n            <div className=\"flex items-center gap-2 sm:gap-3 flex-wrap\">\n              <FilterDropdown\n                label={tr('vibesPage.filterStatus', 'Status')}\n                value={statusFilter}\n                options={statusOptions}\n                onChange={setStatusFilter}\n              />\n              <FilterDropdown\n                label={tr('vibesPage.filterType', 'Type')}\n                value={typeFilter}\n                options={typeOptions}\n                onChange={setTypeFilter}\n              />\n              <FilterDropdown\n                label={tr('vibesPage.filterAgent', 'Agent')}\n                value={agentFilter}\n                options={agentOptions}\n                onChange={setAgentFilter}\n              />\n            </div>\n          </div>\n\n          {/* Results Count */}\n          {searchQuery ||\n          statusFilter !== 'all' ||\n          typeFilter !== 'all' ||\n          agentFilter !== 'all' ? (\n            <p className=\"text-sm text-text-secondary\">\n              {tr('vibesPage.showingResults', 'Showing {{filtered}} of {{total}} vibes', {\n                filtered: filteredVibes.length,\n                total: vibes.length,\n              })}\n              {loading && (\n                <span className=\"ml-2 text-text-muted\">\n                  {tr('vibesPage.refreshing', '(refreshing...)')}\n                </span>\n              )}\n            </p>\n          ) : null}\n\n          {filteredVibes.length > 0 && (\n            <div className=\"rounded-lg border border-border-default bg-bg-surface p-4\">\n              <div className=\"flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between\">\n                <div className=\"flex flex-wrap items-center gap-3\">\n                  <div className=\"flex items-center gap-2\">\n                    <SelectionCheckbox\n                      checked={allVisibleSelected}\n                      indeterminate={partiallySelected}\n                      onChange={toggleAllVisibleVibes}\n                      ariaLabel=\"Select all visible vibes\"\n                    />\n                    <span className=\"text-sm font-medium text-text-primary\">\n                      Select all visible\n                    </span>\n                  </div>\n                  {selectedVibeIds.size > 0 && (\n                    <button\n                      onClick={clearSelection}\n                      className=\"text-sm text-text-secondary hover:text-text-primary\"\n                    >\n                      Clear selection\n                    </button>\n                  )}\n                </div>\n\n                <div className=\"flex flex-wrap items-center gap-2\">\n                  <span className=\"rounded-full bg-bg-sunken px-3 py-1 text-sm font-medium text-text-secondary\">\n                    {selectedVibeIds.size} selected\n                  </span>\n                  <button\n                    onClick={() => setBulkAction('activate')}\n                    disabled={activatableVibes.length === 0}\n                    className=\"rounded-md border border-status-success-border px-3 py-2 text-sm font-medium text-status-success-text hover:bg-status-success-bg disabled:cursor-not-allowed disabled:opacity-50\"\n                  >\n                    <span className=\"inline-flex items-center gap-2\">\n                      <Play className=\"w-4 h-4\" />\n                      Activate Selected\n                      {activatableVibes.length > 0 ? ` (${activatableVibes.length})` : ''}\n                    </span>\n                  </button>\n                  <button\n                    onClick={() => setBulkAction('archive')}\n                    disabled={archivableVibes.length === 0}\n                    className=\"rounded-md border border-status-warning-border px-3 py-2 text-sm font-medium text-status-warning-text hover:bg-status-warning-bg disabled:cursor-not-allowed disabled:opacity-50\"\n                  >\n                    <span className=\"inline-flex items-center gap-2\">\n                      <Archive className=\"w-4 h-4\" />\n                      Archive Selected\n                      {archivableVibes.length > 0 ? ` (${archivableVibes.length})` : ''}\n                    </span>\n                  </button>\n                </div>\n              </div>\n            </div>\n          )}\n\n          {/* Vibes Display */}\n          {filteredVibes.length > 0 ? (\n            <AnimatePresence mode=\"wait\">\n              {viewMode === 'grid' ? (\n                <MotionList\n                  key=\"grid\"\n                  stagger={0.04}\n                  className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\"\n                >\n                  {filteredVibes.map((vibe) => (\n                    <MotionItem key={vibe.id}>\n                      <VibeCard\n                        vibe={vibe}\n                        onOpen={handleVibeSelect}\n                        onActivate={canUpdateVibe ? handleVibeActivate : undefined}\n                        onArchive={canUpdateVibe ? handleVibeArchive : undefined}\n                        onOpenInEditor={handleOpenInEditor}\n                        selected={selectedVibeIds.has(vibe.id)}\n                        onToggleSelect={(checked) => toggleVibeSelection(vibe, checked)}\n                      />\n                    </MotionItem>\n                  ))}\n                </MotionList>\n              ) : (\n                <MotionList key=\"list\">\n                  <VibeList\n                    vibes={filteredVibes}\n                    onOpen={handleVibeSelect}\n                    onActivate={handleVibeActivate}\n                    onArchive={handleVibeArchive}\n                    onOpenInEditor={handleOpenInEditor}\n                    selectedVibeIds={selectedVibeIds}\n                    onToggleSelect={toggleVibeSelection}\n                    onToggleAllVisible={toggleAllVisibleVibes}\n                    allVisibleSelected={allVisibleSelected}\n                    partiallySelected={partiallySelected}\n                  />\n                </MotionList>\n              )}\n            </AnimatePresence>\n          ) : (\n            <EmptyState\n              icon={<Zap className=\"w-8 h-8 text-text-secondary\" />}\n              title={\n                searchQuery ||\n                statusFilter !== 'all' ||\n                typeFilter !== 'all' ||\n                agentFilter !== 'all'\n                  ? tr('vibesPage.emptyNoVibesFound', 'No vibes found')\n                  : tr('vibesPage.emptyNoVibesConfigured', 'No vibes configured')\n              }\n              description={\n                searchQuery ||\n                statusFilter !== 'all' ||\n                typeFilter !== 'all' ||\n                agentFilter !== 'all'\n                  ? tr('vibesPage.emptyAdjustSearch', 'Try adjusting your search or filters')\n                  : tr(\n                      'vibesPage.emptyNoVibesDescription',\n                      'Add your first vibe to start managing your development projects'\n                    )\n              }\n              action={\n                !searchQuery &&\n                statusFilter === 'all' &&\n                typeFilter === 'all' &&\n                agentFilter === 'all' ? (\n                  <div className=\"flex items-center gap-2\">\n                    <PermissionGate permission={VIBE_PERMISSIONS.VIBE_CREATE}>\n                      <button\n                        onClick={handleCreateVibe}\n                        className=\"flex items-center gap-2 px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors\"\n                      >\n                        <Plus className=\"w-4 h-4\" />\n                        {tr('vibesPage.addVibe', 'Add Vibe')}\n                      </button>\n                    </PermissionGate>\n                    <GetHelpButton prompt=\"What is a Vibe in VibeControls and how do I create one?\" />\n                  </div>\n                ) : undefined\n              }\n            />\n          )}\n\n          {/* Success Toast */}\n          {successMessage && (\n            <div className=\"fixed bottom-4 right-4 z-50 px-4 py-3 bg-status-success-bg text-status-success-text rounded-md shadow-lg text-sm\">\n              {successMessage}\n            </div>\n          )}\n\n          <ConfirmDialog\n            isOpen={bulkAction === 'activate'}\n            onClose={() => setBulkAction(null)}\n            onConfirm={handleBulkActivate}\n            title=\"Activate selected vibes\"\n            message={`Activate ${activatableVibes.length} selected vibe${activatableVibes.length === 1 ? '' : 's'}?`}\n            confirmLabel=\"Activate\"\n            variant=\"default\"\n          />\n\n          <ConfirmDialog\n            isOpen={bulkAction === 'archive'}\n            onClose={() => setBulkAction(null)}\n            onConfirm={handleBulkArchive}\n            title=\"Archive selected vibes\"\n            message={`Archive ${archivableVibes.length} selected vibe${archivableVibes.length === 1 ? '' : 's'}? Archived vibes will be hidden from active workflows.`}\n            confirmLabel=\"Archive\"\n            variant=\"warning\"\n          />\n\n          {/* Page-level Error Toast */}\n          {pageError && (\n            <div\n              role=\"alert\"\n              className=\"fixed bottom-4 right-4 z-50 px-4 py-3 bg-status-error-bg text-status-error-text rounded-md shadow-lg text-sm\"\n            >\n              {pageError}\n              <button\n                onClick={clearPageError}\n                className=\"ml-3 text-xs underline opacity-80 hover:opacity-100\"\n              >\n                {tr('vibesPage.dismiss', 'Dismiss')}\n              </button>\n            </div>\n          )}\n\n          {/* Create Vibe Modal */}\n          {showCreateForm && (\n            <div className=\"fixed inset-0 bg-bg-overlay flex items-center justify-center z-50 p-4\">\n              <div className=\"bg-bg-surface rounded-lg p-6 w-full max-w-lg\">\n                <h2 className=\"text-lg font-semibold text-text-primary mb-4\">\n                  {tr('vibesPage.addNewVibe', 'Add New Vibe')}\n                </h2>\n                <div className=\"space-y-4\">\n                  {createError && (\n                    <div className=\"p-3 bg-status-error-bg text-status-error-text text-sm rounded-md\">\n                      {createError}\n                    </div>\n                  )}\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      {tr('vibesPage.nameLabel', 'Name *')}\n                    </label>\n                    <input\n                      ref={nameRef}\n                      type=\"text\"\n                      placeholder={tr('vibesPage.namePlaceholder', 'My Project')}\n                      onChange={() =>\n                        fieldErrors.name && setFieldErrors((e) => ({ ...e, name: undefined }))\n                      }\n                      className={`w-full px-3 py-2 bg-bg-sunken border rounded-md text-text-primary placeholder:text-text-placeholder ${fieldErrors.name ? 'border-status-error-border' : 'border-border-default'}`}\n                    />\n                    {fieldErrors.name && (\n                      <p className=\"mt-1 text-xs text-status-error-text\">{fieldErrors.name}</p>\n                    )}\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      {tr('vibesPage.pathLabel', 'Path *')}\n                    </label>\n                    <input\n                      ref={pathRef}\n                      type=\"text\"\n                      placeholder={tr('vibesPage.pathPlaceholder', '/path/to/project')}\n                      onChange={() =>\n                        fieldErrors.path && setFieldErrors((e) => ({ ...e, path: undefined }))\n                      }\n                      className={`w-full px-3 py-2 bg-bg-sunken border rounded-md text-text-primary placeholder:text-text-placeholder ${fieldErrors.path ? 'border-status-error-border' : 'border-border-default'}`}\n                    />\n                    {fieldErrors.path && (\n                      <p className=\"mt-1 text-xs text-status-error-text\">{fieldErrors.path}</p>\n                    )}\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      {tr('vibesPage.agentLabel', 'Agent')}\n                    </label>\n                    <select\n                      ref={agentRef}\n                      className=\"w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary\"\n                    >\n                      <option value=\"\">{tr('vibesPage.selectAgent', 'Select an agent')}</option>\n                      {agentOptions\n                        .filter((opt) => opt.value !== 'all')\n                        .map((agent) => (\n                          <option key={agent.value} value={agent.value}>\n                            {agent.label}\n                          </option>\n                        ))}\n                    </select>\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      {tr('vibesPage.typeLabel', 'Type')}\n                    </label>\n                    <select\n                      ref={typeRef}\n                      className=\"w-full px-3 py-2 bg-bg-sunken border border-border-default rounded-md text-text-primary\"\n                    >\n                      <option value=\"PROJECT\">{tr('vibesPage.typeProject', 'Project')}</option>\n                      <option value=\"REPOSITORY\">\n                        {tr('vibesPage.typeRepository', 'Repository')}\n                      </option>\n                      <option value=\"WORKSPACE\">\n                        {tr('vibesPage.typeWorkspace', 'Workspace')}\n                      </option>\n                      <option value=\"MONOREPO\">{tr('vibesPage.typeMonorepo', 'Monorepo')}</option>\n                      <option value=\"PACKAGE\">{tr('vibesPage.typePackage', 'Package')}</option>\n                      <option value=\"CUSTOM\">{tr('vibesPage.typeCustom', 'Custom')}</option>\n                    </select>\n                  </div>\n                </div>\n                <div className=\"flex flex-col sm:flex-row justify-end gap-3 mt-6\">\n                  <button\n                    onClick={() => setShowCreateForm(false)}\n                    disabled={createLoading}\n                    className=\"px-4 py-2 text-text-primary hover:bg-bg-sunken rounded-md transition-colors disabled:opacity-50\"\n                  >\n                    {tr('vibesPage.cancel', 'Cancel')}\n                  </button>\n                  <button\n                    onClick={handleSubmitCreateVibe}\n                    disabled={createLoading}\n                    className=\"px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50\"\n                  >\n                    {createLoading\n                      ? tr('vibesPage.creating', 'Creating...')\n                      : tr('vibesPage.createVibe', 'Create Vibe')}\n                  </button>\n                </div>\n              </div>\n            </div>\n          )}\n\n          <QuotaExhaustedDialog\n            isOpen={showQuotaExhausted}\n            onClose={() => setShowQuotaExhausted(false)}\n            onConfirm={() => {\n              setShowQuotaExhausted(false);\n              navigate('/billing');\n            }}\n            title=\"Vibe Quota Reached\"\n            message=\"You've used all available vibe creation quota on your current plan. Upgrade your plan to create more vibes.\"\n          />\n        </>\n      )}\n    </MotionPage>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/WebhooksPage.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Webhooks management page
+ */
+export declare function WebhooksPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=WebhooksPage.d.ts.map

package/dist/pages/WebhooksPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebhooksPage.d.ts","sourceRoot":"","sources":["../../src/pages/WebhooksPage.tsx"],"names":[],"mappings":"AA0DA;;GAEG;AACH,wBAAgB,YAAY,4CAkhC3B"}

package/dist/pages/ai/AIPage.d.ts

@@ -0,0 +1,6 @@
+/**
+ * AI page — tab-based layout for AI / vibecoding features.
+ * Reads the :tab param from the URL; defaults to "overview".
+ */
+export declare function AIPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AIPage.d.ts.map

package/dist/pages/ai/AIPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AIPage.d.ts","sourceRoot":"","sources":["../../../src/pages/ai/AIPage.tsx"],"names":[],"mappings":"AA+DA;;;GAGG;AACH,wBAAgB,MAAM,4CAwNrB"}

package/dist/pages/ai/AIPage.js

@@ -0,0 +1,187 @@
+import { useVibeNavigate as e } from "../../providers/VibeControlsProvider.js";
+import t from "../../hooks/useCachedInitialData.js";
+import { PageHeader as n } from "../../components/shared/PageHeader.js";
+import { LoadingState as r } from "../../components/shared/LoadingState.js";
+import { ErrorState as i } from "../../components/shared/ErrorState.js";
+import { EmptyState as a } from "../../components/shared/EmptyState.js";
+import { AI_CORE_PACKAGE as o, AI_PROVIDER_PACKAGES as s } from "../../constants/pluginCatalog.js";
+import { PluginGate as c } from "../../components/shared/PluginGate.js";
+import { RequireAgentReachable as l } from "../../components/shared/RequireAgentReachable.js";
+import "../../components/shared/index.js";
+import { PluginHarnessPicker as u } from "../../components/ai/PluginHarnessPicker.js";
+import { AIOverviewTab as d } from "../../components/ai/AIOverviewTab.js";
+import { AITemplatesTab as f } from "../../components/ai/AITemplatesTab.js";
+import { AIContextsTab as p } from "../../components/ai/AIContextsTab.js";
+import { AIPromptsTab as m } from "../../components/ai/AIPromptsTab.js";
+import { AISessionsTab as h } from "../../components/ai/AISessionsTab.js";
+import { AITasksTab as g } from "../../components/ai/AITasksTab.js";
+import { AIStatsTab as _ } from "../../components/ai/AIStatsTab.js";
+import { AIPlaygroundTab as v } from "../../components/ai/AIPlaygroundTab.js";
+import { ClaudeCredentialsCard as y } from "../../components/ai/ClaudeCredentialsCard.js";
+import { BridleConfigPanel as b } from "../../components/agent-manager/BridleConfigPanel.js";
+import { useCallback as x, useMemo as S, useState as C } from "react";
+import { useI18n as w } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { BarChart3 as T, FileCode2 as E, FileText as D, LayoutDashboard as O, ListTodo as k, MessageSquare as A, MessagesSquare as j, Play as M } from "lucide-react";
+import { useParams as N } from "react-router-dom";
+import { jsx as P, jsxs as F } from "react/jsx-runtime";
+import { MotionPage as I } from "@burdenoff/fe-libs/shared/motion";
+//#region src/pages/ai/AIPage.tsx
+var L = [
+	{
+		id: "overview",
+		icon: O
+	},
+	{
+		id: "templates",
+		icon: E
+	},
+	{
+		id: "contexts",
+		icon: D
+	},
+	{
+		id: "prompts",
+		icon: A
+	},
+	{
+		id: "sessions",
+		icon: j
+	},
+	{
+		id: "tasks",
+		icon: k
+	},
+	{
+		id: "stats",
+		icon: T
+	},
+	{
+		id: "playground",
+		icon: M
+	},
+	{
+		id: "config",
+		icon: O
+	}
+], R = new Set(L.map((e) => e.id));
+function z() {
+	let { t: T } = w(), { tab: E } = N(), D = E && R.has(E) ? E : "overview", O = e(), k = x((e, t) => {
+		let n = T(e);
+		return n === e ? t : n;
+	}, [T]), A = x((e) => {
+		switch (e) {
+			case "overview": return k("ai.overview", "Overview");
+			case "templates": return k("ai.templates", "Templates");
+			case "contexts": return k("ai.contexts", "Contexts");
+			case "prompts": return k("ai.prompts", "Prompts");
+			case "sessions": return k("nav.sessions", "Sessions");
+			case "tasks": return k("ai.tasks", "Tasks");
+			case "stats": return k("ai.stats", "Stats");
+			case "playground": return k("ai.playground", "Playground");
+			case "config": return k("ai.config", "Config");
+			default: return e;
+		}
+	}, [k]), { agents: M, loading: z, error: B, refetch: V } = t();
+	B && console.error("[ai] failed to load initial workspace data", B);
+	let H = S(() => M.find((e) => e.isActive && e.tunnelUrl && e.agentApiKey) ?? null, [M])?.id ?? "", U = x((e) => {
+		O(e === "overview" ? "/ai-tools" : `/ai-tools/${e}`);
+	}, [O]), W = x((e) => {
+		O(`/ai-tools/sessions/${e}`);
+	}, [O]), G = !!H, [K, q] = C(null), J = x(() => {
+		q(k("ai.pluginInstalled", "Plugin installed. Refreshing…")), console.info("[ai] orchestrator install completed");
+	}, [k]), Y = x(() => {
+		q(k("ai.harnessUpdated", "Harness updated.")), console.info("[ai] harness picker changed");
+	}, [k]);
+	return /* @__PURE__ */ F(I, {
+		className: "space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen",
+		children: [
+			/* @__PURE__ */ P(n, {
+				title: k("nav.ai", "AI"),
+				description: k("ai.description", "Manage AI sessions, prompts, templates, and contexts for your vibecoding workflow")
+			}),
+			/* @__PURE__ */ P("div", {
+				className: "border-b border-border-default -mx-4 sm:-mx-6 px-4 sm:px-6",
+				children: /* @__PURE__ */ P("nav", {
+					className: "flex gap-1 overflow-x-auto pb-1",
+					role: "tablist",
+					children: L.map((e) => {
+						let t = e.icon, n = D === e.id;
+						return /* @__PURE__ */ F("button", {
+							role: "tab",
+							"aria-selected": n,
+							onClick: () => U(e.id),
+							className: `flex shrink-0 items-center gap-1.5 whitespace-nowrap rounded-t-md border-b-2 px-2.5 py-2 text-xs font-medium transition-colors sm:px-3 sm:py-2.5 sm:text-sm ${n ? "border-action-primary-bg text-action-primary-bg" : "border-transparent text-text-secondary hover:text-text-primary hover:border-border-default"}`,
+							children: [/* @__PURE__ */ P(t, { className: "h-3.5 w-3.5 sm:h-4 sm:w-4" }), A(e.id)]
+						}, e.id);
+					})
+				})
+			}),
+			z ? /* @__PURE__ */ P(r, { message: k("agentsPage.loadingAgents", "Loading agents...") }) : B ? /* @__PURE__ */ P(i, {
+				title: k("ai.loadFailed.title", "Could not load the AI workspace"),
+				message: k("ai.loadFailed.message", "We couldn't load the AI workspace. Please try again in a moment."),
+				onRetry: V
+			}) : G ? /* @__PURE__ */ P(l, {
+				agentId: H,
+				children: /* @__PURE__ */ P(c, {
+					agentId: H,
+					required: [o],
+					mode: "all",
+					eyebrow: k("ai.pluginRequired", "AI plugin required"),
+					title: k("ai.installOrchestrator", "Install the AI orchestrator"),
+					description: k("ai.installOrchestratorDesc", "The AI page routes prompts and sessions through the AI orchestrator plugin on your agent. Install it to continue."),
+					onInstalled: J,
+					children: /* @__PURE__ */ F("div", {
+						className: "space-y-6",
+						children: [
+							K && /* @__PURE__ */ P("div", {
+								role: "status",
+								className: "rounded-md border border-status-success-border bg-status-success-bg px-3 py-2 text-xs text-status-success-text",
+								children: K
+							}),
+							/* @__PURE__ */ P(u, {
+								agentId: H,
+								packages: s,
+								title: k("ai.harnessesTitle", "AI harnesses"),
+								description: k("ai.harnessesDesc", "Install and manage the coding-agent harnesses available on this agent. You can install multiple and switch between them per-session."),
+								onChange: Y
+							}),
+							/* @__PURE__ */ F("div", { children: [
+								D === "overview" && /* @__PURE__ */ P(d, {
+									agentId: H,
+									onNavigateToSession: W
+								}),
+								D === "templates" && /* @__PURE__ */ P(f, { agentId: H }),
+								D === "contexts" && /* @__PURE__ */ P(p, { agentId: H }),
+								D === "prompts" && /* @__PURE__ */ P(m, { agentId: H }),
+								D === "sessions" && /* @__PURE__ */ P(h, {
+									agentId: H,
+									onNavigateToSession: W
+								}),
+								D === "tasks" && /* @__PURE__ */ P(g, {}),
+								D === "stats" && /* @__PURE__ */ P(_, { agentId: H }),
+								D === "playground" && /* @__PURE__ */ P(v, { agentId: H }),
+								D === "config" && /* @__PURE__ */ F("div", {
+									className: "space-y-6",
+									children: [/* @__PURE__ */ P(y, { agentId: H }), /* @__PURE__ */ P(b, { agentId: H })]
+								})
+							] })
+						]
+					})
+				})
+			}) : /* @__PURE__ */ P(a, {
+				icon: /* @__PURE__ */ P(j, { className: "w-8 h-8 text-text-secondary" }),
+				title: k("ai.noActiveAgent", "No active agent available"),
+				description: k("ai.noActiveAgentDescription", "AI features require an active agent with a configured tunnel URL and API key. Add an agent or start an existing one."),
+				action: /* @__PURE__ */ P("button", {
+					onClick: () => O("/agents"),
+					className: "px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors text-sm",
+					children: k("ai.goToAgents", "Go to Agents")
+				})
+			})
+		]
+	});
+}
+//#endregion
+export { z as AIPage };
+
+//# sourceMappingURL=AIPage.js.map

package/dist/pages/ai/AIPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AIPage.js","names":[],"sources":["../../../src/pages/ai/AIPage.tsx"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport {\n  LayoutDashboard,\n  FileCode2,\n  FileText,\n  MessageSquare,\n  MessagesSquare,\n  ListTodo,\n  BarChart3,\n  Play,\n} from 'lucide-react';\nimport { MotionPage } from '@burdenoff/fe-libs/shared/motion';\nimport {\n  PageHeader,\n  LoadingState,\n  EmptyState,\n  ErrorState,\n  PluginGate,\n  RequireAgentReachable,\n} from '@/components/shared';\nimport { useVibeNavigate } from '@/providers/VibeControlsProvider';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useCachedInitialData } from '@/hooks/useCachedInitialData';\nimport { AI_CORE_PACKAGE, AI_PROVIDER_PACKAGES } from '@/constants/pluginCatalog';\nimport { PluginHarnessPicker } from '@/components/ai/PluginHarnessPicker';\n\nimport { AIOverviewTab } from '@/components/ai/AIOverviewTab';\nimport { AITemplatesTab } from '@/components/ai/AITemplatesTab';\nimport { AIContextsTab } from '@/components/ai/AIContextsTab';\nimport { AIPromptsTab } from '@/components/ai/AIPromptsTab';\nimport { AISessionsTab } from '@/components/ai/AISessionsTab';\nimport { AITasksTab } from '@/components/ai/AITasksTab';\nimport { AIStatsTab } from '@/components/ai/AIStatsTab';\nimport { AIPlaygroundTab } from '@/components/ai/AIPlaygroundTab';\nimport { ClaudeCredentialsCard } from '@/components/ai/ClaudeCredentialsCard';\nimport { BridleConfigPanel } from '@/components/agent-manager/BridleConfigPanel';\n\ntype AITab =\n  | 'overview'\n  | 'templates'\n  | 'contexts'\n  | 'prompts'\n  | 'sessions'\n  | 'tasks'\n  | 'stats'\n  | 'playground'\n  | 'config';\n\nconst tabs: { id: AITab; icon: typeof LayoutDashboard }[] = [\n  { id: 'overview', icon: LayoutDashboard },\n  { id: 'templates', icon: FileCode2 },\n  { id: 'contexts', icon: FileText },\n  { id: 'prompts', icon: MessageSquare },\n  { id: 'sessions', icon: MessagesSquare },\n  { id: 'tasks', icon: ListTodo },\n  { id: 'stats', icon: BarChart3 },\n  { id: 'playground', icon: Play },\n  { id: 'config', icon: LayoutDashboard },\n];\n\nconst validTabs = new Set<string>(tabs.map((t) => t.id));\n\n/**\n * AI page — tab-based layout for AI / vibecoding features.\n * Reads the :tab param from the URL; defaults to \"overview\".\n */\nexport function AIPage() {\n  const { t } = useI18n();\n  const { tab: tabParam } = useParams<{ tab?: string }>();\n  const activeTab: AITab = tabParam && validTabs.has(tabParam) ? (tabParam as AITab) : 'overview';\n  const handleNavigate = useVibeNavigate();\n\n  const tr = useCallback(\n    (key: string, fallback: string): string => {\n      const value = t(key);\n      return value === key ? fallback : value;\n    },\n    [t]\n  );\n\n  const tabLabel = useCallback(\n    (tabId: AITab): string => {\n      switch (tabId) {\n        case 'overview':\n          return tr('ai.overview', 'Overview');\n        case 'templates':\n          return tr('ai.templates', 'Templates');\n        case 'contexts':\n          return tr('ai.contexts', 'Contexts');\n        case 'prompts':\n          return tr('ai.prompts', 'Prompts');\n        case 'sessions':\n          return tr('nav.sessions', 'Sessions');\n        case 'tasks':\n          return tr('ai.tasks', 'Tasks');\n        case 'stats':\n          return tr('ai.stats', 'Stats');\n        case 'playground':\n          return tr('ai.playground', 'Playground');\n        case 'config':\n          return tr('ai.config', 'Config');\n        default:\n          return tabId;\n      }\n    },\n    [tr]\n  );\n\n  const { agents, loading: agentsLoading, error: agentsError, refetch } = useCachedInitialData();\n\n  // If the initial data query throws (e.g. gateway query-cost limit, network\n  // error, transient federation issue), surface a friendly fallback rather\n  // than the raw GraphQL error. The technical details still go to the console\n  // for debuggability — without PII, since the error message itself never\n  // contains secrets.\n  if (agentsError) {\n    // eslint-disable-next-line no-console -- intentional debug breadcrumb for failed AI workspace load\n    console.error('[ai] failed to load initial workspace data', agentsError);\n  }\n  const activeAgent = useMemo(\n    () => agents.find((agent) => agent.isActive && agent.tunnelUrl && agent.agentApiKey) ?? null,\n    [agents]\n  );\n  const agentId = activeAgent?.id ?? '';\n\n  const switchTab = useCallback(\n    (tab: AITab) => {\n      handleNavigate(tab === 'overview' ? '/ai-tools' : `/ai-tools/${tab}`);\n    },\n    [handleNavigate]\n  );\n\n  const navigateToSession = useCallback(\n    (sessionId: string) => {\n      handleNavigate(`/ai-tools/sessions/${sessionId}`);\n    },\n    [handleNavigate]\n  );\n\n  const hasAgent = !!agentId;\n\n  // Surface install lifecycle for debuggability. PluginGate / PluginHarnessPicker\n  // already render inline error chips, but a console breadcrumb + a top-level\n  // banner helps when the install actually succeeds on the agent but a stale\n  // detection cache hides the success — without this the install button looked\n  // like it silently swallowed errors.\n  const [lastInstallNote, setLastInstallNote] = useState<string | null>(null);\n  const handleInstalled = useCallback(() => {\n    setLastInstallNote(tr('ai.pluginInstalled', 'Plugin installed. Refreshing…'));\n    // eslint-disable-next-line no-console -- intentional install breadcrumb\n    console.info('[ai] orchestrator install completed');\n  }, [tr]);\n  const handleHarnessChange = useCallback(() => {\n    setLastInstallNote(tr('ai.harnessUpdated', 'Harness updated.'));\n    // eslint-disable-next-line no-console -- intentional install breadcrumb\n    console.info('[ai] harness picker changed');\n  }, [tr]);\n\n  return (\n    <MotionPage className=\"space-y-6 p-4 sm:p-6 bg-bg-surface min-h-screen\">\n      <PageHeader\n        title={tr('nav.ai', 'AI')}\n        description={tr(\n          'ai.description',\n          'Manage AI sessions, prompts, templates, and contexts for your vibecoding workflow'\n        )}\n      />\n\n      {/* Tab Navigation */}\n      <div className=\"border-b border-border-default -mx-4 sm:-mx-6 px-4 sm:px-6\">\n        <nav className=\"flex gap-1 overflow-x-auto pb-1\" role=\"tablist\">\n          {tabs.map((tab) => {\n            const Icon = tab.icon;\n            const isActive = activeTab === tab.id;\n            return (\n              <button\n                key={tab.id}\n                role=\"tab\"\n                aria-selected={isActive}\n                onClick={() => switchTab(tab.id)}\n                className={`flex shrink-0 items-center gap-1.5 whitespace-nowrap rounded-t-md border-b-2 px-2.5 py-2 text-xs font-medium transition-colors sm:px-3 sm:py-2.5 sm:text-sm ${\n                  isActive\n                    ? 'border-action-primary-bg text-action-primary-bg'\n                    : 'border-transparent text-text-secondary hover:text-text-primary hover:border-border-default'\n                }`}\n              >\n                <Icon className=\"h-3.5 w-3.5 sm:h-4 sm:w-4\" />\n                {tabLabel(tab.id)}\n              </button>\n            );\n          })}\n        </nav>\n      </div>\n\n      {/* Content */}\n      {agentsLoading ? (\n        <LoadingState message={tr('agentsPage.loadingAgents', 'Loading agents...')} />\n      ) : agentsError ? (\n        <ErrorState\n          title={tr('ai.loadFailed.title', 'Could not load the AI workspace')}\n          message={tr(\n            'ai.loadFailed.message',\n            \"We couldn't load the AI workspace. Please try again in a moment.\"\n          )}\n          onRetry={refetch}\n        />\n      ) : !hasAgent ? (\n        <EmptyState\n          icon={<MessagesSquare className=\"w-8 h-8 text-text-secondary\" />}\n          title={tr('ai.noActiveAgent', 'No active agent available')}\n          description={tr(\n            'ai.noActiveAgentDescription',\n            'AI features require an active agent with a configured tunnel URL and API key. Add an agent or start an existing one.'\n          )}\n          action={\n            <button\n              onClick={() => handleNavigate('/agents')}\n              className=\"px-4 py-2 bg-action-primary-bg text-action-primary-text rounded-md hover:bg-action-primary-bg-hover transition-colors text-sm\"\n            >\n              {tr('ai.goToAgents', 'Go to Agents')}\n            </button>\n          }\n        />\n      ) : (\n        <RequireAgentReachable agentId={agentId}>\n          <PluginGate\n            agentId={agentId}\n            required={[AI_CORE_PACKAGE]}\n            mode=\"all\"\n            eyebrow={tr('ai.pluginRequired', 'AI plugin required')}\n            title={tr('ai.installOrchestrator', 'Install the AI orchestrator')}\n            description={tr(\n              'ai.installOrchestratorDesc',\n              'The AI page routes prompts and sessions through the AI orchestrator plugin on your agent. Install it to continue.'\n            )}\n            onInstalled={handleInstalled}\n          >\n            <div className=\"space-y-6\">\n              {lastInstallNote && (\n                <div\n                  role=\"status\"\n                  className=\"rounded-md border border-status-success-border bg-status-success-bg px-3 py-2 text-xs text-status-success-text\"\n                >\n                  {lastInstallNote}\n                </div>\n              )}\n              <PluginHarnessPicker\n                agentId={agentId}\n                packages={AI_PROVIDER_PACKAGES}\n                title={tr('ai.harnessesTitle', 'AI harnesses')}\n                description={tr(\n                  'ai.harnessesDesc',\n                  'Install and manage the coding-agent harnesses available on this agent. You can install multiple and switch between them per-session.'\n                )}\n                onChange={handleHarnessChange}\n              />\n              <div>\n                {activeTab === 'overview' && (\n                  <AIOverviewTab agentId={agentId} onNavigateToSession={navigateToSession} />\n                )}\n                {activeTab === 'templates' && <AITemplatesTab agentId={agentId} />}\n                {activeTab === 'contexts' && <AIContextsTab agentId={agentId} />}\n                {activeTab === 'prompts' && <AIPromptsTab agentId={agentId} />}\n                {activeTab === 'sessions' && (\n                  <AISessionsTab agentId={agentId} onNavigateToSession={navigateToSession} />\n                )}\n                {activeTab === 'tasks' && <AITasksTab />}\n                {activeTab === 'stats' && <AIStatsTab agentId={agentId} />}\n                {activeTab === 'playground' && <AIPlaygroundTab agentId={agentId} />}\n                {activeTab === 'config' && (\n                  <div className=\"space-y-6\">\n                    <ClaudeCredentialsCard agentId={agentId} />\n                    <BridleConfigPanel agentId={agentId} />\n                  </div>\n                )}\n              </div>\n            </div>\n          </PluginGate>\n        </RequireAgentReachable>\n      )}\n    </MotionPage>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/ai/AISessionDetailPage.d.ts

@@ -0,0 +1,5 @@
+/**
+ * AI session detail page with Chat, Logs, Stats, and Config tabs.
+ */
+export declare function AISessionDetailPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AISessionDetailPage.d.ts.map

package/dist/pages/ai/AISessionDetailPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AISessionDetailPage.d.ts","sourceRoot":"","sources":["../../../src/pages/ai/AISessionDetailPage.tsx"],"names":[],"mappings":"AA8DA;;GAEG;AACH,wBAAgB,mBAAmB,4CAkdlC"}