test(frontend): add failing tests for step 11 — pages, components, and API modules

frontend/src/__tests__/api/authApi.test.ts

@@ -0,0 +1,40 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import apiClient from '@/api/apiClient'
+import { login, logout, getMe } from '@/api/authApi'
+
+vi.mock('@/api/apiClient', () => ({
+  default: {
+    post: vi.fn(),
+    get: vi.fn(),
+  },
+}))
+
+const mockedApiClient = apiClient as {
+  post: ReturnType<typeof vi.fn>
+  get: ReturnType<typeof vi.fn>
+}
+
+beforeEach(() => {
+  vi.clearAllMocks()
+})
+
+describe('authApi', () => {
+  it('should_callLoginEndpoint_when_loginCalled', async () => {
+    mockedApiClient.post.mockResolvedValue({ data: {} })
+    await login({ password: 'secret' })
+    expect(mockedApiClient.post).toHaveBeenCalledWith('/auth/login', { password: 'secret' })
+  })
+
+  it('should_callLogoutEndpoint_when_logoutCalled', async () => {
+    mockedApiClient.post.mockResolvedValue({ data: {} })
+    await logout()
+    expect(mockedApiClient.post).toHaveBeenCalledWith('/auth/logout')
+  })
+
+  it('should_callMeEndpoint_when_getMeCalled', async () => {
+    mockedApiClient.get.mockResolvedValue({ data: { message: 'Authenticated' } })
+    const result = await getMe()
+    expect(mockedApiClient.get).toHaveBeenCalledWith('/auth/me')
+    expect(result).toEqual({ message: 'Authenticated' })
+  })
+})

frontend/src/__tests__/api/entitiesApi.test.ts

@@ -0,0 +1,62 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import apiClient from '@/api/apiClient'
+import {
+  getEntities,
+  createEntity,
+  updateEntity,
+  deleteEntity,
+  triggerEntity,
+} from '@/api/entitiesApi'
+
+vi.mock('@/api/apiClient', () => ({
+  default: {
+    get: vi.fn(),
+    post: vi.fn(),
+    put: vi.fn(),
+    delete: vi.fn(),
+  },
+}))
+
+const mockedApiClient = apiClient as {
+  get: ReturnType<typeof vi.fn>
+  post: ReturnType<typeof vi.fn>
+  put: ReturnType<typeof vi.fn>
+  delete: ReturnType<typeof vi.fn>
+}
+
+beforeEach(() => {
+  vi.clearAllMocks()
+})
+
+describe('entitiesApi', () => {
+  it('should_callGetEndpoint_when_getAllEntitiesCalled', async () => {
+    mockedApiClient.get.mockResolvedValue({ data: [] })
+    await getEntities()
+    expect(mockedApiClient.get).toHaveBeenCalledWith('/v1/virtual-entities')
+  })
+
+  it('should_callPostEndpoint_when_createEntityCalled', async () => {
+    const dto = { name: 'Test', email: 'test@test.com', jobTitle: 'Tester', personality: '', scheduleCron: '', contextWindowDays: 3 }
+    mockedApiClient.post.mockResolvedValue({ data: dto })
+    await createEntity(dto)
+    expect(mockedApiClient.post).toHaveBeenCalledWith('/v1/virtual-entities', dto)
+  })
+
+  it('should_callPutEndpoint_when_updateEntityCalled', async () => {
+    mockedApiClient.put.mockResolvedValue({ data: {} })
+    await updateEntity('123', { name: 'Updated' })
+    expect(mockedApiClient.put).toHaveBeenCalledWith('/v1/virtual-entities/123', { name: 'Updated' })
+  })
+
+  it('should_callDeleteEndpoint_when_deleteEntityCalled', async () => {
+    mockedApiClient.delete.mockResolvedValue({ data: {} })
+    await deleteEntity('123')
+    expect(mockedApiClient.delete).toHaveBeenCalledWith('/v1/virtual-entities/123')
+  })
+
+  it('should_callTriggerEndpoint_when_triggerEntityCalled', async () => {
+    mockedApiClient.post.mockResolvedValue({ data: {} })
+    await triggerEntity('123')
+    expect(mockedApiClient.post).toHaveBeenCalledWith('/v1/virtual-entities/123/trigger')
+  })
+})

