@cccsaurora/howler-ui 2.18.0-dev.736 → 2.18.0-dev.739

package/components/routes/cases/constants.js

@@ -1,5 +0,0 @@
-export const ESCALATION_COLOR_MAP = {
-    normal: 'default',
-    focus: 'warning',
-    crisis: 'error'
-};

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

@@ -1,6 +0,0 @@
-import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
-import { type FC } from 'react';
-declare const AlertPanel: FC<{
-    case: Case;
-}>;
-export default AlertPanel;

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

@@ -1,33 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Divider, Pagination, Skeleton, Stack, Typography, useTheme } from '@mui/material';
-import HitCard from '@cccsaurora/howler-ui/components/elements/hit/HitCard';
-import { HitLayout } from '@cccsaurora/howler-ui/components/elements/hit/HitLayout';
-import { chunk, uniq } from 'lodash-es';
-import { useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Link } from 'react-router-dom';
-const AlertPanel = ({ case: _case }) => {
-    const theme = useTheme();
-    const { t } = useTranslation();
-    const [alertPage, setAlertPage] = useState(1);
-    const alertPages = useMemo(() => chunk(uniq((_case?.items ?? []).filter(item => item.type === 'hit')), 5), [_case?.items]);
-    if (!_case) {
-        return _jsx(Skeleton, { height: 240 });
-    }
-    return (_jsxs(Stack, { spacing: 1, children: [_jsxs(Stack, { direction: "row", children: [_jsx(Typography, { flex: 1, variant: "h4", children: t('page.cases.dashboard.alerts') }), _jsx(Pagination, { count: alertPages.length, page: alertPage, onChange: (_, page) => setAlertPage(page) })] }), _jsx(Divider, {}), alertPages?.length > 0 &&
-                alertPages[alertPage - 1].map(item => (_jsxs(Box, { position: "relative", children: [_jsx(HitCard, { layout: HitLayout.DENSE, id: item.value, lazy: true }), _jsx(Box, { component: Link, to: item.path, sx: {
-                                position: 'absolute',
-                                top: 0,
-                                left: 0,
-                                width: '100%',
-                                height: '100%',
-                                cursor: 'pointer',
-                                zIndex: 100,
-                                borderRadius: '4px',
-                                '&:hover': {
-                                    background: theme.palette.divider,
-                                    border: `thin solid ${theme.palette.primary.light}`
-                                }
-                            } })] }, item.path)))] }));
-};
-export default AlertPanel;

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

@@ -1,11 +0,0 @@
-import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
-import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
-import type { Observable } from '@cccsaurora/howler-ui/models/entities/generated/Observable';
-import { type AssetEntry } from './assets/Asset';
-/** Deduplicate and merge seenIn lists into a map keyed by `type:value` */
-export declare const buildAssetEntries: (records: Partial<Hit | Observable>[]) => AssetEntry[];
-declare const _default: import("react").NamedExoticComponent<{
-    case?: Case;
-    caseId?: string;
-}>;
-export default _default;

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

