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

package/components/routes/hits/search/{RecordBrowser.js → HitBrowser.js}

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ChevronLeft, Close, ManageSearch } from '@mui/icons-material';
 import { Box, Card, Checkbox, Collapse, Drawer, Fab, IconButton, Stack, Tooltip, Typography, useMediaQuery, useTheme } from '@mui/material';
+import { HitContext } from '@cccsaurora/howler-ui/components/app/providers/HitProvider';
+import HitSearchProvider, { HitSearchContext } from '@cccsaurora/howler-ui/components/app/providers/HitSearchProvider';
 import ParameterProvider, { ParameterContext } from '@cccsaurora/howler-ui/components/app/providers/ParameterProvider';
-import { RecordContext } from '@cccsaurora/howler-ui/components/app/providers/RecordProvider';
-import RecordSearchProvider, { RecordSearchContext } from '@cccsaurora/howler-ui/components/app/providers/RecordSearchProvider';
 import { ViewContext } from '@cccsaurora/howler-ui/components/app/providers/ViewProvider';
 import FlexOne from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexOne';
 import FlexPort from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexPort';
@@ -32,14 +32,14 @@ const HitBrowser = () => {
     const setQuery = useContextSelector(ParameterContext, ctx => ctx.setQuery);
     const setOffset = useContextSelector(ParameterContext, ctx => ctx.setOffset);
     const selectedViews = useContextSelector(ParameterContext, ctx => ctx.views);
-    const selectedHits = useContextSelector(RecordContext, ctx => ctx.selectedRecords);
-    const addHitToSelection = useContextSelector(RecordContext, ctx => ctx.addRecordToSelection);
-    const removeHitFromSelection = useContextSelector(RecordContext, ctx => ctx.removeRecordFromSelection);
-    const clearSelectedHits = useContextSelector(RecordContext, ctx => ctx.clearSelectedRecords);
+    const selectedHits = useContextSelector(HitContext, ctx => ctx.selectedHits);
+    const addHitToSelection = useContextSelector(HitContext, ctx => ctx.addHitToSelection);
+    const removeHitFromSelection = useContextSelector(HitContext, ctx => ctx.removeHitFromSelection);
+    const clearSelectedHits = useContextSelector(HitContext, ctx => ctx.clearSelectedHits);
     const searchPaneWidth = useMyLocalStorageItem(StorageKey.SEARCH_PANE_WIDTH, null)[0];
     const forceDrawer = useMyLocalStorageItem(StorageKey.FORCE_DRAWER, false)[0];
-    const displayType = useContextSelector(RecordSearchContext, ctx => ctx.displayType);
-    const response = useContextSelector(RecordSearchContext, ctx => ctx.response);
+    const displayType = useContextSelector(HitSearchContext, ctx => ctx.displayType);
+    const response = useContextSelector(HitSearchContext, ctx => ctx.response);
     const location = useLocation();
     const routeParams = useParams();
     const [show, setShow] = useState(!!selected);
@@ -128,6 +128,6 @@ const HitBrowser = () => {
                 }, children: _jsx(ChevronLeft, { sx: { transition: 'rotate 250ms', rotate: show ? '180deg' : '0deg' } }) }))] }));
 };
 const HitBrowserProvider = () => {
-    return (_jsx(ParameterProvider, { children: _jsx(RecordSearchProvider, { children: _jsx(HitBrowser, {}) }) }));
+    return (_jsx(ParameterProvider, { children: _jsx(HitSearchProvider, { children: _jsx(HitBrowser, {}) }) }));
 };
 export default HitBrowserProvider;

package/components/{elements/record/RecordContextMenu.d.ts → routes/hits/search/HitContextMenu.d.ts}

@@ -3,7 +3,7 @@ import React from 'react';
 /**
  * Props for the HitContextMenu component
  */
