@cccsaurora/howler-ui 3.1.0-dev.1700 → 3.1.0-dev.1707

package/api/search/fields/event.d.ts

@@ -0,0 +1,3 @@
+import type { SearchField } from '@cccsaurora/howler-ui/api/search/fields';
+export declare const uri: () => string;
+export declare const get: () => Promise<SearchField[]>;

package/api/search/fields/event.js

@@ -0,0 +1,8 @@
+import { hget, joinUri } from '@cccsaurora/howler-ui/api';
+import { indexed, uri as parentUri } from '@cccsaurora/howler-ui/api/search/fields';
+export const uri = () => {
+    return joinUri(parentUri(), 'event');
+};
+export const get = async () => {
+    return indexed((await hget(uri())) ?? {});
+};

package/api/search/fields/index.d.ts

@@ -1,3 +1,4 @@
+import * as event from '@cccsaurora/howler-ui/api/search/fields/event';
 import * as hit from '@cccsaurora/howler-ui/api/search/fields/hit';
 import * as user from '@cccsaurora/howler-ui/api/search/fields/user';
 export type SearchField = {
@@ -8,6 +9,10 @@ export type SearchField = {
     stored: boolean;
     type: string;
     description?: string;
+    deprecated?: boolean;
+    deprecated_description?: string;
+    regex?: string;
+    values?: string[];
 };
 export declare const uri: () => string;
 export declare const map: (fields: {
@@ -16,4 +21,4 @@ export declare const map: (fields: {
 export declare const indexed: (fields: {
     [key: string]: SearchField;
 }) => SearchField[];
-export { hit, user };
+export { event, hit, user };

package/api/search/fields/index.js

@@ -1,4 +1,5 @@
 import { uri as parentUri } from '@cccsaurora/howler-ui/api/search';
+import * as event from '@cccsaurora/howler-ui/api/search/fields/event';
 import * as hit from '@cccsaurora/howler-ui/api/search/fields/hit';
 import * as user from '@cccsaurora/howler-ui/api/search/fields/user';
 // import urlJoin from 'url-join';
@@ -12,4 +13,4 @@ export const map = (fields) => {
 export const indexed = (fields) => {
     return map(fields).filter(field => field.indexed);
 };
-export { hit, user };
+export { event, hit, user };

package/api/v2/index.d.ts

@@ -1,5 +1,6 @@
 import * as case_ from '@cccsaurora/howler-ui/api/v2/case';
 import * as fuzzy from '@cccsaurora/howler-ui/api/v2/fuzzy';
+import * as ingest from '@cccsaurora/howler-ui/api/v2/ingest';
 import * as search from '@cccsaurora/howler-ui/api/v2/search';
 export declare const uri: () => string;
-export { case_ as case, fuzzy, search };
+export { case_ as case, fuzzy, ingest, search };

package/api/v2/index.js

@@ -1,7 +1,8 @@
 import * as case_ from '@cccsaurora/howler-ui/api/v2/case';
 import * as fuzzy from '@cccsaurora/howler-ui/api/v2/fuzzy';
+import * as ingest from '@cccsaurora/howler-ui/api/v2/ingest';
 import * as search from '@cccsaurora/howler-ui/api/v2/search';
 export const uri = () => {
     return '/api/v2';
 };
-export { case_ as case, fuzzy, search };
+export { case_ as case, fuzzy, ingest, search };

package/api/v2/ingest.d.ts

@@ -0,0 +1,3 @@
+import { type HowlerRefreshParam } from '@cccsaurora/howler-ui/api';
+export declare const uri: (index: string) => string;
+export declare const post: (index: string, records: Record<string, unknown>[], refresh?: HowlerRefreshParam) => Promise<string[] | undefined>;

package/api/v2/ingest.js

@@ -0,0 +1,8 @@
+import { hpost, joinAllUri } from '@cccsaurora/howler-ui/api';
+import { uri as parentUri } from '@cccsaurora/howler-ui/api/v2';
+export const uri = (index) => {
+    return joinAllUri(parentUri(), 'ingest', index);
+};
+export const post = (index, records, refresh) => {
+    return hpost(uri(index), records, undefined, refresh ? new URLSearchParams({ refresh }) : undefined);
+};

package/components/app/providers/RecordSearchProvider.test.js

@@ -297,7 +297,8 @@ describe('RecordSearchContext', () => {
                 hook.result.current('test query');
             });
             await waitFor(() => {
-                expect(hpost).toHaveBeenCalledWith('/api/v2/search/hit', expect.objectContaining({
+                const searchRequest = vi.mocked(hpost).mock.calls.find(([url]) => url === '/api/v2/search/hit')?.[1];
+                expect(searchRequest).toEqual(expect.objectContaining({
                     filters: expect.arrayContaining([
                         'event.provider:"azure"',
                         '-howler.outline.indicators:("a" OR "b")',

package/components/elements/event/EventPreview.js

@@ -7,6 +7,6 @@ import { Link } from 'react-router';
 const EventPreview = ({ event }) => {
     const { t } = useTranslation();
     const theme = useTheme();
-    return (_jsx(Stack, { flex: 1, spacing: 1, sx: { overflow: 'hidden', borderBottom: `thin solid ${theme.palette.divider}`, pb: 1, mb: 0 }, children: _jsxs(Stack, { children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Typography, { variant: "body1", fontWeight: "bold", children: event.event.provider }), _jsx("div", { style: { flex: 1 } }), _jsx(Chip, { label: event.event.kind }), event.event.reference && (_jsx(IconButton, { size: "small", component: Link, to: event.event.reference, sx: { opacity: 1 }, target: "_blank", rel: "noopener noreferrer", children: _jsx(OpenInNew, { fontSize: "small" }) }))] }), event.event.type && (_jsxs(Typography, { variant: "caption", children: [t('event.type'), " - ", event.event.type.join(', ')] })), event.event.module && (_jsxs(Typography, { variant: "caption", children: [t('event.module'), " - ", event.event.module] }))] }) }));
+    return (_jsx(Stack, { flex: 1, spacing: 1, sx: { overflow: 'hidden', borderBottom: `thin solid ${theme.palette.divider}`, pb: 1, mb: 0 }, children: _jsxs(Stack, { children: [_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(Typography, { variant: "body1", fontWeight: "bold", children: event.message || event.event.provider }), _jsx("div", { style: { flex: 1 } }), _jsx(Chip, { label: event.event.kind }), event.event.reference && (_jsx(IconButton, { size: "small", component: Link, to: event.event.reference, sx: { opacity: 1 }, target: "_blank", rel: "noopener noreferrer", children: _jsx(OpenInNew, { fontSize: "small" }) }))] }), event.message && event.event.provider && (_jsxs(Typography, { variant: "caption", children: [t('event.provider'), " - ", event.event.provider] })), event.event.type && (_jsxs(Typography, { variant: "caption", children: [t('event.type'), " - ", event.event.type.join(', ')] })), event.event.module && (_jsxs(Typography, { variant: "caption", children: [t('event.module'), " - ", event.event.module] }))] }) }));
 };
 export default memo(EventPreview);

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

@@ -1,10 +1,11 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DndContext, DragOverlay, MouseSensor, pointerWithin, TouchSensor, useSensor, useSensors } from '@dnd-kit/core';
-import { AddCircle, CalendarMonth, Circle, Dashboard, Dataset, Description, Folder, Refresh, Rule, Search, UnfoldLess } from '@mui/icons-material';
+import { AddCircle, CalendarMonth, Circle, Dashboard, Dataset, Description, Event as EventIcon, Folder, Refresh, Rule, Search, UnfoldLess } from '@mui/icons-material';
 import { alpha, Box, Card, Chip, IconButton, LinearProgress, Skeleton, Stack, Tooltip, Typography, useTheme } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
 import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
 import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
+import AddEventModal from '@cccsaurora/howler-ui/components/routes/cases/modals/AddEventModal';
 import AddToCaseModal from '@cccsaurora/howler-ui/components/routes/cases/modals/AddToCaseModal';
 import dayjs from 'dayjs';
 import { useCallback, useContext, useReducer, useState } from 'react';
@@ -90,13 +91,27 @@ const CaseSidebar = ({ case: _case, update }) => {
             setLoading(false);
         }
     }, [_case, dispatchApi, update]);
+    if (!_case) {
+        return null;
+    }
     return (_jsxs(Box, { sx: {
             flex: 1,
             maxWidth: '350px',
             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 }))] })] }), _case ? (_jsxs(_Fragment, { children: [_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') })] })] })) : (_jsxs(_Fragment, { children: [_jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 })] })), _jsx(Card, { sx: { borderRadius: 0, p: 0.25 }, children: _jsxs(Stack, { direction: "row", spacing: 0.25, children: [_jsx("div", { style: { flex: 1 } }), _jsx(Tooltip, { title: t('page.cases.sidebar.add_item'), children: _jsxs(IconButton, { size: "small", sx: { position: 'relative' }, onClick: () => {
+        }, 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 }))] })] }), _case ? (_jsxs(_Fragment, { children: [_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') })] })] })) : (_jsxs(_Fragment, { children: [_jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 }), _jsx(Skeleton, { height: 28 })] })), _jsx(Card, { sx: { borderRadius: 0, p: 0.25 }, children: _jsxs(Stack, { direction: "row", spacing: 0.25, children: [_jsx("div", { style: { flex: 1 } }), _jsx(Tooltip, { title: t('page.cases.sidebar.add_event'), children: _jsxs(IconButton, { size: "small", sx: { position: 'relative' }, onClick: () => {
+                                    if (_case) {
+                                        showModal(_jsx(AddEventModal, { case: _case, onUpdated: update }), { maxHeight: '90vh', height: 'unset' });
+                                    }
+                                }, children: [_jsx(EventIcon, { sx: { fontSize: '18px' } }), _jsx(AddCircle, { sx: {
+                                            fontSize: '12px',
+                                            position: 'absolute',
+                                            bottom: 2,
+                                            right: 2,
+                                            backgroundColor: theme.palette.background.paper,
+                                            borderRadius: '100%'
+                                        }, htmlColor: "grey" })] }) }), _jsx(Tooltip, { title: t('page.cases.sidebar.add_item'), children: _jsxs(IconButton, { size: "small", sx: { position: 'relative' }, onClick: () => {
                                     if (_case) {
                                         showModal(_jsx(AddToCaseModal, { case: _case, onUpdated: update }), { maxHeight: '90vh', height: 'unset' });
                                     }

package/components/routes/cases/modals/AddEventModal.d.ts

@@ -0,0 +1,9 @@
+import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
+import { type FC } from 'react';
+type AddEventModalProps = {
+    case: Case;
+    parentId?: string;
+    onUpdated?: (updatedCase: Case) => void;
+};
+declare const AddEventModal: FC<AddEventModalProps>;
+export default AddEventModal;

package/components/routes/cases/modals/AddEventModal.js

@@ -0,0 +1,213 @@
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Add, Delete } from '@mui/icons-material';
+import { Autocomplete, Box, Button, CircularProgress, Divider, IconButton, Stack, TextField, Typography } from '@mui/material';
+import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
+import { DateTimePicker } from '@mui/x-date-pickers/DateTimePicker';
+import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
+import api from '@cccsaurora/howler-ui/api';
+import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
+import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
+import { unflatten } from 'flat';
+import Fuse from 'fuse.js';
+import { useContext, useEffect, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useFolderOptions } from './hooks';
+const ESCALATIONS = ['hit', 'alert', 'evidence'];
+const MANAGED_FIELDS = new Set([
+    'event.created',
+    'event.id',
+    'event.ingested',
+    'event.kind',
+    'event.provider',
+    'howler.escalation',
+    'howler.hash',
+    'howler.id',
+    'howler.outline.indicators',
+    'howler.outline.summary',
+    'howler.outline.target',
+    'howler.outline.threat',
+    'howler.related',
+    'message',
+    'classification',
+    'timestamp'
+]);
+const isBlank = (value) => {
+    if (Array.isArray(value)) {
+        return value.length === 0;
+    }
+    return value === undefined || value === null || (typeof value === 'string' && value.trim() === '');
+};
+const getFieldOptions = (fields) => fields.filter(field => {
+    const key = field.key ?? '';
+    return (key &&
+        !MANAGED_FIELDS.has(key) &&
+        field.type !== 'object' &&
+        !key.startsWith('howler.comment.') &&
+        !key.startsWith('howler.log.'));
+});
+const parseList = (value) => value
+    .split(/[\n,]/)
+    .map(entry => entry.trim())
+    .filter(Boolean);
+const searchFields = (fields, query) => {
+    if (!query.trim()) {
+        return fields;
+    }
+    const tokens = query.toLowerCase().trim().split(/\s+/);
+    const tokenMatches = fields.filter(field => {
+        const searchable = `${field.key ?? ''} ${field.description ?? ''}`.toLowerCase();
+        return tokens.every(token => searchable.includes(token));
+    });
+    const fuzzyMatches = new Fuse(fields, {
+        keys: ['key', 'description'],
+        ignoreLocation: true,
+        threshold: 0.4
+    })
+        .search(query)
+        .map(result => result.item);
+    return [...tokenMatches, ...fuzzyMatches.filter(field => !tokenMatches.includes(field))];
+};
+const FieldInput = ({ field, value, onChange }) => {
+    const label = field.key ?? '';
+    const values = field.values ?? [];
+    if (values.length > 0) {
+        if (field.list) {
+            return (_jsx(Autocomplete, { multiple: true, options: values, value: Array.isArray(value) ? value.map(String) : [], onChange: (_, nextValue) => onChange(nextValue), renderInput: params => _jsx(TextField, { ...params, size: "small", label: label, helperText: field.description }) }));
+        }
+        return (_jsx(Autocomplete, { options: values, value: typeof value === 'string' ? value : null, onChange: (_, nextValue) => onChange(nextValue ?? undefined), renderInput: params => _jsx(TextField, { ...params, size: "small", label: label, helperText: field.description }) }));
+    }
+    if (field.type === 'boolean') {
+        return (_jsx(Autocomplete, { options: ['true', 'false'], value: typeof value === 'boolean' ? String(value) : null, onChange: (_, nextValue) => onChange(nextValue === null ? undefined : nextValue === 'true'), renderInput: params => _jsx(TextField, { ...params, size: "small", label: label, helperText: field.description }) }));
+    }
+    if (field.list) {
+        return (_jsx(TextField, { size: "small", label: label, helperText: field.description ?? 'Enter one value per line.', value: Array.isArray(value) ? value.join('\n') : '', onChange: event => onChange(parseList(event.target.value)), multiline: true }));
+    }
+    const numeric = ['integer', 'long', 'float', 'double', 'number'].includes(field.type);
+    return (_jsx(TextField, { size: "small", label: label, type: numeric ? 'number' : 'text', helperText: field.description, value: value === undefined ? '' : String(value), onChange: event => {
+            const nextValue = event.target.value;
+            if (!nextValue) {
+                onChange(undefined);
+            }
+            else if (numeric) {
+                onChange(field.type === 'integer' || field.type === 'long' ? Number.parseInt(nextValue, 10) : Number(nextValue));
+            }
+            else {
+                onChange(nextValue);
+            }
+        } }));
+};
+const AddEventModal = ({ case: _case, parentId, onUpdated }) => {
+    const { t } = useTranslation();
+    const { dispatchApi } = useMyApi();
+    const { close } = useContext(ModalContext);
+    const [fields, setFields] = useState([]);
+    const [selectedFields, setSelectedFields] = useState([]);
+    const [fieldValues, setFieldValues] = useState({});
+    const [fieldSearch, setFieldSearch] = useState('');
+    const [title, setTitle] = useState('');
+    const [created, setCreated] = useState(null);
+    const [provider, setProvider] = useState('');
+    const [escalation, setEscalation] = useState(null);
+    const [target, setTarget] = useState('');
+    const [threat, setThreat] = useState('');
+    const [indicators, setIndicators] = useState('');
+    const [summary, setSummary] = useState('');
+    const [selectedParent, setSelectedParent] = useState(parentId);
+    const [createdEventId, setCreatedEventId] = useState();
+    const [submitting, setSubmitting] = useState(false);
+    const folderOptions = useFolderOptions(_case);
+    useEffect(() => {
+        void dispatchApi(api.search.fields.event.get(), { throwError: false }).then(result => {
+            if (result) {
+                setFields(getFieldOptions(result));
+            }
+        });
+    }, [dispatchApi]);
+    const filteredFields = useMemo(() => searchFields(fields, fieldSearch), [fieldSearch, fields]);
+    const hasOutlineValue = Boolean(target.trim() || threat.trim() || parseList(indicators).length);
+    const isValid = Boolean(title.trim() && created?.isValid() && provider.trim() && escalation && hasOutlineValue);
+    const setOptionalField = (field) => {
+        if (!field.key || selectedFields.some(selected => selected.key === field.key)) {
+            return;
+        }
+        setSelectedFields(current => [...current, field]);
+        setFieldSearch('');
+    };
+    const removeOptionalField = (key) => {
+        setSelectedFields(current => current.filter(field => field.key !== key));
+        setFieldValues(current => {
+            return Object.fromEntries(Object.entries(current).filter(([fieldKey]) => fieldKey !== key));
+        });
+    };
+    const buildPayload = () => {
+        const payload = {
+            classification: _case.classification,
+            message: title.trim(),
+            'event.created': created.toISOString(),
+            'event.kind': 'event',
+            'event.provider': provider.trim(),
+            'howler.escalation': escalation,
+            'howler.outline.indicators': parseList(indicators)
+        };
+        if (target.trim()) {
+            payload['howler.outline.target'] = target.trim();
+        }
+        if (threat.trim()) {
+            payload['howler.outline.threat'] = threat.trim();
+        }
+        if (summary.trim()) {
+            payload['howler.outline.summary'] = summary.trim();
+        }
+        for (const field of selectedFields) {
+            const value = field.key ? fieldValues[field.key] : undefined;
+            if (field.key && !isBlank(value)) {
+                payload[field.key] = value;
+            }
+        }
+        return unflatten(payload);
+    };
+    const onSubmit = async () => {
+        if (!isValid || !_case.case_id) {
+            return;
+        }
+        setSubmitting(true);
+        try {
+            let eventId = createdEventId;
+            if (!eventId) {
+                const ids = await dispatchApi(api.v2.ingest.post('event', [buildPayload()], 'wait_for'));
+                eventId = ids?.[0];
+                if (!eventId) {
+                    throw new Error(t('modal.cases.add_event.error.no_id'));
+                }
+                setCreatedEventId(eventId);
+            }
+            const updatedCase = await dispatchApi(api.v2.case.items.post(_case.case_id, {
+                type: 'event',
+                value: eventId,
+                name: title.trim(),
+                parent: selectedParent
+            }));
+            if (updatedCase) {
+                onUpdated?.(updatedCase);
+                close();
+            }
+        }
+        finally {
+            setSubmitting(false);
+        }
+    };
+    const renderField = (field) => {
+        if (!field.key) {
+            return null;
+        }
+        return (_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "flex-start", children: [_jsx(Box, { flex: 1, children: _jsx(FieldInput, { field: field, value: fieldValues[field.key], onChange: value => setFieldValues(current => ({ ...current, [field.key]: value })) }) }), _jsx(IconButton, { "aria-label": t('modal.cases.add_event.remove_field'), onClick: () => removeOptionalField(field.key), children: _jsx(Delete, {}) })] }, field.key));
+    };
+    return (_jsxs(Stack, { spacing: 2, p: 2, sx: { minWidth: 'min(900px, 70vw)', maxHeight: '90vh', height: '100%' }, children: [_jsx(Typography, { variant: "h4", children: t('modal.cases.add_event') }), _jsxs(Stack, { spacing: 1, alignItems: "stretch", children: [_jsx(TextField, { required: true, size: "small", label: t('modal.cases.add_event.title'), value: title, onChange: event => setTitle(event.target.value), fullWidth: true }), _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(LocalizationProvider, { dateAdapter: AdapterDayjs, children: _jsx(DateTimePicker, { value: created, onChange: setCreated, ampm: false, slotProps: {
+                                        textField: { required: true, size: 'small', fullWidth: true },
+                                        dialog: { disablePortal: true },
+                                        popper: { disablePortal: true }
+                                    }, label: t('modal.cases.add_event.created') }) }), _jsx(Autocomplete, { fullWidth: true, disablePortal: true, options: ESCALATIONS, value: escalation, onChange: (_, value) => setEscalation(value), renderInput: params => (_jsx(TextField, { ...params, required: true, size: "small", label: t('modal.cases.add_event.escalation') })) })] }), _jsx(TextField, { required: true, size: "small", label: t('modal.cases.add_event.provider'), value: provider, onChange: event => setProvider(event.target.value), fullWidth: true }), _jsx(TextField, { size: "small", label: t('modal.cases.add_event.summary'), value: summary, onChange: event => setSummary(event.target.value) }), folderOptions.length > 0 && (_jsx(Autocomplete, { disablePortal: true, options: folderOptions, getOptionLabel: option => option.label, value: folderOptions.find(folder => folder.id === selectedParent) ?? null, onChange: (_, value) => setSelectedParent(value?.id), renderInput: params => _jsx(TextField, { ...params, size: "small", label: t('modal.cases.add_item.folder') }) })), _jsx(Typography, { variant: "caption", color: "textSecondary", children: t('modal.cases.add_event.outline_required') }), _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(TextField, { fullWidth: true, size: "small", label: t('modal.cases.add_event.target'), value: target, onChange: event => setTarget(event.target.value) }), _jsx(TextField, { fullWidth: true, size: "small", label: t('modal.cases.add_event.threat'), value: threat, onChange: event => setThreat(event.target.value) })] }), _jsx(TextField, { size: "small", multiline: true, label: t('modal.cases.add_event.indicators'), value: indicators, onChange: event => setIndicators(event.target.value), helperText: t('modal.cases.add_event.indicators_help') })] }), _jsx(Divider, { children: _jsx(Typography, { variant: "caption", children: t('modal.cases.add_event.additional_fields') }) }), _jsx(Autocomplete, { disablePortal: true, options: filteredFields, filterOptions: options => options, inputValue: fieldSearch, onInputChange: (_, value) => setFieldSearch(value), value: null, onChange: (_, field) => field && setOptionalField(field), getOptionLabel: field => field.key ?? '', isOptionEqualToValue: (option, value) => option.key === value.key, renderOption: (props, field) => (_createElement(Box, { component: "li", ...props, key: field.key },
+                    _jsxs(Stack, { children: [_jsx(Typography, { variant: "body2", children: field.key }), _jsxs(Typography, { variant: "caption", color: "text.secondary", children: [field.type, " ", field.description ? `- ${field.description}` : ''] })] }))), renderInput: params => _jsx(TextField, { ...params, size: "small", label: t('modal.cases.add_event.search_fields') }) }), selectedFields.length > 0 && (_jsx(Stack, { spacing: 1, overflow: "auto", flex: 1, pt: 1, children: selectedFields.map(renderField) })), _jsxs(Stack, { direction: "row", spacing: 1, alignSelf: "end", children: [_jsx(Button, { variant: "outlined", color: "error", onClick: close, disabled: submitting, children: t('cancel') }), _jsx(Button, { variant: "outlined", color: "success", disabled: !isValid || submitting, startIcon: submitting ? _jsx(CircularProgress, { size: 16, color: "inherit" }) : _jsx(Add, {}), onClick: onSubmit, children: t('modal.cases.add_event.submit') })] })] }));
+};
+export default AddEventModal;