frontend/src/__tests__/api/logsApi.test.ts

@@ -0,0 +1,31 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import apiClient from '@/api/apiClient'
+import { getLogs, getLogsByEntity } from '@/api/logsApi'
+
+vi.mock('@/api/apiClient', () => ({
+  default: {
+    get: vi.fn(),
+  },
+}))
+
+const mockedApiClient = apiClient as {
+  get: ReturnType<typeof vi.fn>
+}
+
+beforeEach(() => {
+  vi.clearAllMocks()
+})
+
+describe('logsApi', () => {
+  it('should_callGetAllLogsEndpoint_when_getAllLogsCalled', async () => {
+    mockedApiClient.get.mockResolvedValue({ data: [] })
+    await getLogs()
+    expect(mockedApiClient.get).toHaveBeenCalledWith('/v1/dispatch-logs')
+  })
+
+  it('should_callGetByEntityEndpoint_when_getLogsByEntityCalled', async () => {
+    mockedApiClient.get.mockResolvedValue({ data: [] })
+    await getLogsByEntity('entity-123')
+    expect(mockedApiClient.get).toHaveBeenCalledWith('/v1/dispatch-logs/entity/entity-123')
+  })
+})

frontend/src/__tests__/components/ProtectedRoute.test.tsx

@@ -0,0 +1,43 @@
+import { render, screen } from '@testing-library/react'
+import { describe, it, expect, vi } from 'vitest'
+import { MemoryRouter } from 'react-router-dom'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import ProtectedRoute from '@/components/ProtectedRoute'
+import * as authApi from '@/api/authApi'
+
+vi.mock('@/api/authApi')
+
+const makeWrapper = (initialPath = '/') =>
+  ({ children }: { children: React.ReactNode }) => (
+    <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
+      <MemoryRouter initialEntries={[initialPath]}>{children}</MemoryRouter>
+    </QueryClientProvider>
+  )
+
+describe('ProtectedRoute', () => {
+  it('should_renderChildren_when_sessionIsValid', async () => {
+    vi.mocked(authApi.getMe).mockResolvedValue({ message: 'Authenticated' })
+    const wrapper = makeWrapper()
+    render(
+      <ProtectedRoute>
+        <div>Protected Content</div>
+      </ProtectedRoute>,
+      { wrapper }
+    )
+    await screen.findByText('Protected Content')
+  })
+
+  it('should_redirectToLogin_when_sessionIsInvalid', async () => {
+    vi.mocked(authApi.getMe).mockRejectedValue(new Error('Unauthorized'))
+    const wrapper = makeWrapper()
+    render(
+      <ProtectedRoute>
+        <div>Protected Content</div>
+      </ProtectedRoute>,
+      { wrapper }
+    )
+    // Should navigate away, protected content should not be visible
+    await new Promise((r) => setTimeout(r, 100))
+    expect(screen.queryByText('Protected Content')).not.toBeInTheDocument()
+  })
+})

frontend/src/__tests__/pages/DashboardPage.test.tsx

