@cccsaurora/howler-ui 2.19.0-dev.1151 → 2.19.0-dev.1260

package/components/routes/cases/detail/CaseRules.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Add, Delete } from '@mui/icons-material';
+import { Button, Card, Chip, IconButton, Stack, Switch, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Tooltip, Typography } from '@mui/material';
+import api from '@cccsaurora/howler-ui/api';
+import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
+import ConfirmDeleteModal from '@cccsaurora/howler-ui/components/elements/display/modals/ConfirmDeleteModal';
+import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
+import { useCallback, useContext, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useOutletContext } from 'react-router-dom';
+import useCase from '../hooks/useCase';
+import CreateRuleDialog from './CreateRuleDialog';
+const CaseRules = ({ case: providedCase, caseId }) => {
+    const { t } = useTranslation();
+    const { dispatchApi } = useMyApi();
+    const { showModal } = useContext(ModalContext);
+    const routeCase = useOutletContext();
+    const { case: _case, update } = useCase({ case: providedCase ?? routeCase, caseId });
+    const [dialogOpen, setDialogOpen] = useState(false);
+    const handleCreateRule = useCallback(async (ruleData) => {
+        if (!_case) {
+            return;
+        }
+        const updatedCase = await dispatchApi(api.v2.case.rules.post(_case.case_id, ruleData));
+        update(updatedCase, false);
+    }, [_case, dispatchApi, update]);
+    const handleDeleteRule = useCallback(async (ruleId) => {
+        if (!_case) {
+            return;
+        }
+        showModal(_jsx(ConfirmDeleteModal, { onConfirm: async () => {
+                const updatedCase = await dispatchApi(api.v2.case.rules.del(_case.case_id, ruleId), { throwError: false });
+                if (updatedCase) {
+                    update(updatedCase, false);
+                }
+            } }), { height: 'auto' });
+    }, [_case, dispatchApi, showModal, update]);
+    const handleToggleEnabled = useCallback(async (ruleId, enabled) => {
+        if (!_case) {
+            return;
+        }
+        const updatedCase = await dispatchApi(api.v2.case.rules.put(_case.case_id, ruleId, { enabled }));
+        update(updatedCase, false);
+    }, [_case, dispatchApi, update]);
+    if (!_case) {
+        return null;
+    }
+    const rules = _case.rules ?? [];
+    return (_jsxs(Stack, { spacing: 2, sx: { p: 2, height: '100%', overflow: 'auto' }, children: [_jsx(Button, { id: "create-rule-button", variant: "outlined", startIcon: _jsx(Add, {}), onClick: () => setDialogOpen(true), sx: { alignSelf: 'end' }, children: t('page.cases.rules.create') }), _jsx(Card, { children: rules.length === 0 ? (_jsx(Typography, { m: 2, color: "textSecondary", textAlign: "center", children: t('page.cases.rules.empty') })) : (_jsx(TableContainer, { children: _jsxs(Table, { id: "rules-table", size: "small", children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { children: t('page.cases.rules.destination') }), _jsx(TableCell, { children: t('page.cases.rules.query') }), _jsx(TableCell, { children: t('hit.search.index') }), _jsx(TableCell, { children: t('page.cases.rules.timeframe') }), _jsx(TableCell, { children: t('page.cases.rules.author') }), _jsx(TableCell, { align: "center", children: t('enabled') }), _jsx(TableCell, { align: "right" })] }) }), _jsx(TableBody, { children: rules.map(rule => (_jsxs(TableRow, { id: `rule-row-${rule.rule_id}`, children: [_jsx(TableCell, { children: _jsx(Typography, { variant: "body2", sx: { fontFamily: 'monospace' }, children: rule.destination }) }), _jsx(TableCell, { children: _jsx(Typography, { variant: "body2", sx: {
+                                                    fontFamily: 'monospace'
+                                                }, children: rule.query }) }), _jsx(TableCell, { children: _jsx(Stack, { direction: "row", spacing: 0.5, children: (rule.indexes ?? ['hit']).map(idx => (_jsx(Chip, { size: "small", label: idx, variant: "outlined" }, idx))) }) }), _jsx(TableCell, { children: rule.timeframe != null ? (_jsx(Chip, { size: "small", label: rule.expire_after_resolved
+                                                    ? t('page.cases.rules.timeframe.after_resolved', { days: rule.timeframe })
+                                                    : t('page.cases.rules.timeframe.days', { days: rule.timeframe }), color: rule.expire_after_resolved ? 'info' : 'default' })) : (_jsx(Chip, { size: "small", label: t('page.cases.rules.no_expiry'), color: "success" })) }), _jsx(TableCell, { children: _jsx(Typography, { variant: "body2", children: rule.author }) }), _jsx(TableCell, { align: "center", children: _jsx(Switch, { id: `rule-toggle-${rule.rule_id}`, checked: rule.enabled ?? true, onChange: (_e, checked) => handleToggleEnabled(rule.rule_id, checked), size: "small" }) }), _jsx(TableCell, { align: "right", children: _jsx(Tooltip, { title: t('delete'), children: _jsx(IconButton, { id: `rule-delete-${rule.rule_id}`, size: "small", onClick: () => handleDeleteRule(rule.rule_id), children: _jsx(Delete, { fontSize: "small" }) }) }) })] }, rule.rule_id))) })] }) })) }), _jsx(CreateRuleDialog, { open: dialogOpen, onClose: () => setDialogOpen(false), onSubmit: handleCreateRule })] }));
+};
+export default CaseRules;