package/components/routes/cases/modals/AddEventModal.test.d.ts

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

package/components/routes/cases/modals/AddEventModal.test.js

@@ -0,0 +1,152 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import dayjs from 'dayjs';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import AddEventModal from './AddEventModal';
+const mockDispatchApi = vi.hoisted(() => vi.fn());
+const mockClose = vi.hoisted(() => vi.fn());
+const mockIngestPost = vi.hoisted(() => vi.fn());
+const mockItemsPost = vi.hoisted(() => vi.fn());
+const mockFieldsGet = vi.hoisted(() => vi.fn());
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({ dispatchApi: mockDispatchApi })
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (key) => key })
+}));
+vi.mock('@mui/x-date-pickers/LocalizationProvider', () => ({
+    LocalizationProvider: ({ children }) => children
+}));
+vi.mock('@mui/x-date-pickers/AdapterDayjs', () => ({ AdapterDayjs: class {
+    } }));
+vi.mock('@mui/x-date-pickers/DateTimePicker', () => ({
+    DateTimePicker: ({ label, onChange }) => (_jsxs(_Fragment, { children: [_jsxs("button", { type: "button", onClick: () => onChange(dayjs('2026-09-21T12:00:00Z')), children: [label, " valid"] }), _jsxs("button", { type: "button", onClick: () => onChange(dayjs('not-a-date')), children: [label, " invalid"] })] }))
+}));
+vi.mock('api', () => ({
+    default: {
+        search: {
+            fields: {
+                event: {
+                    get: () => mockFieldsGet()
+                }
+            }
+        },
+        v2: {
+            ingest: {
+                post: (...args) => mockIngestPost(...args)
+            },
+            case: {
+                items: {
+                    post: (...args) => mockItemsPost(...args)
+                }
+            }
+        }
+    }
+}));
+vi.mock('components/app/providers/ModalProvider', async () => {
+    const { createContext } = await import('react');
+    return {
+        ModalContext: createContext({ close: mockClose })
+    };
+});
+const testCase = {
+    __index: 'case',
+    case_id: 'case-1',
+    classification: 'UNCLASSIFIED',
+    items: []
+};
+const fields = [
+    {
+        key: 'destination.ip',
+        default: false,
+        indexed: true,
+        list: false,
+        stored: true,
+        type: 'ip',
+        description: 'IP address of the destination'
+    }
+];
+const renderModal = () => render(_jsx(AddEventModal, { case: testCase }), {
+    wrapper: ({ children }) => children
+});
+describe('AddEventModal', () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+    });
+    it('requires escalation in addition to the other required fields', async () => {
+        mockFieldsGet.mockResolvedValue(fields);
+        mockDispatchApi.mockImplementation(async (request) => request);
+        renderModal();
+        await waitFor(() => expect(mockFieldsGet).toHaveBeenCalled());
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.title/), { target: { value: 'Manual event' } });
+        fireEvent.click(screen.getByRole('button', { name: 'modal.cases.add_event.created valid' }));
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.provider/), { target: { value: 'Analyst' } });
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.target/), { target: { value: 'host-1' } });
+        expect(screen.getByRole('button', { name: 'modal.cases.add_event.submit' })).toBeDisabled();
+    });
+    it('rejects an invalid created date', async () => {
+        const user = userEvent.setup();
+        mockFieldsGet.mockResolvedValue(fields);
+        mockDispatchApi.mockImplementation(async (request) => request);
+        renderModal();
+        await waitFor(() => expect(mockFieldsGet).toHaveBeenCalled());
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.title/), { target: { value: 'Manual event' } });
+        fireEvent.click(screen.getByRole('button', { name: 'modal.cases.add_event.created invalid' }));
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.provider/), { target: { value: 'Analyst' } });
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.target/), { target: { value: 'host-1' } });
+        await user.click(screen.getByRole('combobox', { name: /modal\.cases\.add_event\.escalation/ }));
+        await user.click(await screen.findByRole('option', { name: 'evidence' }));
+        expect(screen.getByRole('button', { name: 'modal.cases.add_event.submit' })).toBeDisabled();
+    });
+    it('fuzzy-searches optional fields and submits summary and escalation', async () => {
+        const user = userEvent.setup();
+        const updatedCase = { ...testCase, items: [{ type: 'event', value: 'event-1' }] };
+        mockFieldsGet.mockResolvedValue(fields);
+        mockIngestPost.mockReturnValue(Promise.resolve(['event-1']));
+        mockItemsPost.mockReturnValue(Promise.resolve(updatedCase));
+        mockDispatchApi.mockImplementation(async (request) => request);
+        renderModal();
+        await waitFor(() => expect(mockFieldsGet).toHaveBeenCalled());
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.title/), { target: { value: 'Manual event' } });
+        fireEvent.click(screen.getByRole('button', { name: 'modal.cases.add_event.created valid' }));
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.provider/), { target: { value: 'Analyst' } });
+        await user.click(screen.getByRole('combobox', { name: /modal\.cases\.add_event\.escalation/ }));
+        await user.click(await screen.findByRole('option', { name: 'evidence' }));
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.target/), { target: { value: 'host-1' } });
+        fireEvent.change(screen.getByLabelText(/modal\.cases\.add_event\.summary/), {
+            target: { value: 'Observed manually' }
+        });
+        const fieldSearch = screen.getByLabelText(/modal\.cases\.add_event\.search_fields/);
+        fireEvent.change(fieldSearch, { target: { value: 'destination IP' } });
+        await user.click(await screen.findByText('destination.ip'));
+        fireEvent.change(screen.getByLabelText(/destination\.ip/), { target: { value: '192.0.2.10' } });
+        await user.click(screen.getByRole('button', { name: 'modal.cases.add_event.submit' }));
+        expect(mockIngestPost).toHaveBeenCalledWith('event', [
+            expect.objectContaining({
+                classification: 'UNCLASSIFIED',
+                message: 'Manual event',
+                event: expect.objectContaining({
+                    created: '2026-09-21T12:00:00.000Z',
+                    kind: 'event',
+                    provider: 'Analyst'
+                }),
+                howler: expect.objectContaining({
+                    escalation: 'evidence',
+                    outline: expect.objectContaining({
+                        target: 'host-1',
+                        summary: 'Observed manually'
+                    })
+                }),
+                destination: expect.objectContaining({ ip: '192.0.2.10' })
+            })
+        ], 'wait_for');
+        expect(mockItemsPost).toHaveBeenCalledWith('case-1', {
+            type: 'event',
+            value: 'event-1',
+            name: 'Manual event',
+            parent: undefined
+        });
+        expect(mockClose).toHaveBeenCalled();
+    });
+});