-interface RecordContextMenuProps {
+interface HitContextMenuProps {
     /**
      * Function to extract the hit ID from a mouse event
      */
@@ -18,5 +18,5 @@ interface RecordContextMenuProps {
  * Provides quick access to common hit actions including assessment, voting,
  * transitions, and exclusion filters based on template fields.
  */
-declare const RecordContextMenu: FC<PropsWithChildren<RecordContextMenuProps>>;
-export default RecordContextMenu;
+declare const HitContextMenu: FC<PropsWithChildren<HitContextMenuProps>>;
+export default HitContextMenu;

package/components/routes/hits/search/HitContextMenu.js

@@ -0,0 +1,227 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { AddCircleOutline, Assignment, Edit, HowToVote, KeyboardArrowRight, OpenInNew, QueryStats, RemoveCircleOutline, SettingsSuggest, Terminal } from '@mui/icons-material';
+import { Box, Divider, Fade, ListItemIcon, ListItemText, Menu, MenuItem, MenuList, Paper } from '@mui/material';
+import api from '@cccsaurora/howler-ui/api';
+import useMatchers from '@cccsaurora/howler-ui/components/app/hooks/useMatchers';
+import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
+import { HitContext } from '@cccsaurora/howler-ui/components/app/providers/HitProvider';
+import { ParameterContext } from '@cccsaurora/howler-ui/components/app/providers/ParameterProvider';
+import { TOP_ROW, VOTE_OPTIONS } from '@cccsaurora/howler-ui/components/elements/hit/actions/SharedComponents';
+import useHitActions from '@cccsaurora/howler-ui/components/hooks/useHitActions';
+import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
+import useMyActionFunctions from '@cccsaurora/howler-ui/components/routes/action/useMyActionFunctions';
+import { capitalize, get, groupBy, isEmpty, toString } from 'lodash-es';
+import howlerPluginStore from '@cccsaurora/howler-ui/plugins/store';
+import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { usePluginStore } from 'react-pluggable';
+import { Link } from 'react-router-dom';
+import { useContextSelector } from 'use-context-selector';
+import { DEFAULT_QUERY } from '@cccsaurora/howler-ui/utils/constants';
+import { sanitizeLuceneQuery } from '@cccsaurora/howler-ui/utils/stringUtils';
+/**
+ * Order in which action types should be displayed in the context menu
+ */
+const ORDER = ['assessment', 'vote', 'action'];
+/**
+ * The margin at the bottom of the screen by which the context menu should be inverted.
+ * That is, if right clicking within this many pixels of the bottom, render the context menu to the top right
+ * of the pointer instead of the bottom right.
+ */
+const CONTEXTMENU_MARGIN = 350;
+/**
+ * Icon mapping for different action types
+ */
+const ICON_MAP = {
+    assessment: _jsx(Assignment, {}),
+    vote: _jsx(HowToVote, {}),
+    action: _jsx(Edit, {})
+};
+/**
+ * Context menu component for hit operations.
+ * Provides quick access to common hit actions including assessment, voting,
+ * transitions, and exclusion filters based on template fields.
+ */
+const HitContextMenu = ({ children, getSelectedId, Component = Box }) => {
+    const { t } = useTranslation();
+    const { dispatchApi } = useMyApi();
+    const { executeAction } = useMyActionFunctions();
+    const { config } = useContext(ApiConfigContext);
+    const pluginStore = usePluginStore();
+    const { getMatchingAnalytic, getMatchingTemplate } = useMatchers();
+    const query = useContextSelector(ParameterContext, ctx => ctx?.query);
+    const setQuery = useContextSelector(ParameterContext, ctx => ctx?.setQuery);
+    const [id, setId] = useState(null);
+    const hit = useContextSelector(HitContext, ctx => ctx.hits[id]);
+    const selectedHits = useContextSelector(HitContext, ctx => ctx.selectedHits);
+    const [analytic, setAnalytic] = useState(null);
+    const [template, setTemplate] = useState(null);
+    const [anchorEl, setAnchorEl] = useState();
+    const [transformProps, setTransformProps] = useState({});
+    const [actions, setActions] = useState([]);
+    const [show, setShow] = useState({});
+    const hits = useMemo(() => (selectedHits.some(_hit => _hit.howler.id === hit?.howler.id) ? selectedHits : [hit]), [hit, selectedHits]);
+    const { availableTransitions, canVote, canAssess, assess, vote } = useHitActions(hits);
+    /**
+     * Handles right-click context menu events.
+     * Opens the context menu at the click location and loads available actions.
+     */
+    const onContextMenu = useCallback(async (event) => {
+        if (anchorEl) {
+            event.preventDefault();
+            setAnchorEl(null);
+            return;
+        }
+        event.preventDefault();
+        const _id = getSelectedId(event);
+        setId(_id);
+        if (window.innerHeight - event.clientY < 300) {
+            setTransformProps({
+                position: 'fixed',
+                bottom: `${window.innerHeight - event.clientY}px !important`,
+                top: 'unset !important',
+                left: `${event.clientX}px !important`
+            });
+        }
+        else {
+            setTransformProps({
+                position: 'fixed',
+                top: `${event.clientY}px !important`,
+                left: `${event.clientX}px !important`
+            });
+        }
+        setAnchorEl(event.target);
+        const _actions = (await dispatchApi(api.search.action.post({ query: 'action_id:*' }), { throwError: false }))
+            ?.items;
+        if (_actions) {
+            setActions(_actions);
+        }
+    }, [anchorEl, dispatchApi, getSelectedId]);
+    const rowStatus = useMemo(() => ({
+        assessment: canAssess,
+        vote: canVote
+    }), [canAssess, canVote]);
+    const pluginActions = howlerPluginStore.plugins.flatMap(plugin => pluginStore.executeFunction(`${plugin}.actions`, hits));
+    /**
+     * Generates grouped action entries for the context menu.
+     * Combines transitions, plugin actions, votes, and assessments based on permissions.
+     */
+    const entries = useMemo(() => {
+        let _actions = [...availableTransitions, ...pluginActions];
+        if (canVote) {
+            _actions = [
+                ..._actions,
+                ...VOTE_OPTIONS.map(option => ({ ...option, actionFunction: () => vote(option.name.toLowerCase()) }))
+            ];
+        }
+        if (config.lookups?.['howler.assessment'] && canAssess) {
+            _actions = [
+                ..._actions,
+                ...config.lookups['howler.assessment']
+                    .filter(_assessment => analytic?.triage_settings?.valid_assessments
+                    ? analytic.triage_settings?.valid_assessments.includes(_assessment)
+                    : true)
+                    .sort((a, b) => +TOP_ROW.includes(b) - +TOP_ROW.includes(a))
+                    .map(assessment => ({
+                    type: 'assessment',
+                    name: assessment,
+                    actionFunction: async () => {
+                        await assess(assessment, analytic?.triage_settings?.skip_rationale);
+                    }
+                }))
+            ];
+        }
+        return Object.entries(groupBy(_actions, 'type')).sort(([a], [b]) => ORDER.indexOf(a) - ORDER.indexOf(b));
+    }, [analytic, assess, availableTransitions, canAssess, canVote, config.lookups, vote, pluginActions]);
+    /**
+     * Calculates appropriate styles for submenu positioning.
+     * Adjusts position based on available screen space to prevent overflow.
+     */
+    const calculateSubMenuStyles = useCallback((parent) => {
+        const baseStyles = { position: 'absolute', maxHeight: '300px', overflow: 'auto' };
+        const defaultStyles = { ...baseStyles, top: 0, left: '100%' };
+        if (!parent) {
+            return defaultStyles;
+        }
+        const parentBounds = parent.getBoundingClientRect();
+        if (window.innerHeight - parentBounds.y < CONTEXTMENU_MARGIN) {
+            return { ...baseStyles, bottom: 0, left: '100%' };
+        }
+        return defaultStyles;
+    }, []);
+    // Load analytic and template data when a hit is selected
+    useEffect(() => {
+        if (!hit?.howler.analytic) {
+            return;
+        }
+        getMatchingAnalytic(hit).then(setAnalytic);
+        getMatchingTemplate(hit).then(setTemplate);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [hit]);
+    // Reset menu state when context menu is closed
+    useEffect(() => {
+        if (!anchorEl) {
+            setShow({});
+            setAnalytic(null);
+        }
+    }, [anchorEl]);
+    return (_jsxs(Component, { id: "contextMenu", onContextMenu: onContextMenu, children: [children, _jsxs(Menu, { id: "hit-menu", open: !!anchorEl, anchorEl: anchorEl, onClose: () => setAnchorEl(null), slotProps: {
+                    paper: {
+                        sx: {
+                            ...transformProps,
+                            overflow: 'visible !important'
+                        }
+                    }
+                }, MenuListProps: { dense: true, sx: { minWidth: '250px' } }, anchorOrigin: { vertical: 'top', horizontal: 'left' }, onClick: () => setAnchorEl(null), children: [_jsxs(MenuItem, { component: Link, to: `/hits/${hit?.howler.id}`, disabled: !hit, children: [_jsx(ListItemIcon, { children: _jsx(OpenInNew, {}) }), _jsx(ListItemText, { children: t('hit.panel.open') })] }), _jsxs(MenuItem, { component: Link, to: `/analytics/${analytic?.analytic_id}`, disabled: !analytic, children: [_jsx(ListItemIcon, { children: _jsx(QueryStats, {}) }), _jsx(ListItemText, { children: t('hit.panel.analytic.open') })] }), _jsx(Divider, {}), entries.map(([type, items]) => (_jsxs(MenuItem, { id: `${type}-menu-item`, sx: { position: 'relative' }, onMouseEnter: ev => setShow(_show => ({ ..._show, [type]: ev.target })), onMouseLeave: () => setShow(_show => ({ ..._show, [type]: null })), disabled: rowStatus[type] === false, children: [_jsx(ListItemIcon, { children: ICON_MAP[type] ?? _jsx(Terminal, {}) }), _jsx(ListItemText, { sx: { flex: 1 }, children: t(`hit.details.actions.${type}`) }), rowStatus[type] !== false && (_jsx(KeyboardArrowRight, { fontSize: "small", sx: { color: 'text.secondary', mr: -1 } })), _jsx(Fade, { in: !!show[type], unmountOnExit: true, children: _jsx(Paper, { id: `${type}-submenu`, sx: calculateSubMenuStyles(show[type]), elevation: 8, children: _jsx(MenuList, { sx: { p: 0, borderTopLeftRadius: 0 }, dense: true, role: "group", children: items.map(a => (_jsx(MenuItem, { value: a.name, onClick: a.actionFunction, children: a.i18nKey ? t(a.i18nKey) : capitalize(a.name) }, a.name))) }) }) })] }, type))), _jsxs(MenuItem, { id: "actions-menu-item", sx: { position: 'relative' }, onMouseEnter: ev => setShow(_show => ({ ..._show, actions: ev.target })), onMouseLeave: () => setShow(_show => ({ ..._show, actions: null })), disabled: actions.length < 1, children: [_jsx(ListItemIcon, { children: _jsx(SettingsSuggest, {}) }), _jsx(ListItemText, { sx: { flex: 1 }, children: t('route.actions.change') }), actions.length > 0 && _jsx(KeyboardArrowRight, { fontSize: "small", sx: { color: 'text.secondary', mr: -1 } }), _jsx(Fade, { in: !!show.actions, unmountOnExit: true, children: _jsx(Paper, { id: "actions-submenu", sx: calculateSubMenuStyles(show.actions), elevation: 8, children: _jsx(MenuList, { sx: { p: 0 }, dense: true, role: "group", children: actions.map(action => (_jsx(MenuItem, { onClick: () => executeAction(action.action_id, `howler.id:${hit?.howler.id}`), children: _jsx(ListItemText, { children: action.name }) }, action.action_id))) }) }) })] }), !isEmpty(template?.keys ?? []) && setQuery && (_jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsxs(MenuItem, { id: "excludes-menu-item", sx: { position: 'relative' }, onMouseEnter: ev => setShow(_show => ({ ..._show, excludes: ev.target })), onMouseLeave: () => setShow(_show => ({ ..._show, excludes: null })), children: [_jsx(ListItemIcon, { children: _jsx(RemoveCircleOutline, {}) }), _jsx(ListItemText, { sx: { flex: 1 }, children: t('hit.panel.exclude') }), _jsx(KeyboardArrowRight, { fontSize: "small", sx: { color: 'text.secondary', mr: -1 } }), _jsx(Fade, { in: !!show.excludes, unmountOnExit: true, children: _jsx(Paper, { id: "excludes-submenu", sx: calculateSubMenuStyles(show.excludes), elevation: 8, children: _jsx(MenuList, { sx: { p: 0 }, dense: true, role: "group", children: template?.keys.map(key => {
+                                                    // Build exclusion query based on current query and field value
+                                                    let newQuery = '';
+                                                    if (query !== DEFAULT_QUERY) {
+                                                        newQuery = `(${query}) AND `;
+                                                    }
+                                                    const value = get(hit, key);
+                                                    if (!value) {
+                                                        return null;
+                                                    }
+                                                    else if (Array.isArray(value)) {
+                                                        // Handle array values by excluding all items
+                                                        const sanitizedValues = value
+                                                            .map(toString)
+                                                            .filter(val => !!val)
+                                                            .map(val => `"${sanitizeLuceneQuery(val)}"`);
+                                                        if (sanitizedValues.length < 1) {
+                                                            return null;
+                                                        }
+                                                        newQuery += `-${key}:(${sanitizedValues.join(' OR ')})`;
+                                                    }
+                                                    else {
+                                                        // Handle single value
+                                                        newQuery += `-${key}:"${sanitizeLuceneQuery(value.toString())}"`;
+                                                    }
+                                                    return (_jsx(MenuItem, { onClick: () => setQuery(newQuery), children: _jsx(ListItemText, { children: key }) }, key));
+                                                }) }) }) })] }), _jsxs(MenuItem, { id: "includes-menu-item", sx: { position: 'relative' }, onMouseEnter: ev => setShow(_show => ({ ..._show, includes: ev.target })), onMouseLeave: () => setShow(_show => ({ ..._show, includes: null })), children: [_jsx(ListItemIcon, { children: _jsx(AddCircleOutline, {}) }), _jsx(ListItemText, { sx: { flex: 1 }, children: t('hit.panel.include') }), _jsx(KeyboardArrowRight, { fontSize: "small", sx: { color: 'text.secondary', mr: -1 } }), _jsx(Fade, { in: !!show.includes, unmountOnExit: true, children: _jsx(Paper, { id: "includes-submenu", sx: calculateSubMenuStyles(show.includes), elevation: 8, children: _jsx(MenuList, { sx: { p: 0 }, dense: true, role: "group", children: template?.keys.map(key => {
+                                                    // Build inclusion query based on current query and field
+                                                    // If default, we include default query
+                                                    let newQuery = `(${query}) AND `;
+                                                    const value = get(hit, key);
+                                                    if (!value) {
+                                                        return null;
+                                                    }
+                                                    else if (Array.isArray(value)) {
+                                                        // Handle array values by including all items
+                                                        const sanitizedValues = value
+                                                            .map(toString)
+                                                            .filter(val => !!val)
+                                                            .map(val => `"${sanitizeLuceneQuery(val)}"`);
+                                                        if (sanitizedValues.length < 1) {
+                                                            return null;
+                                                        }
+                                                        newQuery += `${key}:(${sanitizedValues.join(' OR ')})`;
+                                                    }
+                                                    else {
+                                                        // Handle single value
+                                                        newQuery += `${key}:"${sanitizeLuceneQuery(value.toString())}"`;
+                                                    }
+                                                    return (_jsx(MenuItem, { onClick: () => setQuery(newQuery), children: _jsx(ListItemText, { children: key }) }, key));
+                                                }) }) }) })] })] }))] })] }));
+};
+export default HitContextMenu;

package/components/{elements/record/RecordContextMenu.test.js → routes/hits/search/HitContextMenu.test.js}

@@ -47,7 +47,6 @@ vi.mock('components/app/hooks/useMatchers', () => ({
         getMatchingTemplate: mockGetMatchingTemplate
     }))
 }));