@@ -1,11 +1,47 @@
-import { render, screen } from '@testing-library/react'
-import { describe, expect, it } from 'vitest'
+import { render, screen, waitFor } from '@testing-library/react'
+import { describe, it, expect, vi } from 'vitest'
+import { BrowserRouter } from 'react-router-dom'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import DashboardPage from '@/pages/DashboardPage'
+import * as entitiesApi from '@/api/entitiesApi'
+import * as logsApi from '@/api/logsApi'
+
+vi.mock('@/api/entitiesApi')
+vi.mock('@/api/logsApi')
+
+const wrapper = ({ children }: { children: React.ReactNode }) => (
+  <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
+    <BrowserRouter>{children}</BrowserRouter>
+  </QueryClientProvider>
+)
 
 describe('DashboardPage', () => {
   it('should_display_app_version_when_rendered', () => {
-    render(<DashboardPage />)
-
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([])
+    vi.mocked(logsApi.getLogs).mockResolvedValue([])
+    render(<DashboardPage />, { wrapper })
     expect(screen.getByText(/version \d+\.\d+\.\d+/i)).toBeInTheDocument()
   })
-})
+
+  it('should_renderEntityCount_when_pageLoads', async () => {
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([
+      { id: '1', name: 'Entity A', email: 'a@a.com', jobTitle: 'Job A', personality: '', scheduleCron: '', contextWindowDays: 3, active: true, createdAt: '' },
+    ])
+    vi.mocked(logsApi.getLogs).mockResolvedValue([])
+    render(<DashboardPage />, { wrapper })
+    await waitFor(() => {
+      expect(screen.getByText(/1 active entity|1 entidade/i)).toBeInTheDocument()
+    })
+  })
+
+  it('should_renderRecentLogs_when_pageLoads', async () => {
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([])
+    vi.mocked(logsApi.getLogs).mockResolvedValue([
+      { id: '1', entityId: 'e1', entityName: 'Entity A', promptSent: '', aiResponse: '', emailSubject: 'Memo', emailBody: '', status: 'SENT', errorMessage: null, dispatchedAt: '2024-01-01T10:00:00' },
+    ])
+    render(<DashboardPage />, { wrapper })
+    await waitFor(() => {
+      expect(screen.getByText(/Memo/i)).toBeInTheDocument()
+    })
+  })
+})

frontend/src/__tests__/pages/EntitiesPage.test.tsx

@@ -0,0 +1,60 @@
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import { describe, it, expect, vi } from 'vitest'
+import { BrowserRouter } from 'react-router-dom'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import EntitiesPage from '@/pages/EntitiesPage'
+import * as entitiesApi from '@/api/entitiesApi'
+
+vi.mock('@/api/entitiesApi')
+
+const wrapper = ({ children }: { children: React.ReactNode }) => (
+  <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
+    <BrowserRouter>{children}</BrowserRouter>
+  </QueryClientProvider>
+)
+
+const mockEntity = {
+  id: 'entity-1',
+  name: 'Test Entity',
+  email: 'test@condado.com',
+  jobTitle: 'Tester',
+  personality: 'Formal',
+  scheduleCron: '0 9 * * *',
+  contextWindowDays: 3,
+  active: true,
+  createdAt: '2024-01-01T00:00:00',
+}
+
+describe('EntitiesPage', () => {
+  it('should_renderEntityList_when_entitiesLoaded', async () => {
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([mockEntity])
+    render(<EntitiesPage />, { wrapper })
+    await waitFor(() => {
+      expect(screen.getByText('Test Entity')).toBeInTheDocument()
+    })
+  })
+
+  it('should_openCreateDialog_when_addButtonClicked', async () => {
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([])
+    render(<EntitiesPage />, { wrapper })
+    const addButton = screen.getByRole('button', { name: /add|create|new/i })
+    fireEvent.click(addButton)
+    await waitFor(() => {
+      expect(screen.getByRole('dialog')).toBeInTheDocument()
+    })
+  })
+
+  it('should_callDeleteApi_when_deleteConfirmed', async () => {
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([mockEntity])
+    vi.mocked(entitiesApi.deleteEntity).mockResolvedValue(undefined)
+    render(<EntitiesPage />, { wrapper })
+    await waitFor(() => {
+      expect(screen.getByText('Test Entity')).toBeInTheDocument()
+    })
+    const deleteButton = screen.getByRole('button', { name: /delete|deactivate/i })
+    fireEvent.click(deleteButton)
+    await waitFor(() => {
+      expect(entitiesApi.deleteEntity).toHaveBeenCalledWith('entity-1')
+    })
+  })
+})

frontend/src/__tests__/pages/LoginPage.test.tsx