@@ -1,104 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Chip, Grid, Skeleton, Stack, Typography } from '@mui/material';
-import api from '@cccsaurora/howler-ui/api';
-import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
-import { memo, useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useOutletContext } from 'react-router-dom';
-import useCase from '../hooks/useCase';
-import Asset, {} from './assets/Asset';
-/** All Related fields that carry asset values */
-const ASSET_FIELDS = ['hash', 'hosts', 'ip', 'user', 'ids', 'id', 'uri', 'signature'];
-/** Extract (type, value, seenInId) triples from a record's related field */
-const extractAssets = (related, recordId) => {
-    if (!related) {
-        return [];
-    }
-    const results = [];
-    for (const field of ASSET_FIELDS) {
-        const raw = related[field];
-        if (!raw) {
-            continue;
-        }
-        const values = Array.isArray(raw) ? raw : [raw];
-        for (const value of values) {
-            if (value) {
-                results.push({ type: field, value: String(value), id: recordId });
-            }
-        }
-    }
-    return results;
-};
-/** Deduplicate and merge seenIn lists into a map keyed by `type:value` */
-export const buildAssetEntries = (records) => {
-    const map = new Map();
-    for (const record of records) {
-        const related = record.related ?? record.related;
-        const recordId = record.howler?.id ?? record.howler?.id;
-        if (!recordId) {
-            continue;
-        }
-        for (const { type, value, id } of extractAssets(related, recordId)) {
-            const key = `${type}:${value}`;
-            if (!map.has(key)) {
-                map.set(key, { type, value, seenIn: [] });
-            }
-            const entry = map.get(key);
-            if (!entry.seenIn.includes(id)) {
-                entry.seenIn.push(id);
-            }
-        }
-    }
-    return Array.from(map.values());
-};
-const RELATED_FIELDS = ASSET_FIELDS.map(f => `related.${f}`).join(',');
-const CaseAssets = ({ case: providedCase, caseId }) => {
-    const { t } = useTranslation();
-    const { dispatchApi } = useMyApi();
-    const routeCase = useOutletContext();
-    const { case: _case } = useCase({ case: providedCase ?? routeCase, caseId });
-    const [records, setRecords] = useState(null);
-    const [activeFilters, setActiveFilters] = useState(new Set());
-    const ids = useMemo(() => (_case?.items ?? [])
-        .filter(item => ['hit', 'observable'].includes(item.type))
-        .map(item => item.value)
-        .filter(val => !!val), [_case?.items]);
-    useEffect(() => {
-        if (ids.length < 1) {
-            setRecords([]);
-            return;
-        }
-        dispatchApi(api.v2.search.post(['hit', 'observable'], {
-            query: `howler.id:(${ids.join(' OR ')})`,
-            fl: `howler.id,${RELATED_FIELDS}`
-        })).then(response => setRecords(response.items));
-    }, [dispatchApi, ids]);
-    const allAssets = useMemo(() => (records ? buildAssetEntries(records) : []), [records]);
-    const assetTypes = useMemo(() => (allAssets ? [...new Set(allAssets.map(a => a.type))].sort() : []), [allAssets]);
-    const filteredAssets = useMemo(() => {
-        if (allAssets.length < 1) {
-            return [];
-        }
-        if (activeFilters.size === 0) {
-            return allAssets;
-        }
-        return allAssets.filter(a => activeFilters.has(a.type));
-    }, [allAssets, activeFilters]);
-    const toggleFilter = (type) => {
-        setActiveFilters(prev => {
-            const next = new Set(prev);
-            if (next.has(type)) {
-                next.delete(type);
-            }
-            else {
-                next.add(type);
-            }
-            return next;
-        });
-    };
-    if (!_case) {
-        return null;
-    }
-    return (_jsxs(Grid, { container: true, spacing: 2, px: 2, children: [_jsx(Grid, { item: true, xs: 12, children: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, flexWrap: "wrap", children: [_jsx(Typography, { variant: "subtitle2", color: "text.secondary", children: t('page.cases.assets.filter_by_type') }), records === null ? (_jsx(Skeleton, { width: 240, height: 32 })) : (assetTypes.map(type => (_jsx(Chip, { label: t(`page.cases.assets.type.${type}`), size: "small", onClick: () => toggleFilter(type), color: activeFilters.has(type) ? 'primary' : 'default', variant: activeFilters.has(type) ? 'filled' : 'outlined' }, type))))] }) }), records === null ? (Array.from({ length: 6 }, (_, i) => (_jsx(Grid, { item: true, xs: 12, sm: 6, md: 4, xl: 3, children: _jsx(Skeleton, { height: 100 }) }, `skeleton-${i}`)))) : filteredAssets.length === 0 ? (_jsx(Grid, { item: true, xs: 12, children: _jsx(Typography, { color: "text.secondary", children: t('page.cases.assets.empty') }) })) : (filteredAssets.map(asset => (_jsx(Grid, { item: true, xs: 12, md: 6, xl: 4, children: _jsx(Asset, { asset: asset, case: _case }) }, `${asset.type}:${asset.value}`))))] }));
-};
-export default memo(CaseAssets);

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

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

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

