@cccsaurora/howler-ui 2.19.0-cases.1110 → 2.19.0-cases.1122

package/components/routes/cases/detail/{CaseAssets.test.js → CaseObservables.test.js}

@@ -6,28 +6,28 @@ import { createElement } from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { createMockEvent, createMockHit } from '@cccsaurora/howler-ui/tests/utils';
 import { describe, expect, it, vi } from 'vitest';
-import { buildAssetEntries } from './CaseAssets';
+import { buildObservableEntries } from './CaseObservables';
 // ---------------------------------------------------------------------------
 // Pure logic tests — no React needed
 // ---------------------------------------------------------------------------
-describe('buildAssetEntries', () => {
+describe('buildObservableEntries', () => {
     it('returns an empty array for records with no related field', () => {
-        expect(buildAssetEntries([createMockHit({ howler: { id: 'h1' } })])).toEqual([]);
+        expect(buildObservableEntries([createMockHit({ howler: { id: 'h1' } })])).toEqual([]);
     });
     it('extracts a single IP from a hit', () => {
-        const result = buildAssetEntries([createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } })]);
+        const result = buildObservableEntries([createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } })]);
         expect(result).toHaveLength(1);
         expect(result[0]).toEqual({ type: 'ip', value: '1.2.3.4', seenIn: ['h1'] });
     });
     it('extracts multiple fields from a single record', () => {
-        const result = buildAssetEntries([
+        const result = buildObservableEntries([
             createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'], user: ['alice'] } })
         ]);
         const types = result.map(a => a.type).sort();
         expect(types).toEqual(['ip', 'user']);
     });
     it('deduplicates the same asset value across multiple records', () => {
-        const result = buildAssetEntries([
+        const result = buildObservableEntries([
             createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } }),
             createMockEvent({ howler: { id: 'obs1' }, related: { ip: ['1.2.3.4'] } })
         ]);
@@ -35,14 +35,14 @@ describe('buildAssetEntries', () => {
         expect(result[0].seenIn).toEqual(['h1', 'obs1']);
     });
     it('keeps distinct asset values as separate entries', () => {
-        const result = buildAssetEntries([
+        const result = buildObservableEntries([
             createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } }),
             createMockHit({ howler: { id: 'h2' }, related: { ip: ['5.6.7.8'] } })
         ]);
         expect(result).toHaveLength(2);
     });
     it('does not duplicate seenIn ids when the same record appears twice for the same asset', () => {
-        const result = buildAssetEntries([
+        const result = buildObservableEntries([
             createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } }),
             createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } })
         ]);
@@ -50,10 +50,10 @@ describe('buildAssetEntries', () => {
     });
     it('skips records with no howler.id', () => {
         const noId = { related: { ip: ['1.2.3.4'] } };
-        expect(buildAssetEntries([noId])).toEqual([]);
+        expect(buildObservableEntries([noId])).toEqual([]);
     });
     it('handles the scalar `id` field on Related', () => {
-        const result = buildAssetEntries([createMockHit({ howler: { id: 'h1' }, related: { id: 'some-id' } })]);
+        const result = buildObservableEntries([createMockHit({ howler: { id: 'h1' }, related: { id: 'some-id' } })]);
         expect(result).toHaveLength(1);
         expect(result[0]).toEqual({ type: 'id', value: 'some-id', seenIn: ['h1'] });
     });
@@ -66,7 +66,7 @@ describe('buildAssetEntries', () => {
             uri: ['https://example.com'],
             signature: ['rule-X']
         };
-        const result = buildAssetEntries([createMockHit({ howler: { id: 'h1' }, related })]);
+        const result = buildObservableEntries([createMockHit({ howler: { id: 'h1' }, related })]);
         const types = result.map(a => a.type).sort();
         expect(types).toEqual(['hash', 'hosts', 'ids', 'signature', 'uri', 'user']);
     });
@@ -91,65 +91,65 @@ const mockCase = {
         { type: 'event', value: 'obs-1' }
     ]
 };
-const Wrapper = ({ children }) => createElement(MemoryRouter, { initialEntries: ['/cases/case-001/assets'] }, children);
+const Wrapper = ({ children }) => createElement(MemoryRouter, { initialEntries: ['/cases/case-001/observables'] }, children);
 // lazy import the component after mocks are set up
