bingocode 1.0.3 → 1.0.4

package/desktop/src/__tests__/agentsSettings.test.tsx

@@ -1,349 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest'
-import { fireEvent, render, screen } from '@testing-library/react'
-import '@testing-library/jest-dom'
-
-import { Settings } from '../pages/Settings'
-import { useAgentStore } from '../stores/agentStore'
-import { useSkillStore } from '../stores/skillStore'
-import { useSettingsStore } from '../stores/settingsStore'
-import { useSessionStore } from '../stores/sessionStore'
-import { SETTINGS_TAB_ID, useTabStore } from '../stores/tabStore'
-
-vi.mock('../api/agents', () => ({
-  agentsApi: {
-    list: vi.fn().mockResolvedValue({ activeAgents: [], allAgents: [] }),
-  },
-}))
-
-const noopFetch = vi.fn()
-
-vi.mock('../stores/providerStore', () => ({
-  useProviderStore: () => ({
-    providers: [],
-    activeId: null,
-    isLoading: false,
-    fetchProviders: vi.fn(),
-    deleteProvider: vi.fn(),
-    activateProvider: vi.fn(),
-    activateOfficial: vi.fn(),
-    testProvider: vi.fn(),
-    createProvider: vi.fn(),
-    updateProvider: vi.fn(),
-    testConfig: vi.fn(),
-  }),
-}))
-
-vi.mock('../pages/AdapterSettings', () => ({
-  AdapterSettings: () => <div>Adapter Settings Mock</div>,
-}))
-
-vi.mock('../components/chat/CodeViewer', () => ({
-  CodeViewer: ({ code }: { code: string }) => <pre data-testid="code-viewer">{code}</pre>,
-}))
-
-const MOCK_AGENTS = [
-  {
-    agentType: 'code-reviewer',
-    description: 'Reviews code for quality and security',
-    model: 'claude-sonnet-4-6',
-    modelDisplay: 'claude-sonnet-4-6',
-    tools: ['Read', 'Grep', 'Glob'],
-    systemPrompt: '# Code Reviewer\n\nYou are an expert code reviewer.',
-    color: 'blue',
-    source: 'userSettings' as const,
-    baseDir: '~/.claude/agents',
-    isActive: true,
-  },
-  {
-    agentType: 'doc-writer',
-    description: 'Writes technical documentation',
-    model: 'claude-haiku-4-5',
-    modelDisplay: 'claude-haiku-4-5',
-    tools: ['Read'],
-    systemPrompt: 'You write clear and concise docs.',
-    color: 'green',
-    source: 'built-in' as const,
-    baseDir: 'built-in',
-    isActive: true,
-  },
-  {
-    agentType: 'plain-agent',
-    description: undefined,
-    model: undefined,
-    modelDisplay: 'inherit',
-    tools: undefined,
-    systemPrompt: undefined,
-    color: undefined,
-    source: 'projectSettings' as const,
-    baseDir: '/workspace/project/.claude/agents',
-    isActive: false,
-    overriddenBy: 'userSettings' as const,
-  },
-]
-
-const MOCK_SKILL_DETAIL = {
-  meta: {
-    name: 'skill-docs',
-    displayName: 'Skill Docs',
-    description: 'A rich skill readme',
-    source: 'user' as const,
-    userInvocable: true,
-    contentLength: 200,
-    hasDirectory: true,
-  },
-  tree: [
-    { name: 'SKILL.md', path: 'SKILL.md', type: 'file' as const },
-    { name: 'helper.ts', path: 'helper.ts', type: 'file' as const },
-  ],
-  files: [
-    {
-      path: 'SKILL.md',
-      language: 'markdown',
-      content: '# Heading\n\nParagraph with `inline code`.\n\n## Section\n\n- First item\n- Second item\n\n> Helpful quote',
-      body: '# Heading\n\nParagraph with `inline code`.\n\n## Section\n\n- First item\n- Second item\n\n> Helpful quote',
-      isEntry: true,
-      frontmatter: {
-        description: 'A rich skill readme',
-        model: 'sonnet',
-      },
-    },
-    {
-      path: 'helper.ts',
-      language: 'typescript',
-      content: 'export const helper = true',
-      isEntry: false,
-    },
-  ],
-  skillRoot: '/tmp/skill-docs',
-}
-
-function switchToAgentsTab() {
-  fireEvent.click(screen.getByText('Agents'))
-}
-
-function switchToSkillsTab() {
-  fireEvent.click(screen.getByText('Skills'))
-}
-
-describe('Settings > Agents tab', () => {
-  beforeEach(() => {
-    useSettingsStore.setState({ locale: 'en' })
-    useTabStore.setState({
-      activeTabId: 'session-1',
-      tabs: [{ sessionId: 'session-1', title: 'Test', type: 'session', status: 'idle' }],
-    })
-    useSessionStore.setState({
-      sessions: [
-        {
-          id: 'session-1',
-          title: 'Test Session',
-          createdAt: '',
-          modifiedAt: '',
-          messageCount: 0,
-          projectPath: '/workspace/project',
-          workDir: '/workspace/project',
-          workDirExists: true,
-        },
-      ],
-      activeSessionId: 'session-1',
-      isLoading: false,
-      error: null,
-      selectedProjects: [],
-      availableProjects: [],
-      fetchSessions: noopFetch,
-      createSession: vi.fn(),
-      deleteSession: vi.fn(),
-      renameSession: vi.fn(),
-      updateSessionTitle: vi.fn(),
-      setActiveSession: vi.fn(),
-      setSelectedProjects: vi.fn(),
-    })
-    useAgentStore.setState({
-      activeAgents: [],
-      allAgents: [],
-      isLoading: false,
-      error: null,
-      selectedAgent: null,
-      fetchAgents: noopFetch,
-      selectAgent: (agent) => useAgentStore.setState({ selectedAgent: agent }),
-    })
-    useSkillStore.setState({
-      skills: [],
-      selectedSkill: null,
-      isLoading: false,
-      isDetailLoading: false,
-      error: null,
-      fetchSkills: noopFetch,
-      fetchSkillDetail: noopFetch,
-      clearSelection: () => useSkillStore.setState({ selectedSkill: null }),
-    })
-  })
-
-  it('renders the Agents tab button in sidebar', () => {
-    render(<Settings />)
-    expect(screen.getByText('Agents')).toBeInTheDocument()
-  })
-
-  it('shows loading spinner when fetching agents', () => {
-    useAgentStore.setState({ isLoading: true, allAgents: [], activeAgents: [], fetchAgents: noopFetch })
-    render(<Settings />)
-    switchToAgentsTab()
-
-    const spinner = document.querySelector('.animate-spin')
-    expect(spinner).toBeInTheDocument()
-  })
-
-  it('uses the active session workDir even when settings tab is focused', async () => {
-    const fetchAgents = vi.fn()
-    useAgentStore.setState({
-      allAgents: [],
-      activeAgents: [],
-      isLoading: false,
-      fetchAgents,
-    })
-    useTabStore.setState({
-      activeTabId: SETTINGS_TAB_ID,
-      tabs: [{ sessionId: SETTINGS_TAB_ID, title: 'Settings', type: 'settings', status: 'idle' }],
-    })
-
-    render(<Settings />)
-    switchToAgentsTab()
-
-    expect(fetchAgents).toHaveBeenCalledWith('/workspace/project')
-  })
-
-  it('shows error state with retry button when API fails', () => {
-    useAgentStore.setState({ allAgents: [], activeAgents: [], isLoading: false, error: 'Network error', fetchAgents: noopFetch })
-    render(<Settings />)
-    switchToAgentsTab()
-
-    expect(screen.getByText('Network error')).toBeInTheDocument()
-    expect(screen.getByText('Retry')).toBeInTheDocument()
-  })
-
-  it('renders grouped agent browser with source sections', () => {
-    useAgentStore.setState({
-      allAgents: MOCK_AGENTS,
-      activeAgents: MOCK_AGENTS.filter((agent) => agent.isActive),
-      isLoading: false,
-      fetchAgents: noopFetch,
-    })
-    render(<Settings />)
-    switchToAgentsTab()
-
-    expect(screen.getByText('Browse installed agents')).toBeInTheDocument()
-    expect(screen.getByText('Agent Browser')).toBeInTheDocument()
-    expect(screen.getAllByText('User').length).toBeGreaterThan(0)
-    expect(screen.getAllByText('Built-in').length).toBeGreaterThan(0)
-    expect(screen.getAllByText('Project').length).toBeGreaterThan(0)
-    expect(screen.getByText('code-reviewer')).toBeInTheDocument()
-    expect(screen.getByText('Writes technical documentation')).toBeInTheDocument()
-    expect(screen.getByText('Overridden by User')).toBeInTheDocument()
-  })
-
-  it('opens agent detail with metadata cards and document prompt', () => {
-    useAgentStore.setState({
-      allAgents: MOCK_AGENTS,
-      activeAgents: MOCK_AGENTS.filter((agent) => agent.isActive),
-      isLoading: false,
-      fetchAgents: noopFetch,
-    })
-    render(<Settings />)
-    switchToAgentsTab()
-
-    fireEvent.click(screen.getByText('code-reviewer'))
-
-    expect(screen.getByText('Back to list')).toBeInTheDocument()
-    expect(screen.getByText('Agent Profile')).toBeInTheDocument()
-    expect(screen.getAllByText('claude-sonnet-4-6')[0]).toBeInTheDocument()
-    expect(screen.getByText('Read')).toBeInTheDocument()
-    expect(screen.getByRole('heading', { name: 'Code Reviewer' })).toBeInTheDocument()
-
-    const rendererRoot = screen.getByRole('heading', { name: 'Code Reviewer' }).closest('div[class*="prose"]')
-    expect(rendererRoot?.className).toContain('max-w-[72ch]')
-  })
-
-  it('shows no system prompt state when agent has no prompt', () => {
-    useAgentStore.setState({
-      allAgents: MOCK_AGENTS,
-      activeAgents: MOCK_AGENTS.filter((agent) => agent.isActive),
-      isLoading: false,
-      fetchAgents: noopFetch,
-    })
-    render(<Settings />)
-    switchToAgentsTab()
-
-    fireEvent.click(screen.getByText('plain-agent'))
-
-    expect(screen.getByText('No system prompt defined.')).toBeInTheDocument()
-    expect(screen.getByText('shadowed by User')).toBeInTheDocument()
-  })
-
-  it('navigates back to list from detail view', () => {
-    useAgentStore.setState({
-      allAgents: MOCK_AGENTS,
-      activeAgents: MOCK_AGENTS.filter((agent) => agent.isActive),
-      isLoading: false,
-      fetchAgents: noopFetch,
-    })
-    render(<Settings />)
-    switchToAgentsTab()
-
-    fireEvent.click(screen.getByText('code-reviewer'))
-    fireEvent.click(screen.getByText('Back to list'))
-
-    expect(screen.getByText('code-reviewer')).toBeInTheDocument()
-    expect(screen.getByText('doc-writer')).toBeInTheDocument()
-    expect(screen.getByText('plain-agent')).toBeInTheDocument()
-  })
-})
-
-describe('Settings > Skills tab', () => {
-  beforeEach(() => {
-    useSettingsStore.setState({ locale: 'en' })
-    useSkillStore.setState({
-      skills: [],
-      selectedSkill: null,
-      isLoading: false,
-      isDetailLoading: false,
-      error: null,
-      fetchSkills: noopFetch,
-      fetchSkillDetail: noopFetch,
-      clearSelection: () => useSkillStore.setState({ selectedSkill: null }),
-    })
-  })
-
-  it('renders markdown skills with document styling in detail view', () => {
-    useSkillStore.setState({
-      selectedSkill: MOCK_SKILL_DETAIL,
-      clearSelection: () => useSkillStore.setState({ selectedSkill: null }),
-    })
-
-    render(<Settings />)
-    switchToSkillsTab()
-
-    expect(screen.getByText('Skill metadata')).toBeInTheDocument()
-    expect(screen.getByRole('heading', { name: 'Heading' })).toBeInTheDocument()
-
-    const rendererRoot = screen.getByRole('heading', { name: 'Heading' }).closest('div[class*="prose"]')
-    expect(rendererRoot?.className).toContain('max-w-[72ch]')
-    expect(rendererRoot?.className).toContain('prose-h2:border-b')
-    expect(rendererRoot?.className).toContain('prose-p:text-[15px]')
-    expect(screen.getByText('Helpful quote')).toBeInTheDocument()
-  })
-
-  it('keeps code files rendered in CodeViewer instead of markdown prose', () => {
-    useSkillStore.setState({
-      selectedSkill: MOCK_SKILL_DETAIL,
-      clearSelection: () => useSkillStore.setState({ selectedSkill: null }),
-    })
-
-    render(<Settings />)
-    switchToSkillsTab()
-
-    fireEvent.click(screen.getAllByText('helper.ts')[0]!)
-
-    expect(screen.getByTestId('code-viewer')).toHaveTextContent('export const helper = true')
-    expect(screen.queryByRole('heading', { name: 'Heading' })).not.toBeInTheDocument()
-  })
-})