package/components/routes/cases/detail/CaseRules.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/routes/cases/detail/CaseRules.test.js

@@ -0,0 +1,238 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { act, render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { createMockCase } from '@cccsaurora/howler-ui/tests/utils';
+import { describe, expect, it, vi } from 'vitest';
+const mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockUpdate = vi.hoisted(() => vi.fn());
+const mockShowModal = vi.hoisted(() => vi.fn());
+const mockCase = vi.hoisted(() => ({
+    current: {
+        case_id: 'case-001',
+        title: 'Test Case',
+        rules: []
+    }
+}));
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('components/app/providers/ModalProvider', async () => {
+    const { createContext } = await import('react');
+    return {
+        ModalContext: createContext({ showModal: mockShowModal, close: vi.fn(), setContent: vi.fn() })
+    };
+});
+vi.mock('../hooks/useCase', () => ({
+    default: ({ case: c }) => ({
+        case: c ?? mockCase.current,
+        update: mockUpdate,
+        loading: false,
+        missing: false
+    })
+}));
+vi.mock('react-router-dom', async () => {
+    const actual = await vi.importActual('react-router-dom');
+    return {
+        ...actual,
+        useOutletContext: () => mockCase.current,
+        useLocation: () => ({ pathname: '/cases/case-001/rules', search: '' }),
+        useParams: () => ({ id: 'case-001' }),
+        useNavigate: () => vi.fn()
+    };
+});
+const mockOnSubmit = vi.hoisted(() => ({ current: null }));
+vi.mock('./CreateRuleDialog', () => ({
+    default: ({ open, onClose, onSubmit }) => {
+        mockOnSubmit.current = onSubmit;
+        return open ? (_jsxs("div", { id: "create-rule-dialog", children: [_jsx("button", { id: "rule-submit-button", onClick: () => onSubmit({ query: 'event.kind:alert', destination: 'alerts/incoming' }), children: "submit" }), _jsx("button", { onClick: onClose, children: "cancel" })] })) : null;
+    }
+}));
+vi.mock('api', () => ({
+    default: {
+        v2: {
+            case: {
+                rules: {
+                    post: vi.fn(),
+                    del: vi.fn(),
+                    put: vi.fn()
+                }
+            }
+        }
+    }
+}));
+import api from '@cccsaurora/howler-ui/api';
+import CaseRules from './CaseRules';
+const makeRule = (overrides) => ({
+    rule_id: 'rule-001',
+    query: 'event.kind:alert',
+    destination: 'alerts/{{howler.analytic}}',
+    author: 'analyst1',
+    enabled: true,
+    timeframe: 14,
+    expire_after_resolved: false,
+    indexes: ['hit'],
+    ...overrides
+});
+describe('CaseRules', () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            title: 'Test Case',
+            rules: []
+        });
+    });
+    it('renders empty state when no rules exist', () => {
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByText('page.cases.rules.empty')).toBeInTheDocument();
+    });
+    it('renders rule list with destination, query, author, and timeframe', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule()]
+        });
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByTestId('rules-table')).toBeInTheDocument();
+        expect(screen.getByText('alerts/{{howler.analytic}}')).toBeInTheDocument();
+        expect(screen.getByText('event.kind:alert')).toBeInTheDocument();
+        expect(screen.getByText('analyst1')).toBeInTheDocument();
+    });
+    it('shows no expiry chip when timeframe is null', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ timeframe: undefined })]
+        });
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByText('page.cases.rules.no_expiry')).toBeInTheDocument();
+    });
+    it('shows after-resolved chip when expire_after_resolved is true', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ timeframe: 7, expire_after_resolved: true })]
+        });
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByText('page.cases.rules.timeframe.after_resolved')).toBeInTheDocument();
+    });
+    it('shows days chip when expire_after_resolved is false', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ timeframe: 14, expire_after_resolved: false })]
+        });
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByText('page.cases.rules.timeframe.days')).toBeInTheDocument();
+    });
+    it('renders enabled toggle for each rule', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule()]
+        });
+        render(_jsx(CaseRules, {}));
+        const toggle = screen.getByTestId('rule-toggle-rule-001');
+        expect(toggle).toBeInTheDocument();
+    });
+    it('renders index chips for rule indexes', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ indexes: ['hit', 'event'] })]
+        });
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByText('hit')).toBeInTheDocument();
+        expect(screen.getByText('event')).toBeInTheDocument();
+    });
+    it('defaults to hit chip when indexes is undefined', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ indexes: undefined })]
+        });
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByText('hit')).toBeInTheDocument();
+    });
+    it('opens create rule dialog when create button is clicked', async () => {
+        const user = userEvent.setup();
+        render(_jsx(CaseRules, {}));
+        await act(async () => {
+            await user.click(screen.getByTestId('create-rule-button'));
+        });
+        await waitFor(() => {
+            expect(screen.getByTestId('create-rule-dialog')).toBeInTheDocument();
+        });
+    });
+    it('submits create rule form and calls API', async () => {
+        const user = userEvent.setup();
+        const updatedCase = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ rule_id: 'new-rule' })]
+        });
+        mockDispatchApi.mockResolvedValueOnce(updatedCase);
+        api.v2.case.rules.post.mockReturnValue('post-request');
+        render(_jsx(CaseRules, {}));
+        await act(async () => {
+            await user.click(screen.getByTestId('create-rule-button'));
+        });
+        await waitFor(() => {
+            expect(screen.getByTestId('create-rule-dialog')).toBeInTheDocument();
+        });
+        await act(async () => {
+            await user.click(screen.getByTestId('rule-submit-button'));
+        });
+        await waitFor(() => {
+            expect(mockDispatchApi).toHaveBeenCalledWith('post-request');
+        });
+    });
+    it('calls delete API when delete is confirmed via modal', async () => {
+        const user = userEvent.setup();
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule()]
+        });
+        const updatedCase = createMockCase({ case_id: 'case-001', rules: [] });
+        mockDispatchApi.mockResolvedValueOnce(updatedCase);
+        api.v2.case.rules.del.mockReturnValue('del-request');
+        // Make showModal immediately invoke the onConfirm callback
+        mockShowModal.mockImplementation((modal) => {
+            modal.props.onConfirm();
+        });
+        render(_jsx(CaseRules, {}));
+        await act(async () => {
+            await user.click(screen.getByTestId('rule-delete-rule-001'));
+        });
+        await waitFor(() => {
+            expect(mockShowModal).toHaveBeenCalled();
+            expect(mockDispatchApi).toHaveBeenCalledWith('del-request', { throwError: false });
+        });
+    });
+    it('calls put API when enabled toggle is clicked', async () => {
+        const user = userEvent.setup();
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ enabled: true })]
+        });
+        const updatedCase = createMockCase({
+            case_id: 'case-001',
+            rules: [makeRule({ enabled: false })]
+        });
+        mockDispatchApi.mockResolvedValueOnce(updatedCase);
+        vi.mocked(api.v2.case.rules.put).mockReturnValue('put-request');
+        render(_jsx(CaseRules, {}));
+        const toggle = screen.getByTestId('rule-toggle-rule-001');
+        await act(async () => {
+            await user.click(toggle);
+        });
+        await waitFor(() => {
+            expect(mockDispatchApi).toHaveBeenCalledWith('put-request');
+        });
+    });
+    it('renders multiple rules', () => {
+        mockCase.current = createMockCase({
+            case_id: 'case-001',
+            rules: [
+                makeRule({ rule_id: 'rule-001', query: 'query1' }),
+                makeRule({ rule_id: 'rule-002', query: 'query2', author: 'analyst2' })
+            ]
+        });
+        render(_jsx(CaseRules, {}));
+        expect(screen.getByText('query1')).toBeInTheDocument();
+        expect(screen.getByText('query2')).toBeInTheDocument();
+        expect(screen.getByText('analyst2')).toBeInTheDocument();
+    });
+});