-const CaseAssets = (await import('./CaseAssets')).default;
-describe('CaseAssets component', () => {
+const CaseObservables = (await import('./CaseObservables')).default;
+describe('CaseObservables component', () => {
     beforeEach(() => {
         mockDispatchApi.mockClear();
     });
     it('renders skeletons while records are loading', () => {
         mockDispatchApi.mockReturnValue(new Promise(() => { })); // never resolves
-        render(_jsx(CaseAssets, { case: mockCase }), { wrapper: Wrapper });
+        render(_jsx(CaseObservables, { case: mockCase }), { wrapper: Wrapper });
         // 6 skeleton cards
         const skeletons = document.querySelectorAll('.MuiSkeleton-root');
         expect(skeletons.length).toBeGreaterThan(0);
     });
-    it('shows "No assets found" when records have no related data', async () => {
+    it('shows "No observables found" when records have no related data', async () => {
         mockDispatchApi.mockResolvedValue({
             items: [{ howler: { id: 'hit-1' } }, { howler: { id: 'obs-1' } }]
         });
-        render(_jsx(CaseAssets, { case: mockCase }), { wrapper: Wrapper });
-        await screen.findByText('page.cases.assets.empty');
+        render(_jsx(CaseObservables, { case: mockCase }), { wrapper: Wrapper });
+        await screen.findByText('page.cases.observables.empty');
     });
-    it('renders asset cards for extracted assets', async () => {
+    it('renders observable cards for extracted observables', async () => {
         mockDispatchApi.mockResolvedValue({
             items: [{ howler: { id: 'hit-1' }, related: { ip: ['1.2.3.4'], user: ['alice'] } }]
         });
-        render(_jsx(CaseAssets, { case: mockCase }), { wrapper: Wrapper });
+        render(_jsx(CaseObservables, { case: mockCase }), { wrapper: Wrapper });
         await screen.findByText('1.2.3.4');
         expect(screen.getByText('alice')).toBeTruthy();
     });
-    it('renders a filter chip for each asset type present', async () => {
+    it('renders a filter chip for each observable type present', async () => {
         mockDispatchApi.mockResolvedValue({
             items: [{ howler: { id: 'hit-1' }, related: { ip: ['1.2.3.4'], user: ['alice'] } }]
         });
-        render(_jsx(CaseAssets, { case: mockCase }), { wrapper: Wrapper });
-        await screen.findAllByText('page.cases.assets.type.ip');
-        expect(screen.getAllByText('page.cases.assets.type.ip')).toHaveLength(2);
-        expect(screen.getAllByText('page.cases.assets.type.user')).toHaveLength(2);
+        render(_jsx(CaseObservables, { case: mockCase }), { wrapper: Wrapper });
+        await screen.findAllByText('page.cases.observables.type.ip');
+        expect(screen.getAllByText('page.cases.observables.type.ip')).toHaveLength(2);
+        expect(screen.getAllByText('page.cases.observables.type.user')).toHaveLength(2);
     });
-    it('filters assets when a type chip is clicked', async () => {
+    it('filters observables when a type chip is clicked', async () => {
         mockDispatchApi.mockResolvedValue({
             items: [{ howler: { id: 'hit-1' }, related: { ip: ['1.2.3.4'], user: ['alice'] } }]
         });
-        render(_jsx(CaseAssets, { case: mockCase }), { wrapper: Wrapper });
-        // Wait for both assets to appear
+        render(_jsx(CaseObservables, { case: mockCase }), { wrapper: Wrapper });
+        // Wait for both observables to appear
         await screen.findByText('1.2.3.4');
         expect(screen.getByText('alice')).toBeTruthy();
         // Click the 'ip' filter chip
-        await userEvent.click(screen.getByRole('button', { name: 'page.cases.assets.type.ip' }));
+        await userEvent.click(screen.getByRole('button', { name: 'page.cases.observables.type.ip' }));
         // Alice (user) should be filtered out
         expect(screen.queryByText('alice')).toBeNull();
         expect(screen.getByText('1.2.3.4')).toBeTruthy();
     });
-    it('restores all assets when an active filter chip is clicked again', async () => {
+    it('restores all observables when an active filter chip is clicked again', async () => {
         mockDispatchApi.mockResolvedValue({
             items: [{ howler: { id: 'hit-1' }, related: { ip: ['1.2.3.4'], user: ['alice'] } }]
         });
-        render(_jsx(CaseAssets, { case: mockCase }), { wrapper: Wrapper });
+        render(_jsx(CaseObservables, { case: mockCase }), { wrapper: Wrapper });
         await screen.findByText('1.2.3.4');
-        const ipChip = screen.getByRole('button', { name: 'page.cases.assets.type.ip' });
+        const ipChip = screen.getByRole('button', { name: 'page.cases.observables.type.ip' });
         await userEvent.click(ipChip);
         await userEvent.click(ipChip);
         expect(screen.getByText('1.2.3.4')).toBeTruthy();
@@ -157,8 +157,8 @@ describe('CaseAssets component', () => {
     });
     it('renders nothing when the case has no hit/event items', async () => {
         const emptyCase = { case_id: 'case-002', items: [] };
-        render(_jsx(CaseAssets, { case: emptyCase }), { wrapper: Wrapper });
-        await screen.findByText('page.cases.assets.empty');
+        render(_jsx(CaseObservables, { case: emptyCase }), { wrapper: Wrapper });
+        await screen.findByText('page.cases.observables.empty');
         expect(mockDispatchApi).not.toHaveBeenCalled();
     });
 });

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/CaseSidebar.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DndContext, DragOverlay, MouseSensor, pointerWithin, TouchSensor, useSensor, useSensors } from '@dnd-kit/core';
-import { CalendarMonth, Circle, Dashboard, Dataset, Rule } from '@mui/icons-material';
+import { CalendarMonth, Circle, Dashboard, Dataset, Rule, Search } from '@mui/icons-material';
 import { alpha, Box, Card, Chip, Divider, LinearProgress, Skeleton, Stack, Typography, useTheme } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
 import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
@@ -99,7 +99,7 @@ const CaseSidebar = ({ case: _case, update }) => {
             maxHeight: 'calc(100vh - 64px)',
             display: 'flex',
             flexDirection: 'column'
-        }, children: [_jsxs(Card, { sx: { borderRadius: 0, px: 2, py: 1 }, children: [_case?.title ? _jsx(Typography, { variant: "body1", children: _case.title }) : _jsx(Skeleton, { height: 24 }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", divider: _jsx(Circle, { color: "disabled", sx: { fontSize: '8px' } }), children: [_jsxs(Typography, { variant: "caption", color: "textSecondary", children: [t('started'), ": ", _case?.created ? dayjs(_case.created).toString() : _jsx(Skeleton, { height: 14 })] }), _case?.escalation ? (_jsx(Chip, { color: ESCALATION_COLOR_MAP[_case.escalation], label: t(_case.escalation) })) : (_jsx(Skeleton, { height: 24 }))] })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith(_case?.case_id)), component: Link, to: `/cases/${_case?.case_id}`, children: [_jsx(Dashboard, { fontSize: "small" }), _jsx(Typography, { variant: "body2", sx: { pl: 1, textWrap: 'nowrap' }, children: t('page.cases.dashboard') })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith('assets')), component: Link, to: `/cases/${_case?.case_id}/assets`, children: [_jsx(Dataset, { fontSize: "small" }), _jsx(Typography, { variant: "body2", sx: { userSelect: 'none', pl: 1, textWrap: 'nowrap' }, children: t('page.cases.assets') })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith('timeline')), component: Link, to: `/cases/${_case?.case_id}/timeline`, children: [_jsx(CalendarMonth, { fontSize: "small" }), _jsx(Typography, { variant: "body2", sx: { userSelect: 'none', pl: 1, textWrap: 'nowrap' }, children: t('page.cases.timeline') })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith('rules')), component: Link, to: `/cases/${_case?.case_id}/rules`, children: [_jsx(Rule, {}), _jsx(Typography, { variant: "body2", sx: { userSelect: 'none', pl: 1, textWrap: 'nowrap' }, children: t('page.cases.rules') })] }), _jsx(Divider, {}), _case && (_jsx(Box, { flex: 1, overflow: "auto", width: "100%", sx: {
+        }, children: [_jsxs(Card, { sx: { borderRadius: 0, px: 2, py: 1 }, children: [_case?.title ? _jsx(Typography, { variant: "body1", children: _case.title }) : _jsx(Skeleton, { height: 24 }), _jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", divider: _jsx(Circle, { color: "disabled", sx: { fontSize: '8px' } }), children: [_jsxs(Typography, { variant: "caption", color: "textSecondary", children: [t('started'), ": ", _case?.created ? dayjs(_case.created).toString() : _jsx(Skeleton, { height: 14 })] }), _case?.escalation ? (_jsx(Chip, { color: ESCALATION_COLOR_MAP[_case.escalation], label: t(_case.escalation) })) : (_jsx(Skeleton, { height: 24 }))] })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith(_case?.case_id)), component: Link, to: `/cases/${_case?.case_id}`, children: [_jsx(Dashboard, { fontSize: "small" }), _jsx(Typography, { variant: "body2", sx: { pl: 1, textWrap: 'nowrap' }, children: t('page.cases.dashboard') })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith('search')), component: Link, to: `/cases/${_case?.case_id}/search`, children: [_jsx(Search, { fontSize: "small" }), _jsx(Typography, { variant: "body2", sx: { userSelect: 'none', pl: 1, textWrap: 'nowrap' }, children: t('page.cases.search') })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith('observables')), component: Link, to: `/cases/${_case?.case_id}/observables`, children: [_jsx(Dataset, { fontSize: "small" }), _jsx(Typography, { variant: "body2", sx: { userSelect: 'none', pl: 1, textWrap: 'nowrap' }, children: t('page.cases.observables') })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith('timeline')), component: Link, to: `/cases/${_case?.case_id}/timeline`, children: [_jsx(CalendarMonth, { fontSize: "small" }), _jsx(Typography, { variant: "body2", sx: { userSelect: 'none', pl: 1, textWrap: 'nowrap' }, children: t('page.cases.timeline') })] }), _jsxs(Stack, { direction: "row", alignItems: "center", sx: navItemSx(location.pathname.endsWith('rules')), component: Link, to: `/cases/${_case?.case_id}/rules`, children: [_jsx(Rule, {}), _jsx(Typography, { variant: "body2", sx: { userSelect: 'none', pl: 1, textWrap: 'nowrap' }, children: t('page.cases.rules') })] }), _jsx(Divider, {}), _case && (_jsx(Box, { flex: 1, overflow: "auto", width: "100%", sx: {
                     position: 'relative',
                     borderRight: `thin solid ${theme.palette.divider}`
                 }, children: _jsxs(Box, { position: "absolute", sx: { left: 0, right: 0 }, children: [_jsx(LinearProgress, { sx: { mb: 0.5, opacity: +loading } }), _jsxs(DndContext, { sensors: sensors, collisionDetection: pointerWithin, onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: [_jsx(CaseFolder, { case: _case, onItemUpdated: update }), _jsx(RootDropZone, { caseId: _case.case_id }), _jsx(DragOverlay, { dropAnimation: null, children: activeDragData && (_jsx(FolderEntry, { caseId: null, path: "", indent: 0, label: activeDragData.label, itemType: activeDragData.type })) })] })] }) }))] }));

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

@@ -146,10 +146,10 @@ describe('CaseSidebar', () => {
             const link = screen.getByText('page.cases.dashboard').closest('a');
             expect(link).toHaveAttribute('href', '/cases/case-1');
         });
-        it('renders an Assets nav link pointing to the case assets route', () => {
+        it('renders an Observables nav link pointing to the case observables route', () => {
             renderSidebar();
-            const link = screen.getByText('page.cases.assets').closest('a');
-            expect(link).toHaveAttribute('href', '/cases/case-1/assets');
+            const link = screen.getByText('page.cases.observables').closest('a');
+            expect(link).toHaveAttribute('href', '/cases/case-1/observables');
         });
         it('renders a Timeline nav link pointing to the case timeline route', () => {
             renderSidebar();

package/components/routes/cases/detail/observables/Observable.d.ts

@@ -0,0 +1,14 @@
+import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
+import type { FC } from 'react';
+export type ObservableType = 'hash' | 'hosts' | 'ip' | 'user' | 'ids' | 'id' | 'uri' | 'signature';
+export interface ObservableEntry {
+    type: ObservableType;
+    value: string;
+    /** IDs of the hits/events this observable was seen in */
+    seenIn: string[];
+}
+declare const Observable: FC<{
+    asset: ObservableEntry;
+    case: Case;
+}>;
+export default Observable;

package/components/routes/cases/detail/{assets/Asset.js → observables/Observable.js}

@@ -2,11 +2,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Card, CardContent, Chip, Stack, Typography } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
-const Asset = ({ asset, case: _case }) => {
+const Observable = ({ asset, case: _case }) => {
     const { t } = useTranslation();
-    return (_jsx(Card, { sx: { height: '100%' }, children: _jsx(CardContent, { children: _jsxs(Stack, { spacing: 1, children: [_jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, children: [_jsx(Chip, { size: "small", label: t(`page.cases.assets.type.${asset.type}`), color: "primary", variant: "outlined" }), _jsx(Typography, { variant: "body2", sx: { wordBreak: 'break-all', fontFamily: 'monospace' }, children: asset.value })] }), asset.seenIn.length > 0 && (_jsxs(Stack, { spacing: 0.5, children: [_jsx(Typography, { variant: "caption", color: "text.secondary", children: t('page.cases.assets.seen_in') }), _jsx(Stack, { direction: "row", flexWrap: "wrap", gap: 0.5, children: asset.seenIn.map(id => {
+    return (_jsx(Card, { sx: { height: '100%' }, children: _jsx(CardContent, { children: _jsxs(Stack, { spacing: 1, children: [_jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, children: [_jsx(Chip, { size: "small", label: t(`page.cases.observables.type.${asset.type}`), color: "primary", variant: "outlined" }), _jsx(Typography, { variant: "body2", sx: { wordBreak: 'break-all', fontFamily: 'monospace' }, children: asset.value })] }), asset.seenIn.length > 0 && (_jsxs(Stack, { spacing: 0.5, children: [_jsx(Typography, { variant: "caption", color: "text.secondary", children: t('page.cases.observables.seen_in') }), _jsx(Stack, { direction: "row", flexWrap: "wrap", gap: 0.5, children: asset.seenIn.map(id => {
                                     const entry = _case.items.find(item => item.value === id);
                                     return (_jsx(Chip, { clickable: true, size: "small", label: entry.path, variant: "outlined", component: Link, to: `/cases/${_case.case_id}/${entry.path}` }, id));
                                 }) })] }))] }) }) }));
 };
-export default Asset;
+export default Observable;

package/components/routes/cases/detail/observables/Observable.test.d.ts

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

package/components/routes/cases/detail/{assets/Asset.test.js → observables/Observable.test.js}

@@ -4,46 +4,46 @@ import { render, screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import { createMockCase } from '@cccsaurora/howler-ui/tests/utils';
 import { describe, expect, it } from 'vitest';
-import Asset, {} from './Asset';
-const makeAsset = (overrides = {}) => ({
+import Observable, {} from './Observable';
+const makeObservable = (overrides = {}) => ({
     type: 'ip',
     value: '192.168.1.1',
     seenIn: [],
     ...overrides
 });
-describe('Asset', () => {
+describe('Observable', () => {
     describe('type chip', () => {
         it('renders the correct label for each type', () => {
             const cases = ['hash', 'hosts', 'ip', 'user', 'ids', 'id', 'uri', 'signature'];
             for (const type of cases) {
-                const { unmount } = render(_jsx(MemoryRouter, { children: _jsx(Asset, { asset: makeAsset({ type, value: 'x' }), case: createMockCase() }) }));
-                expect(screen.getByText(`page.cases.assets.type.${type}`)).toBeTruthy();
+                const { unmount } = render(_jsx(MemoryRouter, { children: _jsx(Observable, { asset: makeObservable({ type, value: 'x' }), case: createMockCase() }) }));
+                expect(screen.getByText(`page.cases.observables.type.${type}`)).toBeTruthy();
                 unmount();
             }
         });
     });
     describe('value display', () => {
         it('renders the asset value', () => {
-            render(_jsx(MemoryRouter, { children: _jsx(Asset, { asset: makeAsset({ value: '10.0.0.1' }), case: createMockCase() }) }));
+            render(_jsx(MemoryRouter, { children: _jsx(Observable, { asset: makeObservable({ value: '10.0.0.1' }), case: createMockCase() }) }));
             expect(screen.getByText('10.0.0.1')).toBeTruthy();
         });
         it('renders long hash values without truncation', () => {
             const hash = 'a'.repeat(64);
-            render(_jsx(MemoryRouter, { children: _jsx(Asset, { asset: makeAsset({ type: 'hash', value: hash }), case: createMockCase() }) }));
+            render(_jsx(MemoryRouter, { children: _jsx(Observable, { asset: makeObservable({ type: 'hash', value: hash }), case: createMockCase() }) }));
             expect(screen.getByText(hash)).toBeTruthy();
         });
     });
     describe('seen-in chips', () => {
         it('renders nothing when seenIn is empty', () => {
-            render(_jsx(MemoryRouter, { children: _jsx(Asset, { asset: makeAsset({ seenIn: [] }), case: createMockCase() }) }));
-            expect(screen.queryByText('page.cases.assets.seen_in')).toBeNull();
+            render(_jsx(MemoryRouter, { children: _jsx(Observable, { asset: makeObservable({ seenIn: [] }), case: createMockCase() }) }));
+            expect(screen.queryByText('page.cases.observables.seen_in')).toBeNull();
         });
         it('renders "Seen in" label when seenIn has entries', () => {
             const _case = createMockCase({
                 items: [{ path: 'alerts/test-analytic (hit-001)', type: 'hit', value: 'hit-001' }]
             });
-            render(_jsx(MemoryRouter, { children: _jsx(Asset, { asset: makeAsset({ seenIn: ['hit-001'] }), case: _case }) }));
-            expect(screen.getByText('page.cases.assets.seen_in')).toBeTruthy();
+            render(_jsx(MemoryRouter, { children: _jsx(Observable, { asset: makeObservable({ seenIn: ['hit-001'] }), case: _case }) }));
+            expect(screen.getByText('page.cases.observables.seen_in')).toBeTruthy();
         });
         it('renders a chip labelled with entry.path for each seenIn id', () => {
             const _case = createMockCase({
@@ -53,7 +53,7 @@ describe('Asset', () => {
                     { path: 'alerts/other-analytic (hit-003)', type: 'hit', value: 'hit-003' }
                 ]
             });
-            render(_jsx(MemoryRouter, { children: _jsx(Asset, { asset: makeAsset({ seenIn: ['hit-001', 'obs-002', 'hit-003'] }), case: _case }) }));
+            render(_jsx(MemoryRouter, { children: _jsx(Observable, { asset: makeObservable({ seenIn: ['hit-001', 'obs-002', 'hit-003'] }), case: _case }) }));
             expect(screen.getByText('alerts/my-analytic (hit-001)')).toBeTruthy();
             expect(screen.getByText('events/obs-002')).toBeTruthy();
             expect(screen.getByText('alerts/other-analytic (hit-003)')).toBeTruthy();
@@ -63,7 +63,7 @@ describe('Asset', () => {
                 case_id: 'case-abc',
                 items: [{ path: 'alerts/my-analytic (hit-001)', type: 'hit', value: 'hit-001' }]
             });
-            render(_jsx(MemoryRouter, { children: _jsx(Asset, { asset: makeAsset({ seenIn: ['hit-001'] }), case: _case }) }));
+            render(_jsx(MemoryRouter, { children: _jsx(Observable, { asset: makeObservable({ seenIn: ['hit-001'] }), case: _case }) }));
             const link = screen.getByText('alerts/my-analytic (hit-001)').closest('a');
             expect(link).not.toBeNull();
             expect(link?.getAttribute('href')).toBe('/cases/case-abc/alerts/my-analytic (hit-001)');

package/components/routes/cases/detail/sidebar/CaseFolder.test.js

@@ -66,6 +66,7 @@ import CaseFolder from './CaseFolder';
 // Fixtures
 // ---------------------------------------------------------------------------
 const makeCase = (id, items = []) => ({
+    __index: 'case',
     case_id: id,
     title: `Case ${id}`,
     items

package/components/routes/cases/detail/sidebar/CaseFolderContextMenu.test.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import { act } from 'react';
+import { createMockCase } from '@cccsaurora/howler-ui/tests/utils';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 // ---------------------------------------------------------------------------
 // Mocks
@@ -51,7 +52,7 @@ import CaseFolderContextMenu, { collectAllLeaves, getOpenUrl } from './CaseFolde
 // ---------------------------------------------------------------------------
 // Fixtures
 // ---------------------------------------------------------------------------
-const mockCase = { case_id: 'case-1', title: 'Test Case', items: [] };
+const mockCase = createMockCase({ case_id: 'case-1' });
 const hitLeaf = { type: 'hit', value: 'hit-123', path: 'folder/hit-item' };
 const referenceLeaf = { type: 'reference', value: 'https://example.com', path: 'folder/ref-item' };
 const eventLeaf = { type: 'event', value: 'obs-456', path: 'folder/event-item' };
@@ -255,7 +256,7 @@ describe('CaseFolderContextMenu', () => {
             });
         });
         it('does not call the API when case_id is missing', () => {
-            renderMenu({ _case: { title: 'No ID' }, leaf: hitLeaf });
+            renderMenu({ _case: createMockCase({ case_id: undefined, title: 'No ID' }), leaf: hitLeaf });
             act(() => {
                 fireEvent.click(screen.getByTestId('remove-item'));
             });

package/components/routes/hits/search/shared/IndexPicker.d.ts

@@ -1,2 +1,8 @@
-declare const _default: import("react").NamedExoticComponent<{}>;
+import type { SearchIndex } from '@cccsaurora/howler-ui/api/v2/search';
+declare const _default: import("react").NamedExoticComponent<{
+    additionalOptions?: {
+        label: string;
+        value: SearchIndex;
+    }[];
+}>;
 export default _default;

package/components/routes/hits/search/shared/IndexPicker.js

@@ -10,11 +10,12 @@ const FILTER_OPTIONS = [
     { label: 'hit.search.index.hit', value: 'hit' },
     { label: 'hit.search.index.event', value: 'event' }
 ];
-const IndexPicker = () => {
+const IndexPicker = ({ additionalOptions = [] }) => {
     const { t } = useTranslation();
     const indexes = useContextSelector(ParameterContext, ctx => ctx.indexes);
     const setIndexes = useContextSelector(ParameterContext, ctx => ctx.setIndexes);
-    const selectedOptions = FILTER_OPTIONS.filter(opt => indexes.includes(opt.value));
-    return (_jsx(ChipPopper, { icon: _jsx(FilterList, { fontSize: "small" }), label: selectedOptions.map(opt => t(opt.label)).join(', '), minWidth: "225px", slotProps: { chip: { size: 'small' } }, children: _jsx(Autocomplete, { size: "small", multiple: true, options: FILTER_OPTIONS, value: selectedOptions, onChange: (_ev, values) => values.length > 0 && setIndexes(values.map(val => val.value)), isOptionEqualToValue: (opt, val) => opt.value === val.value, getOptionLabel: opt => t(opt.label), renderInput: params => _jsx(TextField, { ...params }) }) }));
+    const allOptions = [...FILTER_OPTIONS, ...additionalOptions];
+    const selectedOptions = allOptions.filter(opt => indexes.includes(opt.value));
+    return (_jsx(ChipPopper, { icon: _jsx(FilterList, { fontSize: "small" }), label: selectedOptions.map(opt => t(opt.label)).join(', '), minWidth: "225px", slotProps: { chip: { size: 'small' } }, children: _jsx(Autocomplete, { size: "small", multiple: true, options: allOptions, value: selectedOptions, onChange: (_ev, values) => values.length > 0 && setIndexes(values.map(val => val.value)), isOptionEqualToValue: (opt, val) => opt.value === val.value, getOptionLabel: opt => t(opt.label), renderInput: params => _jsx(TextField, { ...params }) }) }));
 };
 export default memo(IndexPicker);

package/locales/en/translation.json

@@ -116,6 +116,7 @@
     "edit": "Edit",
     "enabled": "Enabled",
     "event.module": "Event Module",
+    "event.open": "Open Event",
     "event.type": "Event Type",
     "features.warning.description": "This feature is undergoing active development, and is not yet in a finished state. You may encounter bugs or instability.",
     "features.warning.title": "Feature In Active Development",
@@ -187,8 +188,8 @@
     "hit.header.target": "Target",
     "hit.header.threat": "Threat",
     "hit.header.view.case": "View case {{id}}",
-    "hit.header.view.hit": "View hit {{id}}",
     "hit.header.view.event": "View event {{id}}",
+    "hit.header.view.hit": "View hit {{id}}",
     "hit.header.votes": "Votes: ",
     "hit.howler.related": "{{count}} related records",
     "hit.label": "Labels",
@@ -231,9 +232,9 @@
     "hit.panel.view.layout": "Change View Panel",
     "hit.quicksearch": "Search by assignment, analytic, detection or status",
     "hit.related.tab.case": "Cases",
+    "hit.related.tab.event": "Events",
     "hit.related.tab.hit": "Hits",
     "hit.related.tab.links": "Links",
-    "hit.related.tab.event": "Events",
     "hit.search.aggregate.button": "Create Summary",
     "hit.search.button": "Perform search",
     "hit.search.custom": "Custom Sort",
@@ -243,8 +244,9 @@
     "hit.search.filter.label": "Lookup Filters",
     "hit.search.filter.values": "Values",
     "hit.search.index": "Indexes",
-    "hit.search.index.hit": "Hits",
+    "hit.search.index.case": "Cases",
     "hit.search.index.event": "Events",
+    "hit.search.index.hit": "Hits",
     "hit.search.invalid": "Invalid Query",
     "hit.search.keyboard": "Keyboard shortcuts",
     "hit.search.keyboard.no_shortcuts": "No shortcuts",
@@ -368,7 +370,6 @@
     "no.data": "No Data",
     "none": "None",
     "normal": "Normal Priority",
-    "event.open": "Open Event",
     "on": "on",
     "open": "Open",
     "operations.add_label": "Add Label",
@@ -390,18 +391,18 @@
     "page.403.title": "403: Access Forbidden",
     "page.404.description": "The page you are looking for cannot be found...",
     "page.404.title": "404: Not found",
-    "page.cases.assets": "Assets",
-    "page.cases.assets.empty": "No assets found.",
-    "page.cases.assets.filter_by_type": "Filter by type:",
-    "page.cases.assets.seen_in": "Seen in",
-    "page.cases.assets.type.hash": "Hash",
-    "page.cases.assets.type.hosts": "Host",
-    "page.cases.assets.type.id": "ID",
-    "page.cases.assets.type.ids": "ID",
-    "page.cases.assets.type.ip": "IP",
-    "page.cases.assets.type.signature": "Signature",
-    "page.cases.assets.type.uri": "URI",
-    "page.cases.assets.type.user": "User",
+    "page.cases.observables": "Observables",
+    "page.cases.observables.empty": "No observables found.",
+    "page.cases.observables.filter_by_type": "Filter by type:",
+    "page.cases.observables.seen_in": "Seen in",
+    "page.cases.observables.type.hash": "Hash",
+    "page.cases.observables.type.hosts": "Host",
+    "page.cases.observables.type.id": "ID",
+    "page.cases.observables.type.ids": "ID",
+    "page.cases.observables.type.ip": "IP",
+    "page.cases.observables.type.signature": "Signature",
+    "page.cases.observables.type.uri": "URI",
+    "page.cases.observables.type.user": "User",
     "page.cases.created": "Created",
     "page.cases.dashboard": "Dashboard",
     "page.cases.dashboard.alerts": "Alerts",
@@ -411,11 +412,11 @@
     "page.cases.dashboard.target": "Targets",
     "page.cases.dashboard.tasks": "Tasks",
     "page.cases.dashboard.tasks.add": "Add Task",
+    "page.cases.dashboard.tasks.child.empty": "No tasks in this child case.",
     "page.cases.dashboard.tasks.child_cases": "Child Cases",
     "page.cases.dashboard.tasks.filter_cases": "Filter child cases",
-    "page.cases.dashboard.tasks.show_child": "Show child case tasks",
     "page.cases.dashboard.tasks.hide_child": "Hide child case tasks",
-    "page.cases.dashboard.tasks.child.empty": "No tasks in this child case.",
+    "page.cases.dashboard.tasks.show_child": "Show child case tasks",
     "page.cases.dashboard.threat": "Threats",
     "page.cases.detail.participants": "Participants",
     "page.cases.detail.properties": "Properties",
@@ -434,6 +435,7 @@
     "page.cases.rules.no_expiry": "No expiry",
     "page.cases.rules.query": "Match Query",
     "page.cases.rules.timeframe": "Rule Expiry",
+    "page.cases.search": "Search",
     "page.cases.sidebar.folder.remove": "Remove folder",
     "page.cases.sidebar.item.open": "Open item",
     "page.cases.sidebar.item.remove": "Remove item",
@@ -847,6 +849,13 @@
     "rule.interval.thirty.minutes": "Every thirty minutes",
     "rule.interval.three.hours": "Every three hours",
     "save": "Save",
+    "search.fuzzy.no_results": "No results found.",
+    "search.fuzzy.placeholder": "Search by IP, domain, hash, email, or keyword...",
+    "search.fuzzy.results.cases": "Cases",
+    "search.fuzzy.results.events": "Events",
+    "search.fuzzy.results.hits": "Hits",
+    "search.fuzzy.title": "Fuzzy Search",
+    "search.fuzzy.total_results": "results found",
     "search.layout.settings": "Edit search result layout",
     "search.open": "Open Search",
     "search.result.showing": "Showing {{offset}} to {{length}} of {{total}} results",