package/desktop/src/__tests__/pages.test.tsx

@@ -1,290 +0,0 @@
-import { describe, it, expect, vi } from 'vitest'
-import { fireEvent, render, screen } from '@testing-library/react'
-import '@testing-library/jest-dom'
-
-import { skillsApi } from '../api/skills'
-
-vi.mock('../api/skills', () => ({
-  skillsApi: {
-    list: vi.fn(async () => ({ skills: [] })),
-  },
-}))
-
-// Import all pages
-import { EmptySession } from '../pages/EmptySession'
-import { ActiveSession } from '../pages/ActiveSession'
-import { AgentTeams } from '../pages/AgentTeams'
-import { ScheduledTasks } from '../pages/ScheduledTasks'
-import { ToolInspection } from '../pages/ToolInspection'
-
-// Layout components (chrome is now here, not in pages)
-import { Sidebar } from '../components/layout/Sidebar'
-import { UserMessage } from '../components/chat/UserMessage'
-import { useChatStore } from '../stores/chatStore'
-import { useSessionStore } from '../stores/sessionStore'
-import { useTabStore } from '../stores/tabStore'
-
-/**
- * Core rendering tests: content-only pages must render without crashing
- * and contain key structural elements from the prototype.
- */
-describe('Content-only pages render without errors', () => {
-  it('EmptySession slash picker includes dynamic skills before the first session starts', async () => {
-    vi.mocked(skillsApi.list).mockResolvedValueOnce({
-      skills: [
-        {
-          name: 'lark-mail',
-          description: 'Draft, send, and search emails',
-          source: 'user',
-          userInvocable: true,
-          contentLength: 120,
-          hasDirectory: true,
-        },
-        {
-          name: 'internal-only',
-          description: 'Should stay hidden',
-          source: 'user',
-          userInvocable: false,
-          contentLength: 60,
-          hasDirectory: true,
-        },
-      ],
-    })
-
-    render(<EmptySession />)
-
-    fireEvent.change(screen.getByRole('textbox'), {
-      target: { value: '/', selectionStart: 1 },
-    })
-
-    expect(await screen.findByText('/lark-mail')).toBeInTheDocument()
-    expect(screen.queryByText('/internal-only')).not.toBeInTheDocument()
-  })
-
-  it('EmptySession renders mascot and composer', () => {
-    const { container } = render(<EmptySession />)
-    expect(container.querySelector('textarea')).toBeInTheDocument()
-    expect(container.innerHTML).toContain('New session')
-    expect(container.innerHTML).toContain('Ask anything')
-  })
-
-  it('EmptySession plus menu exposes uploads and slash commands before chat starts', () => {
-    render(<EmptySession />)
-    fireEvent.click(screen.getByRole('button', { name: 'Open composer tools' }))
-    expect(screen.getByText('Add files or photos')).toBeInTheDocument()
-    expect(screen.getByText('Slash commands')).toBeInTheDocument()
-  })
-
-  it('ActiveSession renders with chat components', () => {
-    const SESSION_ID = 'test-active-session'
-    useTabStore.setState({ tabs: [{ sessionId: SESSION_ID, title: 'Test', type: 'session' as const, status: 'idle' }], activeTabId: SESSION_ID })
-    useChatStore.setState({
-      sessions: {
-        [SESSION_ID]: {
-          messages: [],
-          chatState: 'idle',
-          connectionState: 'connected',
-          streamingText: '',
-          streamingToolInput: '',
-          activeToolUseId: null,
-          activeToolName: null,
-          activeThinkingId: null,
-          pendingPermission: null,
-          pendingComputerUsePermission: null,
-          tokenUsage: { input_tokens: 0, output_tokens: 0 },
-          elapsedSeconds: 0,
-          statusVerb: '',
-          slashCommands: [],
-          agentTaskNotifications: {},
-          elapsedTimer: null,
-        },
-      },
-    })
-    const { container } = render(<ActiveSession />)
-    // With empty messages, the hero is shown
-    expect(container.innerHTML).toContain('New session')
-    // ChatInput has a textarea
-    const textarea = container.querySelector('textarea')
-    expect(textarea).toBeInTheDocument()
-    expect(textarea).toHaveAttribute('placeholder', 'Ask anything...')
-    expect(textarea).toHaveAttribute('rows', '2')
-    expect(container.innerHTML).not.toContain('Preview')
-    // Cleanup
-    useTabStore.setState({ tabs: [], activeTabId: null })
-    useChatStore.setState({ sessions: {} })
-  })
-
-  it('ActiveSession keeps the compact composer once messages exist', () => {
-    const SESSION_ID = 'test-active-session-with-messages'
-    useTabStore.setState({ tabs: [{ sessionId: SESSION_ID, title: 'Test', type: 'session' as const, status: 'idle' }], activeTabId: SESSION_ID })
-    useChatStore.setState({
-      sessions: {
-        [SESSION_ID]: {
-          messages: [{
-            id: 'msg-1',
-            type: 'user_text',
-            content: 'hello',
-            timestamp: Date.now(),
-          }],
-          chatState: 'idle',
-          connectionState: 'connected',
-          streamingText: '',
-          streamingToolInput: '',
-          activeToolUseId: null,
-          activeToolName: null,
-          activeThinkingId: null,
-          pendingPermission: null,
-          pendingComputerUsePermission: null,
-          tokenUsage: { input_tokens: 0, output_tokens: 0 },
-          elapsedSeconds: 0,
-          statusVerb: '',
-          slashCommands: [],
-          agentTaskNotifications: {},
-          elapsedTimer: null,
-        },
-      },
-    })
-    useSessionStore.setState({
-      sessions: [{
-        id: SESSION_ID,
-        title: 'Test',
-        createdAt: '2026-04-10T00:00:00.000Z',
-        modifiedAt: '2026-04-10T00:00:00.000Z',
-        messageCount: 1,
-        projectPath: '',
-        workDir: null,
-        workDirExists: true,
-      }],
-      activeSessionId: SESSION_ID,
-      isLoading: false,
-      error: null,
-    })
-
-    render(<ActiveSession />)
-
-    const textarea = screen.getByPlaceholderText('Ask Claude to edit, debug or explain...')
-    expect(textarea).toHaveAttribute('rows', '1')
-
-    useTabStore.setState({ tabs: [], activeTabId: null })
-    useSessionStore.setState({ sessions: [], activeSessionId: null, isLoading: false, error: null })
-    useChatStore.setState({ sessions: {} })
-  })
-
-  it('ActiveSession shows a single primary action button while a turn is active', () => {
-    useTabStore.setState({ activeTabId: 'active-tab', tabs: [{ sessionId: 'active-tab', title: 'Test', type: 'session' as const, status: 'idle' }] })
-    useChatStore.setState({
-      sessions: {
-        'active-tab': {
-          messages: [],
-          chatState: 'thinking',
-          connectionState: 'connected',
-          streamingText: '',
-          streamingToolInput: '',
-          activeToolUseId: null,
-          activeToolName: null,
-          activeThinkingId: null,
-          pendingPermission: null,
-          pendingComputerUsePermission: null,
-          tokenUsage: { input_tokens: 0, output_tokens: 0 },
-          elapsedSeconds: 0,
-          statusVerb: '',
-          slashCommands: [],
-          agentTaskNotifications: {},
-          elapsedTimer: null,
-        },
-      },
-    })
-    render(<ActiveSession />)
-
-    expect(screen.getByRole('button', { name: /stop/i })).toBeInTheDocument()
-    expect(screen.queryByRole('button', { name: /^run$/i })).not.toBeInTheDocument()
-    useChatStore.setState({ sessions: {} })
-  })
-
-  it('AgentTeams renders team strip and members', () => {
-    const { container } = render(<AgentTeams />)
-    expect(container.innerHTML).toContain('Architect')
-    expect(container.innerHTML).toContain('session-dev')
-    expect(container.innerHTML).toContain('groups')
-  })
-
-  it('ScheduledTasks renders (store-connected)', async () => {
-    const { container } = render(<ScheduledTasks />)
-    await screen.findByText('Scheduled tasks')
-    expect(container.innerHTML).toContain('Scheduled tasks')
-  })
-
-  it('ToolInspection renders diff viewer', () => {
-    const { container } = render(<ToolInspection />)
-    expect(container.innerHTML).toContain('edit_file')
-    expect(container.innerHTML).toContain('Split')
-    expect(container.innerHTML).toContain('Unified')
-  })
-})
-
-describe('Chat attachments', () => {
-  it('UserMessage opens image gallery when an attachment is clicked', () => {
-    render(
-      <UserMessage
-        content=""
-        attachments={[
-          {
-            type: 'image',
-            name: 'diagram.png',
-            data: 'data:image/png;base64,abc123',
-          },
-        ]}
-      />,
-    )
-
-    fireEvent.click(screen.getByRole('button'))
-    expect(screen.getByText('diagram.png')).toBeInTheDocument()
-  })
-})
-
-describe('AppShell layout renders chrome', () => {
-  it('AppShell renders sidebar and session shell', () => {
-    const { container } = render(<Sidebar />)
-    expect(container.querySelector('aside')).toBeInTheDocument()
-    expect(container.innerHTML).toContain('New session')
-    expect(container.innerHTML).toContain('Scheduled')
-    expect(container.innerHTML).toContain('All projects')
-  })
-})
-
-describe('Design system compliance', () => {
-  it('Pages use Material Symbols Outlined icons', () => {
-    const pages = [EmptySession, AgentTeams, ToolInspection]
-    for (const Page of pages) {
-      const { container, unmount } = render(<Page />)
-      const icons = container.querySelectorAll('.material-symbols-outlined')
-      expect(icons.length).toBeGreaterThan(0)
-      unmount()
-    }
-  })
-
-  it('Current brand color is used in content pages', () => {
-    const pages = [EmptySession]
-    for (const Page of pages) {
-      const { container, unmount } = render(<Page />)
-      const html = container.innerHTML
-      expect(
-        html.includes('C47A5A') ||
-        html.includes('8F482F') ||
-        html.includes('var(--color-brand)') ||
-        html.includes('bg-[var(--color-brand)]'),
-      ).toBe(true)
-      unmount()
-    }
-  })
-})
-
-describe('Mock data integration', () => {
-  it('AgentTeams shows team members from mock data', () => {
-    const { container } = render(<AgentTeams />)
-    expect(container.innerHTML).toContain('Architect')
-    expect(container.innerHTML).toContain('Frontend Dev')
-    expect(container.innerHTML).toContain('Backend Dev')
-    expect(container.innerHTML).toContain('Tester')
-  })
-})