@@ -1,167 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/// <reference types="vitest" />
-import { act, render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { createElement } from 'react';
-import { MemoryRouter } from 'react-router-dom';
-import { createMockHit, createMockObservable } from '@cccsaurora/howler-ui/tests/utils';
-import { describe, expect, it, vi } from 'vitest';
-import { buildAssetEntries } from './CaseAssets';
-// ---------------------------------------------------------------------------
-// Pure logic tests — no React needed
-// ---------------------------------------------------------------------------
-describe('buildAssetEntries', () => {
-    it('returns an empty array for records with no related field', () => {
-        expect(buildAssetEntries([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'] } })]);
-        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([
-            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([
-            createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } }),
-            createMockObservable({ howler: { id: 'obs1' }, related: { ip: ['1.2.3.4'] } })
-        ]);
-        expect(result).toHaveLength(1);
-        expect(result[0].seenIn).toEqual(['h1', 'obs1']);
-    });
-    it('keeps distinct asset values as separate entries', () => {
-        const result = buildAssetEntries([
-            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([
-            createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } }),
-            createMockHit({ howler: { id: 'h1' }, related: { ip: ['1.2.3.4'] } })
-        ]);
-        expect(result[0].seenIn).toEqual(['h1']);
-    });
-    it('skips records with no howler.id', () => {
-        const noId = { related: { ip: ['1.2.3.4'] } };
-        expect(buildAssetEntries([noId])).toEqual([]);
-    });
-    it('handles the scalar `id` field on Related', () => {
-        const result = buildAssetEntries([createMockHit({ howler: { id: 'h1' }, related: { id: 'some-id' } })]);
-        expect(result).toHaveLength(1);
-        expect(result[0]).toEqual({ type: 'id', value: 'some-id', seenIn: ['h1'] });
-    });
-    it('handles array fields like hash, hosts, user, ids, uri, signature', () => {
-        const related = {
-            hash: ['abc123'],
-            hosts: ['host.example.com'],
-            user: ['bob'],
-            ids: ['guid-1'],
-            uri: ['https://example.com'],
-            signature: ['rule-X']
-        };
-        const result = buildAssetEntries([createMockHit({ howler: { id: 'h1' }, related })]);
-        const types = result.map(a => a.type).sort();
-        expect(types).toEqual(['hash', 'hosts', 'ids', 'signature', 'uri', 'user']);
-    });
-});
-// ---------------------------------------------------------------------------
-// Component rendering tests
-// ---------------------------------------------------------------------------
-const mockDispatchApi = vi.fn();
-vi.mock('components/hooks/useMyApi', () => ({
-    default: () => ({ dispatchApi: mockDispatchApi })
-}));
-vi.mock('../hooks/useCase', () => ({
-    default: ({ case: c }) => ({ case: c, updateCase: vi.fn(), loading: false, missing: false })
-}));
-const mockCase = {
-    case_id: 'case-001',
-    items: [
-        { type: 'hit', value: 'hit-1' },
-        { type: 'observable', value: 'obs-1' }
-    ]
-};
-const Wrapper = ({ children }) => createElement(MemoryRouter, { initialEntries: ['/cases/case-001/assets'] }, children);
-// lazy import the component after mocks are set up
-const CaseAssets = (await import('./CaseAssets')).default;
-describe('CaseAssets component', () => {
-    beforeEach(() => {
-        mockDispatchApi.mockClear();
-    });
-    it('renders skeletons while records are loading', () => {
-        mockDispatchApi.mockReturnValue(new Promise(() => { })); // never resolves
-        render(_jsx(CaseAssets, { 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 () => {
-        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');
-    });
-    it('renders asset cards for extracted assets', 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.findByText('1.2.3.4');
-        expect(screen.getByText('alice')).toBeTruthy();
-    });
-    it('renders a filter chip for each asset 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);
-    });
-    it('filters assets 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
-        await screen.findByText('1.2.3.4');
-        expect(screen.getByText('alice')).toBeTruthy();
-        // Click the 'ip' filter chip
-        await act(async () => {
-            await userEvent.click(screen.getByRole('button', { name: 'page.cases.assets.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 () => {
-        mockDispatchApi.mockResolvedValue({
-            items: [{ howler: { id: 'hit-1' }, related: { ip: ['1.2.3.4'], user: ['alice'] } }]
-        });
-        render(_jsx(CaseAssets, { case: mockCase }), { wrapper: Wrapper });
-        await screen.findByText('1.2.3.4');
-        const ipChip = screen.getByRole('button', { name: 'page.cases.assets.type.ip' });
-        await act(async () => {
-            await userEvent.click(ipChip);
-        });
-        await act(async () => {
-            await userEvent.click(ipChip);
-        });
-        expect(screen.getByText('1.2.3.4')).toBeTruthy();
-        expect(screen.getByText('alice')).toBeTruthy();
-    });
-    it('renders nothing when the case has no hit/observable items', async () => {
-        const emptyCase = { case_id: 'case-002', items: [] };
-        render(_jsx(CaseAssets, { case: emptyCase }), { wrapper: Wrapper });
-        await screen.findByText('page.cases.assets.empty');
-        expect(mockDispatchApi).not.toHaveBeenCalled();
-    });
-});

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

@@ -1,7 +0,0 @@
-import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
-import { type FC } from 'react';
-declare const CaseDashboard: FC<{
-    case?: Case;
-    caseId?: string;
-}>;
-export default CaseDashboard;

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

@@ -1,66 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Grid, useTheme } from '@mui/material';
-import api from '@cccsaurora/howler-ui/api';
-import { RecordContext } from '@cccsaurora/howler-ui/components/app/providers/RecordProvider';
-import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
-import dayjs from 'dayjs';
-import { difference, get, isNil } from 'lodash-es';
-import { useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useOutletContext } from 'react-router-dom';
-import { useContextSelector } from 'use-context-selector';
-import useCase from '../hooks/useCase';
-import CaseAggregate from './aggregates/CaseAggregate';
-import AlertPanel from './AlertPanel';
-import CaseOverview from './CaseOverview';
-import RelatedCasePanel from './RelatedCasePanel';
-import TaskPanel from './TaskPanel';
-const AGGREGATE_FIELDS = [
-    ['howler.outline.threat', 'material-symbols:warning-rounded', 'warning.main', 'page.cases.dashboard.threat'],
-    ['howler.outline.target', 'material-symbols:group', 'primary.main', 'page.cases.dashboard.target'],
-    ['howler.outline.indicators', 'fluent:number-symbol-24-filled', null, 'page.cases.dashboard.indicators']
-];
-const getDuration = (case_) => {
-    if (case_?.start) {
-        return dayjs
-            .duration(dayjs(case_?.end ?? new Date()).diff(dayjs(case_.start), 'minute'), 'minute')
-            .format('HH[h] mm[m]');
-    }
-    return '--';
-};
-const CaseDashboard = ({ case: providedCase, caseId }) => {
-    const { t } = useTranslation();
-    const { dispatchApi } = useMyApi();
-    const theme = useTheme();
-    const routeCase = useOutletContext();
-    const { case: _case, update: updateCase } = useCase({ case: providedCase ?? routeCase, caseId });
-    const [invalidIds, setInvalidIds] = useState([]);
-    const ids = useMemo(() => (_case?.items ?? [])
-        .filter(item => ['hit', 'observable'].includes(item.type))
-        .map(item => item.value)
-        .filter(val => !!val), [_case?.items]);
-    const records = useContextSelector(RecordContext, ctx => ctx.records);
-    const loadRecords = useContextSelector(RecordContext, ctx => ctx.loadRecords);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    const caseRecords = useMemo(() => Object.fromEntries(ids.map(id => [id, records[id]])), [ids, records]);
-    useEffect(() => {
-        const missingIds = Object.entries(caseRecords)
-            .filter(([id, record]) => !invalidIds.includes(id) && isNil(record))
-            .map(([id]) => id);
-        if (missingIds.length < 1) {
-            return;
-        }
-        dispatchApi(api.v2.search.post(['hit', 'observable'], {
-            query: `howler.id:(${missingIds.join(' OR ')})`,
-            metadata: ['template', 'analytic']
-        })).then(response => {
-            loadRecords(response.items);
-            setInvalidIds(difference(missingIds, response.items.map(record => record.howler.id)));
-        });
-    }, [caseRecords, dispatchApi, ids, invalidIds, loadRecords]);
-    if (!_case) {
-        return null;
-    }
-    return (_jsxs(Grid, { container: true, spacing: 5, width: "100%", px: 2, children: [_jsx(Grid, { item: true, xs: 12, children: _jsx(CaseOverview, { case: _case, updateCase: updateCase }) }), AGGREGATE_FIELDS.map(([field, icon, iconColor, subtitle]) => (_jsx(Grid, { item: true, xs: 12, md: 6, xl: 3, children: _jsx(CaseAggregate, { icon: icon, iconColor: iconColor && get(theme.palette, iconColor), field: field, records: Object.values(caseRecords), subtitle: t(subtitle) }) }, field))), _jsx(Grid, { item: true, xs: 12, md: 6, xl: 3, children: _jsx(CaseAggregate, { icon: "mingcute:heartbeat-line", iconColor: theme.palette.error.light, title: getDuration(_case), subtitle: t('page.cases.dashboard.duration') }) }), _jsx(Grid, { item: true, xs: 12, children: _jsx(TaskPanel, { case: _case, updateCase: updateCase }) }), _jsx(Grid, { item: true, xs: 12, children: _jsx(AlertPanel, { case: _case }) }), _jsx(Grid, { item: true, xs: 12, children: _jsx(RelatedCasePanel, { case: _case }) })] }));
-};
-export default CaseDashboard;

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

@@ -1,6 +0,0 @@
-import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
-import { type FC } from 'react';
-declare const CaseDetails: FC<{
-    case: Case;
-}>;
-export default CaseDetails;

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

@@ -1,61 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Check, FormatListBulleted, HourglassBottom, Pause, People, WarningRounded } from '@mui/icons-material';
-import { Autocomplete, Card, Chip, Divider, LinearProgress, Skeleton, Stack, Table, TableBody, TableCell, TableRow, TextField, Typography } from '@mui/material';
-import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
-import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
-import UserList from '@cccsaurora/howler-ui/components/elements/UserList';
-import dayjs from 'dayjs';
-import { useContext, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import useCase from '../hooks/useCase';
-import ResolveModal from '../modals/ResolveModal';
-import SourceAggregate from './aggregates/SourceAggregate';
-const CaseDetails = ({ case: providedCase }) => {
-    const { t } = useTranslation();
-    const { case: _case, update: updateCase } = useCase({ case: providedCase });
-    const { showModal } = useContext(ModalContext);
-    const { config } = useContext(ApiConfigContext);
-    const [loading, setLoading] = useState(false);
-    const wrappedUpdate = async (subset) => {
-        try {
-            setLoading(true);
-            await updateCase(subset);
-        }
-        finally {
-            setLoading(false);
-        }
-    };
-    const handleStatus = (status) => {
-        if (status === 'resolved') {
-            const onConfirm = () => wrappedUpdate({ status });
-            showModal(_jsx(ResolveModal, { case: _case, onConfirm: onConfirm }), { maxHeight: '80vh' });
-        }
-        else {
-            wrappedUpdate({ status });
-        }
-    };
-    if (!_case) {
-        return (_jsx(Card, { sx: {
-                borderRadius: 0,
-                width: '300px',
-                maxHeight: 'calc(100vh - 64px)',
-                display: 'flex',
-                flexDirection: 'column',
-                p: 1
-            }, children: _jsx(Skeleton, { variant: "rounded", height: 50 }) }));
-    }
-    return (_jsxs(Card, { elevation: 1, sx: {
-            borderRadius: 0,
-            width: '300px',
-            maxHeight: 'calc(100vh - 64px)',
-            display: 'flex',
-            flexDirection: 'column',
-            p: 1,
-            position: 'relative'
-        }, children: [_jsx(LinearProgress, { sx: { opacity: +loading, position: 'absolute', top: 0, left: 0, right: 0 } }), _jsxs(Stack, { spacing: 2, children: [_jsxs(Stack, { spacing: 1, children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [{
-                                        'in-progress': _jsx(HourglassBottom, { color: "warning" }),
-                                        'on-hold': _jsx(Pause, { color: "disabled" }),
-                                        resolved: _jsx(Check, { color: "success" })
-                                    }[_case.status] ?? _jsx(WarningRounded, { fontSize: "small" }), _jsx(Typography, { variant: "body1", children: t('page.cases.detail.status') })] }), _jsx(Autocomplete, { size: "small", disabled: loading, value: _case.status, options: config.lookups['howler.status'], renderInput: params => _jsx(TextField, { ...params, size: "small" }), onChange: (_ev, status) => handleStatus(status) })] }), _jsx(Divider, {}), _jsxs(Stack, { spacing: 1, children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(People, {}), _jsx(Typography, { variant: "body1", children: t('page.cases.detail.participants') })] }), _jsx(UserList, { buttonSx: { alignSelf: 'start' }, multiple: true, i18nLabel: "page.cases.detail.assignment", userIds: _case.participants ?? [], onChange: participants => wrappedUpdate({ participants }), disabled: loading })] }), _jsx(Divider, {}), _jsxs(Stack, { spacing: 1, children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(FormatListBulleted, {}), _jsx(Typography, { variant: "body1", children: t('page.cases.detail.properties') })] }), _jsx(Table, { sx: { '& td': { p: 1 } }, children: _jsxs(TableBody, { children: [_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(Typography, { variant: "caption", children: t('page.cases.escalation') }) }), _jsx(TableCell, { children: _jsx(Chip, { size: "small", label: _case.escalation }) })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(Typography, { variant: "caption", children: t('page.cases.created') }) }), _jsx(TableCell, { children: _jsx(Typography, { variant: "caption", children: dayjs(_case.created).toString() }) })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(Typography, { variant: "caption", children: t('page.cases.updated') }) }), _jsx(TableCell, { children: _jsx(Typography, { variant: "caption", children: dayjs(_case.updated).toString() }) })] }), _jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(Typography, { variant: "caption", children: t('page.cases.sources') }) }), _jsx(TableCell, { children: _jsx(Typography, { variant: "caption", children: _jsx(SourceAggregate, { case: _case }) }) })] })] }) })] })] })] }));
-};
-export default CaseDetails;

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