package/locales/en/translation.json

@@ -117,6 +117,7 @@
     "error.invalid_detection.message": "Invalid Detection",
     "event.module": "Event Module",
     "event.open": "Open Event",
+    "event.provider": "Event Provider",
     "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",
@@ -336,6 +337,23 @@
     "modal.action.empty": "Action Name cannot be empty.",
     "modal.action.label": "Action Name",
     "modal.action.title": "Save Action",
+    "modal.cases.add_event": "Add Event",
+    "modal.cases.add_event.additional_fields": "Additional Fields",
+    "modal.cases.add_event.created": "Event Created",
+    "modal.cases.add_event.error.no_id": "The event was created without an ID.",
+    "modal.cases.add_event.escalation": "Escalation",
+    "modal.cases.add_event.indicators": "Indicators",
+    "modal.cases.add_event.indicators_help": "Enter one indicator per line or separated by commas.",
+    "modal.cases.add_event.outline": "Event Outline",
+    "modal.cases.add_event.outline_required": "At least one target, threat, or indicator is required.",
+    "modal.cases.add_event.provider": "Source / Provenance",
+    "modal.cases.add_event.remove_field": "Remove field",
+    "modal.cases.add_event.search_fields": "Search field names and descriptions",
+    "modal.cases.add_event.submit": "Add Event",
+    "modal.cases.add_event.summary": "Summary",
+    "modal.cases.add_event.target": "Target",
+    "modal.cases.add_event.threat": "Threat",
+    "modal.cases.add_event.title": "Title",
     "modal.cases.add_item": "Add item",
     "modal.cases.add_item.content": "Content",
     "modal.cases.add_item.folder": "Folder",