-const mockShowModal = vi.fn();
 const mockDispatchApi = vi.fn();
 vi.mock('components/hooks/useMyApi', () => ({
     default: vi.fn(() => ({
@@ -73,9 +72,6 @@ vi.mock('plugins/store', () => ({
         plugins: ['plugin1']
     }
 }));
-vi.mock('components/routes/cases/modals/AddToCaseModal', () => ({
-    default: () => null
-}));
 // Mock MUI components
 vi.mock('@mui/material', async () => {
     const actual = await vi.importActual('@mui/material');
@@ -95,14 +91,13 @@ vi.mock('@mui/material', async () => {
 });
 // Import component after mocks
 import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
-import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
+import { HitContext } from '@cccsaurora/howler-ui/components/app/providers/HitProvider';
 import { ParameterContext } from '@cccsaurora/howler-ui/components/app/providers/ParameterProvider';
-import { RecordContext } from '@cccsaurora/howler-ui/components/app/providers/RecordProvider';
 import i18n from '@cccsaurora/howler-ui/i18n';
 import { I18nextProvider } from 'react-i18next';
 import { createMockAction, createMockAnalytic, createMockHit, createMockTemplate } from '@cccsaurora/howler-ui/tests/utils';
 import { DEFAULT_QUERY } from '@cccsaurora/howler-ui/utils/constants';
-import RecordContextMenu from './RecordContextMenu';
+import HitContextMenu from './HitContextMenu';
 const mockGetSelectedId = vi.fn(() => 'test-hit-1');
 const mockConfig = {
     lookups: {
@@ -110,16 +105,16 @@ const mockConfig = {
     }
 };
 const mockApiContext = { config: mockConfig };
-const mockRecordContext = {
-    records: {
+const mockHitContext = {
+    hits: {
         'test-hit-1': createMockHit()
     },
-    selectedRecords: []
+    selectedHits: []
 };
 const mockParameterContext = { query: DEFAULT_QUERY, setQuery: vi.fn() };
 // Test wrapper
 const Wrapper = ({ children }) => {
-    return (_jsx(I18nextProvider, { i18n: i18n, children: _jsx(ApiConfigContext.Provider, { value: mockApiContext, children: _jsx(ModalContext.Provider, { value: { showModal: mockShowModal }, children: _jsx(RecordContext.Provider, { value: mockRecordContext, children: _jsx(ParameterContext.Provider, { value: mockParameterContext, children: children }) }) }) }) }));
+    return (_jsx(I18nextProvider, { i18n: i18n, children: _jsx(ApiConfigContext.Provider, { value: mockApiContext, children: _jsx(HitContext.Provider, { value: mockHitContext, children: _jsx(ParameterContext.Provider, { value: mockParameterContext, children: children }) }) }) }));
 };
 describe('HitContextMenu', () => {
     let user;
@@ -127,11 +122,11 @@ describe('HitContextMenu', () => {
     beforeEach(() => {
         user = userEvent.setup();
         vi.clearAllMocks();
-        mockRecordContext.selectedRecords.length = 0;
-        mockRecordContext.records['test-hit-1'] = createMockHit();
+        mockHitContext.selectedHits.length = 0;
+        mockHitContext.hits['test-hit-1'] = createMockHit();
         mockGetMatchingAnalytic.mockResolvedValue(createMockAnalytic());
         mockGetMatchingTemplate.mockResolvedValue(createMockTemplate());
-        rerender = render(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) })).rerender;
+        rerender = render(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) })).rerender;
     });
     describe('Context Menu Initialization', () => {
         it('should open menu on right-click', async () => {
@@ -195,13 +190,13 @@ describe('HitContextMenu', () => {
         });
         it('should disable "Open Hit" when hit is null', async () => {
             act(() => {
-                mockRecordContext.records['test-hit-1'] = null;
+                mockHitContext.hits['test-hit-1'] = null;
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
             });
             await waitFor(() => {
                 const menuItems = screen.getAllByRole('menuitem');
-                const openHitItem = menuItems.find(item => item.textContent?.toLowerCase().includes('open hit'));
+                const openHitItem = menuItems.find(item => item.textContent?.toLowerCase().includes('open hit viewer'));
                 expect(openHitItem).toHaveAttribute('aria-disabled', 'true');
             });
         });
@@ -242,7 +237,7 @@ describe('HitContextMenu', () => {
                     skip_rationale: false
                 }
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -300,7 +295,7 @@ describe('HitContextMenu', () => {
                 createMockAction({ action_id: 'action-2', name: 'Custom Action 2' })
             ];
             mockDispatchApi.mockResolvedValue({ items: mockActions });
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -344,7 +339,7 @@ describe('HitContextMenu', () => {
         });
         it('should disable custom actions menu when no actions are available', async () => {
             mockDispatchApi.mockResolvedValueOnce({ items: [] });
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -386,7 +381,7 @@ describe('HitContextMenu', () => {
                     skip_rationale: true
                 }
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -454,7 +449,7 @@ describe('HitContextMenu', () => {
         it('should call executeAction with action_id and hit query', async () => {
             const mockActions = [createMockAction({ action_id: 'action-1', name: 'Custom Action' })];
             mockDispatchApi.mockResolvedValue({ items: mockActions });
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -507,7 +502,7 @@ describe('HitContextMenu', () => {
             mockGetMatchingTemplate.mockResolvedValue(createMockTemplate({
                 keys: ['howler.detection', 'event.id']
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
         });
         it('should render exclusion submenu with template keys', async () => {
             act(() => {
@@ -555,7 +550,7 @@ describe('HitContextMenu', () => {
             mockGetMatchingTemplate.mockResolvedValue(createMockTemplate({
                 keys: ['howler.outline.indicators']
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -598,7 +593,7 @@ describe('HitContextMenu', () => {
             mockGetMatchingTemplate.mockResolvedValue(createMockTemplate({
                 keys: []
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -610,7 +605,7 @@ describe('HitContextMenu', () => {
         });
         it('should skip null field values in exclusion menu', async () => {
             act(() => {
-                mockRecordContext.records['test-hit-1'].event = {};
+                mockHitContext.hits['test-hit-1'].event = {};
             });
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
@@ -633,7 +628,7 @@ describe('HitContextMenu', () => {
             mockGetMatchingTemplate.mockResolvedValue(createMockTemplate({
                 keys: ['howler.detection', 'event.id']
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
         });
         it('should render inclusion submenu with template keys', async () => {
             act(() => {
@@ -681,7 +676,7 @@ describe('HitContextMenu', () => {
             mockGetMatchingTemplate.mockResolvedValue(createMockTemplate({
                 keys: ['howler.outline.indicators']
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -724,7 +719,7 @@ describe('HitContextMenu', () => {
             mockGetMatchingTemplate.mockResolvedValue(createMockTemplate({
                 keys: []
             }));
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -736,7 +731,7 @@ describe('HitContextMenu', () => {
         });
         it('should skip null field values in inclusion menu', async () => {
             act(() => {
-                mockRecordContext.records['test-hit-1'].event = {};
+                mockHitContext.hits['test-hit-1'].event = {};
             });
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
@@ -755,24 +750,24 @@ describe('HitContextMenu', () => {
         });
     });
     describe('Multiple Hit Selection', () => {
-        it('should use selectedRecords when current hit is included', async () => {
+        it('should use selectedHits when current hit is included', async () => {
             act(() => {
-                mockRecordContext.records['hit-1'] = createMockHit({ howler: { id: 'hit-1' } });
-                mockRecordContext.records['hit-2'] = createMockHit({ howler: { id: 'hit-2' } });
-                mockRecordContext.selectedRecords.push(mockRecordContext.records['hit-1'], mockRecordContext.records['hit-2']);
+                mockHitContext.hits['hit-1'] = createMockHit({ howler: { id: 'hit-1' } });
+                mockHitContext.hits['hit-2'] = createMockHit({ howler: { id: 'hit-2' } });
+                mockHitContext.selectedHits.push(mockHitContext.hits['hit-1'], mockHitContext.hits['hit-2']);
                 mockGetSelectedId.mockReturnValue('hit-1');
             });
             const contextMenuWrapper = screen.getByText('Test Content').parentElement;
             await user.pointer({ keys: '[MouseRight]', target: contextMenuWrapper });
-            // The component should use selectedRecords for actions
+            // The component should use selectedHits for actions
             // We can verify this indirectly through the useHitActions hook receiving the right data
             expect(screen.getByRole('menu')).toBeInTheDocument();
             expect(mockGetSelectedId).toHaveBeenCalled();
         });
-        it('should use only current hit when not in selectedRecords', async () => {
+        it('should use only current hit when not in selectedHits', async () => {
             act(() => {
-                mockRecordContext.records['hit-1'] = createMockHit({ howler: { id: 'hit-1' } });
-                mockRecordContext.selectedRecords.push(mockRecordContext.records['hit-1']);
+                mockHitContext.hits['hit-1'] = createMockHit({ howler: { id: 'hit-1' } });
+                mockHitContext.selectedHits.push(mockHitContext.hits['hit-1']);
                 mockGetSelectedId.mockReturnValue('test-hit-1');
             });
             const contextMenuWrapper = screen.getByText('Test Content').parentElement;
@@ -791,12 +786,12 @@ describe('HitContextMenu', () => {
         });
         it('should call getMatchingAnalytic when hit has analytic', async () => {
             await waitFor(() => {
-                expect(mockGetMatchingAnalytic).toHaveBeenCalledWith(mockRecordContext.records['test-hit-1']);
+                expect(mockGetMatchingAnalytic).toHaveBeenCalledWith(mockHitContext.hits['test-hit-1']);
             });
         });
         it('should call getMatchingTemplate when menu opens', async () => {
             await waitFor(() => {
-                expect(mockGetMatchingTemplate).toHaveBeenCalledWith(mockRecordContext.records['test-hit-1']);
+                expect(mockGetMatchingTemplate).toHaveBeenCalledWith(mockHitContext.hits['test-hit-1']);
             });
         });
         it('should reset state when menu closes', async () => {
@@ -829,7 +824,7 @@ describe('HitContextMenu', () => {
     describe('Edge Cases and Error Handling', () => {
         it('should not crash when hit is null', async () => {
             act(() => {
-                mockRecordContext.records = {};
+                mockHitContext.hits = {};
             });
             const contextMenuWrapper = screen.getByText('Test Content').parentElement;
             fireEvent.contextMenu(contextMenuWrapper);
@@ -840,7 +835,7 @@ describe('HitContextMenu', () => {
         });
         it('should not render exclusion menu when template is null', async () => {
             mockGetMatchingTemplate.mockResolvedValue(null);
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -854,7 +849,7 @@ describe('HitContextMenu', () => {
         });
         it('should not render inclusion menu when template is null', async () => {
             mockGetMatchingTemplate.mockResolvedValue(null);
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             act(() => {
                 const contextMenuWrapper = screen.getByText('Test Content').parentElement;
                 fireEvent.contextMenu(contextMenuWrapper);
@@ -868,7 +863,7 @@ describe('HitContextMenu', () => {
         });
         it('should handle API failure gracefully', async () => {
             mockDispatchApi.mockResolvedValue(null);
-            rerender(_jsx(Wrapper, { children: _jsx(RecordContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
+            rerender(_jsx(Wrapper, { children: _jsx(HitContextMenu, { getSelectedId: mockGetSelectedId, children: _jsx("div", { children: "Test Content" }) }) }));
             const contextMenuWrapper = screen.getByText('Test Content').parentElement;
             fireEvent.contextMenu(contextMenuWrapper);
             await waitFor(() => {
@@ -879,7 +874,7 @@ describe('HitContextMenu', () => {
         });
         it('should not call getMatchingAnalytic or getMatchingTemplate when hit has no analytic', async () => {
             act(() => {
-                mockRecordContext.records['test-hit-1'].howler.analytic = null;
+                mockHitContext.hits['test-hit-1'].howler.analytic = null;
             });
             const contextMenuWrapper = screen.getByText('Test Content').parentElement;
             fireEvent.contextMenu(contextMenuWrapper);
@@ -898,54 +893,4 @@ describe('HitContextMenu', () => {
             expect(mockPluginStoreExecuteFunction).toHaveBeenCalled();
         });
     });
-    describe('Add to Case Menu Item', () => {
-        it('should render "Add to Case" item in the menu', async () => {
-            act(() => {
-                const contextMenuWrapper = screen.getByText('Test Content').parentElement;
-                fireEvent.contextMenu(contextMenuWrapper);
-            });
-            await waitFor(() => {
-                expect(screen.getByText('Add to Case')).toBeInTheDocument();
-            });
-        });
-        it('should enable "Add to Case" when a record is present', async () => {
-            act(() => {
-                const contextMenuWrapper = screen.getByText('Test Content').parentElement;
-                fireEvent.contextMenu(contextMenuWrapper);
-            });
-            await waitFor(() => {
-                const menuItems = screen.getAllByRole('menuitem');
-                const addToCaseItem = menuItems.find(item => item.textContent?.includes('Add to Case'));
-                expect(addToCaseItem).toHaveAttribute('aria-disabled', 'false');
-            });
-        });
-        it('should disable "Add to Case" when record is null', async () => {
-            act(() => {
-                mockRecordContext.records['test-hit-1'] = null;
-                const contextMenuWrapper = screen.getByText('Test Content').parentElement;
-                fireEvent.contextMenu(contextMenuWrapper);
-            });
-            await waitFor(() => {
-                const menuItems = screen.getAllByRole('menuitem');
-                const addToCaseItem = menuItems.find(item => item.textContent?.includes('Add to Case'));
-                expect(addToCaseItem).toHaveAttribute('aria-disabled', 'true');
-            });
-        });
-        it('should call showModal with an AddToCaseModal element when clicked', async () => {
-            act(() => {
-                const contextMenuWrapper = screen.getByText('Test Content').parentElement;
-                fireEvent.contextMenu(contextMenuWrapper);
-            });
-            await waitFor(() => {
-                expect(screen.getByText('Add to Case')).toBeInTheDocument();
-            });
-            await act(async () => {
-                await user.click(screen.getByText('Add to Case'));
-            });
-            await waitFor(() => {
-                expect(mockShowModal).toHaveBeenCalledOnce();
-                expect(mockShowModal).toHaveBeenCalledWith(expect.objectContaining({ type: expect.any(Function) }));
-            });
-        });
-    });
 });