@@ -1,7 +0,0 @@
-import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
-import { type FC } from 'react';
-declare const CaseOverview: FC<{
-    case: Case;
-    updateCase: (_case: Partial<Case>) => Promise<void>;
-}>;
-export default CaseOverview;

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

@@ -1,43 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Clear, Edit, Save } from '@mui/icons-material';
-import { Box, Card, CardContent, CardHeader, Divider, IconButton, LinearProgress, Skeleton, Stack, useTheme } from '@mui/material';
-import Markdown from '@cccsaurora/howler-ui/components/elements/display/Markdown';
-import MarkdownEditor from '@cccsaurora/howler-ui/components/elements/MarkdownEditor';
-import { useEffect, useState } from 'react';
-const CaseOverview = ({ case: _case, updateCase }) => {
-    const theme = useTheme();
-    const [editing, setEditing] = useState(false);
-    const [loading, setLoading] = useState(false);
-    const [overview, setOverview] = useState(_case?.overview);
-    useEffect(() => {
-        if (!editing && _case?.overview) {
-            setOverview(_case.overview);
-        }
-    }, [_case?.overview, editing]);
-    if (!_case) {
-        return _jsx(Skeleton, { height: 370 });
-    }
-    return (_jsxs(Card, { children: [_jsx(CardHeader, { title: _case.title, subheader: _case.summary }), _jsxs(Stack, { children: [_jsx(Divider, {}), _jsx(LinearProgress, { sx: { opacity: +loading } })] }), _jsx(CardContent, { sx: { position: 'relative' }, children: _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(Box, { flex: 1, sx: {
-                                '& > :first-child': {
-                                    marginTop: '0 !important'
-                                },
-                                '& > h1,h2,h3,h4,h5': {
-                                    fontSize: theme.typography.h5.fontSize
-                                }
-                            }, children: editing ? (_jsx(MarkdownEditor, { height: "40vh", content: overview, setContent: _content => setOverview(_content) })) : (_jsx(Markdown, { md: _case.overview })) }), _jsxs(Stack, { spacing: 1, children: [_jsx(IconButton, { size: "small", disabled: loading, onClick: async () => {
-                                        if (editing) {
-                                            try {
-                                                setLoading(true);
-                                                await updateCase({ overview });
-                                            }
-                                            finally {
-                                                setEditing(false);
-                                                setLoading(false);
-                                            }
-                                        }
-                                        else {
-                                            setEditing(true);
-                                        }
-                                    }, children: editing ? _jsx(Save, { color: loading ? 'disabled' : 'success', fontSize: "small" }) : _jsx(Edit, { fontSize: "small" }) }), editing && (_jsx(IconButton, { size: "small", disabled: loading, onClick: () => setEditing(false), children: _jsx(Clear, { color: loading ? 'disabled' : 'error', fontSize: "small" }) }))] })] }) })] }));
-};
-export default CaseOverview;

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

@@ -1,8 +0,0 @@
-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;