@@ -476,6 +494,7 @@
     "page.cases.rules.timeframe.days": "{{days}} day(s)",
     "page.cases.rules.timeframe.help": "Number of days before the rule expires",
     "page.cases.search": "Search",
+    "page.cases.sidebar.add_event": "Add event",
     "page.cases.sidebar.add_folder": "Add folder",
     "page.cases.sidebar.add_item": "Add item",
     "page.cases.sidebar.collapse_all": "Collapse all folders",

package/locales/fr/translation.json

@@ -117,6 +117,7 @@
     "error.invalid_detection.message": "Détection non valide",
     "event.module": "Module d'événement",
     "event.open": "Ouvrir événement",
+    "event.provider": "Fournisseur de l'événement",
     "event.type": "Type d'événement",
     "features.warning.description": "Cette fonctionnalité fait l'objet d'un développement actif et n'est pas encore achevée. Il est possible que vous rencontriez des problèmes ou de l'instabilité.",
     "features.warning.title": "Fonctionnalité en développement actif",
@@ -336,6 +337,23 @@
     "modal.action.empty": "Le nom de l'action ne peut pas être vide.",
     "modal.action.label": "Nom de l'action",
     "modal.action.title": "Enregistrer l'action",
+    "modal.cases.add_event": "Ajouter un événement",
+    "modal.cases.add_event.additional_fields": "Champs supplémentaires",
+    "modal.cases.add_event.created": "Création de l'événement",
+    "modal.cases.add_event.error.no_id": "L'événement a été créé sans identifiant.",
+    "modal.cases.add_event.escalation": "Escalade",
+    "modal.cases.add_event.indicators": "Indicateurs",
+    "modal.cases.add_event.indicators_help": "Saisissez un indicateur par ligne ou séparé par des virgules.",
+    "modal.cases.add_event.outline": "Résumé de l'événement",
+    "modal.cases.add_event.outline_required": "Au moins une cible, une menace ou un indicateur est requis.",
+    "modal.cases.add_event.provider": "Source / provenance",
+    "modal.cases.add_event.remove_field": "Supprimer le champ",
+    "modal.cases.add_event.search_fields": "Rechercher dans les noms et descriptions de champs",
+    "modal.cases.add_event.submit": "Ajouter l'événement",
+    "modal.cases.add_event.summary": "Résumé",
+    "modal.cases.add_event.target": "Cible",
+    "modal.cases.add_event.threat": "Menace",
+    "modal.cases.add_event.title": "Titre",
     "modal.cases.add_item": "Ajouter un élément",
     "modal.cases.add_item.content": "Contenu",
     "modal.cases.add_item.folder": "Dossier",
@@ -476,6 +494,7 @@
     "page.cases.rules.timeframe.days": "{{days}} jour(s)",
     "page.cases.rules.timeframe.help": "Nombre de jours avant l'expiration de la règle",
     "page.cases.search": "Rechercher",
+    "page.cases.sidebar.add_event": "Ajouter un événement",
     "page.cases.sidebar.add_folder": "Ajouter un dossier",
     "page.cases.sidebar.add_item": "Ajouter un élément",
     "page.cases.sidebar.collapse_all": "Réduire tous les dossiers",

package/package.json

@@ -97,7 +97,7 @@
     "url": "https://github.com/CybercentreCanada/howler"
   },
   "type": "module",
-  "version": "3.1.0-dev.1700",
+  "version": "3.1.0-dev.1707",
   "exports": {
     "./i18n": "./i18n.js",
     "./index.css": "./index.css",