@@ -0,0 +1,52 @@
+import { render, screen, fireEvent, waitFor } from '@testing-library/react'
+import { describe, it, expect, vi } from 'vitest'
+import { BrowserRouter } from 'react-router-dom'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import LoginPage from '@/pages/LoginPage'
+import * as authApi from '@/api/authApi'
+
+vi.mock('@/api/authApi')
+
+const wrapper = ({ children }: { children: React.ReactNode }) => (
+  <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
+    <BrowserRouter>{children}</BrowserRouter>
+  </QueryClientProvider>
+)
+
+describe('LoginPage', () => {
+  it('should_renderLoginForm_when_pageLoads', () => {
+    render(<LoginPage />, { wrapper })
+    expect(screen.getByRole('button', { name: /login/i })).toBeInTheDocument()
+    expect(screen.getByLabelText(/password/i)).toBeInTheDocument()
+  })
+
+  it('should_callLoginApi_when_formSubmitted', async () => {
+    vi.mocked(authApi.login).mockResolvedValue(undefined)
+    render(<LoginPage />, { wrapper })
+    fireEvent.change(screen.getByLabelText(/password/i), { target: { value: 'secret' } })
+    fireEvent.click(screen.getByRole('button', { name: /login/i }))
+    await waitFor(() => {
+      expect(authApi.login).toHaveBeenCalledWith({ password: 'secret' })
+    })
+  })
+
+  it('should_showErrorMessage_when_loginFails', async () => {
+    vi.mocked(authApi.login).mockRejectedValue(new Error('Unauthorized'))
+    render(<LoginPage />, { wrapper })
+    fireEvent.change(screen.getByLabelText(/password/i), { target: { value: 'wrong' } })
+    fireEvent.click(screen.getByRole('button', { name: /login/i }))
+    await waitFor(() => {
+      expect(screen.getByText(/invalid password|unauthorized|error/i)).toBeInTheDocument()
+    })
+  })
+
+  it('should_redirectToDashboard_when_loginSucceeds', async () => {
+    vi.mocked(authApi.login).mockResolvedValue(undefined)
+    render(<LoginPage />, { wrapper })
+    fireEvent.change(screen.getByLabelText(/password/i), { target: { value: 'correct' } })
+    fireEvent.click(screen.getByRole('button', { name: /login/i }))
+    await waitFor(() => {
+      expect(authApi.login).toHaveBeenCalled()
+    })
+  })
+})

frontend/src/__tests__/pages/LogsPage.test.tsx

@@ -0,0 +1,52 @@
+import { render, screen, waitFor } from '@testing-library/react'
+import { describe, it, expect, vi } from 'vitest'
+import { BrowserRouter } from 'react-router-dom'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import LogsPage from '@/pages/LogsPage'
+import * as logsApi from '@/api/logsApi'
+import * as entitiesApi from '@/api/entitiesApi'
+
+vi.mock('@/api/logsApi')
+vi.mock('@/api/entitiesApi')
+
+const wrapper = ({ children }: { children: React.ReactNode }) => (
+  <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
+    <BrowserRouter>{children}</BrowserRouter>
+  </QueryClientProvider>
+)
+
+const mockLog = {
+  id: 'log-1',
+  entityId: 'e1',
+  entityName: 'Entity A',
+  promptSent: 'prompt',
+  aiResponse: 'response',
+  emailSubject: 'Weekly Memo',
+  emailBody: 'Dear colleagues',
+  status: 'SENT' as const,
+  errorMessage: null,
+  dispatchedAt: '2024-01-01T10:00:00',
+}
+
+describe('LogsPage', () => {
+  it('should_renderLogTable_when_logsLoaded', async () => {
+    vi.mocked(logsApi.getLogs).mockResolvedValue([mockLog])
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([])
+    render(<LogsPage />, { wrapper })
+    await waitFor(() => {
+      expect(screen.getByText('Weekly Memo')).toBeInTheDocument()
+    })
+  })
+
+  it('should_filterLogsByEntity_when_filterSelected', async () => {
+    vi.mocked(logsApi.getLogs).mockResolvedValue([mockLog])
+    vi.mocked(entitiesApi.getEntities).mockResolvedValue([
+      { id: 'e1', name: 'Entity A', email: 'a@a.com', jobTitle: 'Job', personality: '', scheduleCron: '', contextWindowDays: 3, active: true, createdAt: '' },
+    ])
+    render(<LogsPage />, { wrapper })
+    await waitFor(() => {
+      expect(screen.getByText('Weekly Memo')).toBeInTheDocument()
+    })
+    expect(screen.getByRole('combobox', { hidden: true })).toBeInTheDocument()
+  })
+})