package/components/routes/cases/detail/CaseSearch.d.ts

@@ -0,0 +1,3 @@
+import type { FC } from 'react';
+declare const CaseSearch: FC;
+export default CaseSearch;

package/components/routes/cases/detail/CaseSearch.js

@@ -0,0 +1,78 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Box, Skeleton, Stack, Typography } from '@mui/material';
+import api from '@cccsaurora/howler-ui/api';
+import PageCenter from '@cccsaurora/howler-ui/commons/components/pages/PageCenter';
+import { ParameterContext } from '@cccsaurora/howler-ui/components/app/providers/ParameterProvider';
+import SearchPagination from '@cccsaurora/howler-ui/components/elements/addons/search/SearchPagination';
+import SearchTotal from '@cccsaurora/howler-ui/components/elements/addons/search/SearchTotal';
+import CaseCard from '@cccsaurora/howler-ui/components/elements/case/CaseCard';
+import EventCard from '@cccsaurora/howler-ui/components/elements/event/EventCard';
+import HitCard from '@cccsaurora/howler-ui/components/elements/hit/HitCard';
+import { HitLayout } from '@cccsaurora/howler-ui/components/elements/hit/HitLayout';
+import FuzzySearchBar from '@cccsaurora/howler-ui/components/elements/search/FuzzySearchBar';
+import { useMyLocalStorageItem } from '@cccsaurora/howler-ui/components/hooks/useMyLocalStorage';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useOutletContext } from 'react-router-dom';
+import { useContextSelector } from 'use-context-selector';
+import { StorageKey } from '@cccsaurora/howler-ui/utils/constants';
+import { isCase, isEvent, isHit } from '@cccsaurora/howler-ui/utils/typeUtils';
+const CaseSearch = () => {
+    const parentCase = useOutletContext();
+    const indexes = useContextSelector(ParameterContext, ctx => ctx.indexes);
+    const query = useContextSelector(ParameterContext, ctx => ctx.query);
+    const [hitLayout] = useMyLocalStorageItem(StorageKey.HIT_LAYOUT, HitLayout.NORMAL);
+    const [loading, setLoading] = useState(false);
+    const [response, setResponse] = useState(null);
+    const [error, setError] = useState(null);
+    const [offset, setOffset] = useState(0);
+    const caseIds = useMemo(() => parentCase
+        ? [
+            parentCase.case_id,
+            ...(parentCase.items ?? []).filter(item => item.type === 'case').map(item => item.value)
+        ].filter((id) => !!id)
+        : [], [parentCase]);
+    const handleSearch = useCallback(async (_query, _indexes) => {
+        setLoading(true);
+        setError(null);
+        try {
+            // If no indexes specified, search across all types
+            const searchIndexes = _indexes.length > 0 ? _indexes : ['case', 'hit', 'event'];
+            // Add case_id to the filters to scope the search to this case and its sub-cases
+            const filters = parentCase?.case_id
+                ? [`case_id:(${caseIds.join(' OR ')}) OR howler.related:(${caseIds.join(' OR ')})`]
+                : [];
+            setResponse(await api.v2.fuzzy.post({
+                query: _query,
+                indexes: searchIndexes,
+                rows: 25,
+                filters,
+                offset
+            }));
+        }
+        catch (err) {
+            setError(err.message || 'An error occurred while searching.');
+            setResponse(null);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [caseIds, offset, parentCase?.case_id]);
+    useEffect(() => {
+        if (query) {
+            handleSearch(query, indexes);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [indexes, offset]);
+    return (_jsx(PageCenter, { maxWidth: "lg", textAlign: "left", children: _jsxs(Stack, { spacing: 1, children: [_jsx(FuzzySearchBar, { onSearch: handleSearch, loading: loading }), response && (_jsxs(Stack, { direction: "row", alignItems: "center", sx: { pt: 1 }, children: [_jsx(SearchTotal, { total: response.total, pageLength: response.items.length, offset: response.offset, sx: theme => ({ color: theme.palette.text.secondary, fontSize: '0.9em', fontStyle: 'italic' }) }), _jsx(Box, { flex: 1 }), _jsx(SearchPagination, { total: response.total, limit: response.rows, offset: response.offset, onChange: nextOffset => setOffset(nextOffset) })] })), error && (_jsx(Typography, { color: "error", sx: { mb: 2 }, children: error })), loading ? (_jsx(_Fragment, { children: _jsx(Skeleton, { variant: "rounded", height: 430 }) })) : ((response?.items ?? []).map(item => {
+                    if (isHit(item)) {
+                        return _jsx(HitCard, { id: item.howler.id, layout: hitLayout }, item.howler.id);
+                    }
+                    else if (isEvent(item)) {
+                        return _jsx(EventCard, { id: item.howler.id, event: item }, item.howler.id);
+                    }
+                    else if (isCase(item)) {
+                        return _jsx(CaseCard, { caseId: item.case_id, case: item }, item.case_id);
+                    }
+                }))] }) }));
+};
+export default CaseSearch;

package/components/routes/cases/detail/CaseSearch.test.d.ts

@@ -0,0 +1 @@
+export {};

package/components/routes/cases/detail/CaseSearch.test.js

@@ -0,0 +1,154 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { setupContextSelectorMock, setupLocalStorageMock } from '@cccsaurora/howler-ui/tests/mocks';
+import { createMockCase, createMockEvent, createMockHit } from '@cccsaurora/howler-ui/tests/utils';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+// ---------------------------------------------------------------------------
+// Setup common mocks
+// ---------------------------------------------------------------------------
+setupContextSelectorMock();
+const mockLocalStorage = setupLocalStorageMock();
+const mockFuzzyPost = vi.hoisted(() => vi.fn());
+vi.mock('api', () => ({
+    default: {
+        v2: {
+            fuzzy: {
+                post: (...args) => mockFuzzyPost(...args)
+            }
+        }
+    }
+}));
+vi.mock('react-router-dom', async () => {
+    const actual = await vi.importActual('react-router-dom');
+    return {
+        ...actual,
+        // Provide a parent case via outlet context for CaseSearch
+        useOutletContext: () => createMockCase({
+            case_id: 'parent-case',
+            items: [{ type: 'case', value: 'child-1' }, { type: 'case', value: 'child-2' }]
+        })
+    };
+});
+// The cards render skeletons when records aren't in RecordContext. We don't
+// need full RecordProvider—verify presence via ids/text content.
+vi.mock('components/elements/hit/HitCard', () => ({
+    default: ({ id }) => _jsxs("div", { id: `hit-card-${id}`, children: ["Hit ", id] })
+}));
+vi.mock('components/elements/event/EventCard', () => ({
+    default: ({ id }) => _jsxs("div", { id: `event-card-${id}`, children: ["Event ", id] })
+}));
+vi.mock('components/elements/case/CaseCard', () => ({
+    default: ({ caseId }) => _jsxs("div", { id: `case-card-${caseId}`, children: ["Case ", caseId] })
+}));
+// ---------------------------------------------------------------------------
+// Import after mocks
+// ---------------------------------------------------------------------------
+import { ParameterContext } from '@cccsaurora/howler-ui/components/app/providers/ParameterProvider';
+import i18n from '@cccsaurora/howler-ui/i18n';
+import { useState } from 'react';
+import { I18nextProvider } from 'react-i18next';
+import CaseSearch from './CaseSearch';
+// Helper to make a response object
+const makeResponse = (overrides) => ({
+    items: [],
+    offset: 0,
+    rows: 25,
+    total: 0,
+    ...overrides
+});
+describe('CaseSearch', () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+        mockLocalStorage.clear();
+    });
+    const MakeWrapper = ({ children }) => {
+        const [query, setQuery] = useState('');
+        const [indexes] = useState([]);
+        return (_jsx(I18nextProvider, { i18n: i18n, children: _jsx(ParameterContext.Provider, { value: { indexes, query, setQuery }, children: children }) }));
+    };
+    it('renders SearchTotal and pagination after a successful search', async () => {
+        const hit = createMockHit({ howler: { id: 'hit-1' } });
+        const event = createMockEvent({ howler: { id: 'event-1' } });
+        mockFuzzyPost.mockResolvedValueOnce(makeResponse({ items: [hit, event], total: 100, rows: 25, offset: 0 }));
+        render(_jsx(CaseSearch, {}), { wrapper: MakeWrapper });
+        // Trigger search by clicking the button in FuzzySearchBar
+        // First, type a query into the input and click the search icon
+        const user = userEvent.setup();
+        const input = screen.getByTestId('fuzzy-search-input');
+        await user.type(input, 'howler.id:*');
+        await user.click(screen.getByTestId('fuzzy-search-button'));
+        await waitFor(() => {
+            // Total text appears
+            expect(screen.getByText(/Showing 1 to 2 of 100 results/)).toBeInTheDocument();
+            // Pagination navigation renders
+            expect(screen.getByRole('navigation')).toBeInTheDocument();
+        });
+    });
+    it('calls fuzzy search with default indexes when none selected', async () => {
+        mockFuzzyPost.mockResolvedValueOnce(makeResponse({ items: [], total: 0 }));
+        render(_jsx(CaseSearch, {}), { wrapper: MakeWrapper });
+        const user = userEvent.setup();
+        const input = screen.getByTestId('fuzzy-search-input');
+        await user.type(input, 'test');
+        await user.click(screen.getByTestId('fuzzy-search-button'));
+        await waitFor(() => {
+            expect(mockFuzzyPost).toHaveBeenCalledTimes(1);
+            const arg = mockFuzzyPost.mock.calls[0][0];
+            expect(arg.query).toBe('test');
+            expect(arg.rows).toBe(25);
+            expect(arg.offset).toBe(0);
+            expect(arg.indexes).toEqual(['case', 'hit', 'event']);
+            // When indexes array is empty, CaseSearch uses defaults
+            // Filters are included when case context exists; exact text is implementation detail
+        });
+    });
+    it('renders appropriate cards for hit, event and case items', async () => {
+        const hit = { ...createMockHit({ howler: { id: 'hit-123' } }), _score: 1 };
+        const event = { ...createMockEvent({ howler: { id: 'event-456' } }), _score: 1 };
+        const caseItem = { __index: 'case', case_id: 'case-789', _score: 1 };
+        mockFuzzyPost.mockResolvedValueOnce(makeResponse({ items: [hit, event, caseItem], total: 3, offset: 0 }));
+        render(_jsx(CaseSearch, {}), { wrapper: MakeWrapper });
+        const user = userEvent.setup();
+        const input = screen.getByTestId('fuzzy-search-input');
+        await user.type(input, 'anything');
+        await user.click(screen.getByTestId('fuzzy-search-button'));
+        await waitFor(() => {
+            expect(screen.getByTestId('hit-card-hit-123')).toBeInTheDocument();
+            expect(screen.getByTestId('event-card-event-456')).toBeInTheDocument();
+            expect(screen.getByTestId('case-card-case-789')).toBeInTheDocument();
+        });
+    });
+    it('updates offset via pagination and re-runs search', async () => {
+        // First response with 100 total and 25 rows; clicking page 2 should set offset=25
+        mockFuzzyPost
+            .mockResolvedValueOnce(makeResponse({ items: [], total: 100, rows: 25, offset: 0 }))
+            .mockResolvedValueOnce(makeResponse({ items: [], total: 100, rows: 25, offset: 25 }));
+        render(_jsx(CaseSearch, {}), { wrapper: MakeWrapper });
+        const user = userEvent.setup();
+        const input = screen.getByTestId('fuzzy-search-input');
+        await user.type(input, 'page');
+        await user.click(screen.getByTestId('fuzzy-search-button'));
+        await waitFor(() => {
+            expect(screen.getByRole('navigation')).toBeInTheDocument();
+        });
+        await user.click(screen.getByText('2'));
+        await waitFor(() => {
+            // Second call should include offset 25
+            const second = mockFuzzyPost.mock.calls[1][0];
+            expect(second.offset).toBe(25);
+        });
+    });
+    it('shows error text when search fails', async () => {
+        mockFuzzyPost.mockRejectedValueOnce(new Error('Boom'));
+        render(_jsx(CaseSearch, {}), { wrapper: MakeWrapper });
+        const user = userEvent.setup();
+        const input = screen.getByTestId('fuzzy-search-input');
+        await user.type(input, 'bad');
+        await user.click(screen.getByTestId('fuzzy-search-button'));
+        await waitFor(() => {
+            expect(screen.getByText('Boom')).toBeInTheDocument();
+        });
+    });
+});

package/components/routes/cases/detail/CaseSidebar.d.ts

@@ -0,0 +1,8 @@
+import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
+import { type FC } from 'react';
+interface CaseSidebarProps {
+    case: Case;
+    update: (newCase: Case) => void;
+}
+declare const CaseSidebar: FC<CaseSidebarProps>;
+export default CaseSidebar;