Switch to Installed tab from Marketplace sidebar

src/renderer/src/components/sidebar/AgentItem.browser.test.tsx

@@ -160,3 +160,19 @@ describe('Sidebar → AgentItem context menu', () => {
     })
   })
 })
+
+describe('Sidebar → AgentItem navigation', () => {
+  it('switches Marketplace back to Installed when an installed agent is clicked', async () => {
+    const { screen, store } = await renderItem([])
+    const { setActiveTab } = await import('@/renderer/src/redux/slices/uiSlice')
+
+    store.dispatch(setActiveTab('marketplace'))
+
+    await screen
+      .getByRole('button', { name: /Filter skills by Claude Code/i })
+      .click()
+
+    expect(store.getState().ui.activeTab).toBe('installed')
+    expect(store.getState().ui.selectedAgentId).toBe('claude-code')
+  })
+})

src/renderer/src/components/sidebar/AgentItem.tsx

@@ -21,6 +21,7 @@ import { setAgentToDelete } from '@/renderer/src/redux/slices/agentsSlice'
 import { selectHiddenAgentIds } from '@/renderer/src/redux/slices/settingsSlice'
 import {
   selectAgent,
+  setActiveTab,
   setCleanupAgentTarget,
 } from '@/renderer/src/redux/slices/uiSlice'
 import { AGENT_DEFINITIONS } from '@/shared/constants'
@@ -89,6 +90,9 @@ export const AgentItem = React.memo(function AgentItem({
 
   const handleClick = (): void => {
     if (!agent.exists) return
+    // Sidebar agent navigation always targets the installed-skills list, even
+    // when the user is currently browsing Marketplace discovery.
+    dispatch(setActiveTab('installed'))
     dispatch(selectAgent(isSelected ? null : agent.id))
   }
 

src/renderer/src/components/sidebar/SourceCard.browser.test.tsx

@@ -0,0 +1,98 @@
+import { configureStore } from '@reduxjs/toolkit'
+import { Provider } from 'react-redux'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { render } from 'vitest-browser-react'
+
+const mockSourceGetStats = vi.fn()
+const mockSkillsGetAll = vi.fn()
+const mockAgentsGetAll = vi.fn()
+const mockRevealInFinder = vi.fn()
+const mockOpenInTerminal = vi.fn()
+
+beforeEach(() => {
+  mockSourceGetStats.mockReset()
+  mockSourceGetStats.mockResolvedValue({
+    path: '/Users/test/.agents/skills',
+    skillCount: 2,
+    totalSize: '4 KB',
+  })
+  mockSkillsGetAll.mockReset()
+  mockSkillsGetAll.mockResolvedValue([])
+  mockAgentsGetAll.mockReset()
+  mockAgentsGetAll.mockResolvedValue([])
+  mockRevealInFinder.mockReset()
+  mockRevealInFinder.mockResolvedValue({ ok: true })
+  mockOpenInTerminal.mockReset()
+  mockOpenInTerminal.mockResolvedValue({ ok: true })
+  // SourceCard's mount effect reads source stats through the preload bridge;
+  // browser-mode tests replace that bridge, so each IPC surface is stubbed.
+  vi.stubGlobal('electron', {
+    source: {
+      getStats: mockSourceGetStats,
+    },
+    skills: {
+      getAll: mockSkillsGetAll,
+    },
+    agents: {
+      getAll: mockAgentsGetAll,
+    },
+    folder: {
+      revealInFinder: mockRevealInFinder,
+      openInTerminal: mockOpenInTerminal,
+    },
+  })
+})
+
+afterEach(() => {
+  vi.unstubAllGlobals()
+})
+
+/**
+ * Build the narrow store SourceCard reads and dispatches through.
+ * @returns Redux store with real ui, skills, and agents reducers.
+ */
+async function createStore() {
+  const { default: uiReducer } =
+    await import('@/renderer/src/redux/slices/uiSlice')
+  const { default: skillsReducer } =
+    await import('@/renderer/src/redux/slices/skillsSlice')
+  const { default: agentsReducer } =
+    await import('@/renderer/src/redux/slices/agentsSlice')
+
+  return configureStore({
+    reducer: {
+      ui: uiReducer,
+      skills: skillsReducer,
+      agents: agentsReducer,
+    },
+  })
+}
+
+async function renderSourceCard() {
+  const store = await createStore()
+  const { SourceCard } = await import('./SourceCard')
+  const screen = await render(
+    <Provider store={store}>
+      <SourceCard />
+    </Provider>,
+  )
+  return { screen, store }
+}
+
+describe('Sidebar → SourceCard navigation', () => {
+  it('switches Marketplace back to Installed and clears filters when clicked', async () => {
+    const { screen, store } = await renderSourceCard()
+    const { selectAgent, setActiveTab, setSearchQuery } =
+      await import('@/renderer/src/redux/slices/uiSlice')
+
+    store.dispatch(setActiveTab('marketplace'))
+    store.dispatch(selectAgent('claude-code'))
+    store.dispatch(setSearchQuery('task'))
+
+    await screen.getByText('~/.agents/skills').click()
+
+    expect(store.getState().ui.activeTab).toBe('installed')
+    expect(store.getState().ui.selectedAgentId).toBeNull()
+    expect(store.getState().ui.searchQuery).toBe('')
+  })
+})

src/renderer/src/components/sidebar/SourceCard.tsx

@@ -28,6 +28,7 @@ import {
   fetchSourceStats,
   fetchSyncPreview,
   selectAgent,
+  setActiveTab,
   setSearchQuery,
   setSyncPreview,
 } from '@/renderer/src/redux/slices/uiSlice'
@@ -64,6 +65,9 @@ export const SourceCard = React.memo(function SourceCard(): React.ReactElement {
    * Click path text → clear all filters and show all skills
    */
   const handlePathClick = useCallback((): void => {
+    // Source-card navigation is the sidebar's universal installed-skills view,
+    // so it leaves Marketplace before clearing filters.
+    dispatch(setActiveTab('installed'))
     dispatch(selectAgent(null))
     dispatch(setSearchQuery(''))
   }, [dispatch])