@cccsaurora/howler-ui 2.18.0-dev.716 → 2.18.0-dev.722

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

@@ -1,136 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Article, BookRounded, CheckCircle, ChevronRight, Folder as FolderIcon, Lightbulb, Link as LinkIcon, TableChart, Visibility } from '@mui/icons-material';
-import { alpha, Skeleton, Stack, Typography, 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 { omit } from 'lodash-es';
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { Link, useLocation } from 'react-router-dom';
-import { useContextSelector } from 'use-context-selector';
-import { ESCALATION_COLORS } from '@cccsaurora/howler-ui/utils/constants';
-import CaseFolderContextMenu from './CaseFolderContextMenu';
-import { buildTree } from './utils';
-// Static map: item type → MUI icon component (avoids re-creating closures on each render)
-const ICON_FOR_TYPE = {
-    case: BookRounded,
-    observable: Visibility,
-    hit: CheckCircle,
-    table: TableChart,
-    lead: Lightbulb,
-    reference: LinkIcon
-};
-const CaseFolder = ({ case: _case, folder, name, step = -1, rootCaseId, pathPrefix = '', onItemUpdated }) => {
-    const theme = useTheme();
-    const location = useLocation();
-    const { dispatchApi } = useMyApi();
-    const [open, setOpen] = useState(true);
-    const [caseStates, setCaseStates] = useState({});
-    const loadRecords = useContextSelector(RecordContext, ctx => ctx.loadRecords);
-    const records = useContextSelector(RecordContext, ctx => ctx.records);
-    const tree = useMemo(() => folder || buildTree(_case?.items), [folder, _case?.items]);
-    const currentRootCaseId = rootCaseId || _case?.case_id;
-    const hitIds = useMemo(() => _case?.items
-        .filter(item => item.type === 'hit')
-        .map(item => item.value)
-        .filter(value => !!value), [_case?.items]);
-    useEffect(() => {
-        if (hitIds.length < 1) {
-            return;
-        }
-        dispatchApi(api.search.hit.post({ query: `howler.id:(${hitIds.join(' OR ')})` }), { throwError: false }).then(result => {
-            if (result?.items?.length < 1) {
-                return;
-            }
-        });
-    }, [hitIds, dispatchApi, _case.status, loadRecords]);
-    // Returns the MUI colour token for the item's escalation, or undefined if none.
-    const getEscalationColor = (itemType, itemKey, leafId) => {
-        if (itemType === 'hit' && leafId) {
-            const color = ESCALATION_COLORS[records[leafId]?.howler?.escalation];
-            if (color)
-                return color;
-        }
-        if (itemType === 'case' && itemKey) {
-            const color = ESCALATION_COLORS[caseStates[itemKey]?.data?.escalation];
-            if (color)
-                return color;
-        }
-        return undefined;
-    };
-    const toggleCase = useCallback((item, itemKey) => {
-        const resolvedKey = itemKey || item.path || item.value;
-        if (!resolvedKey) {
-            return;
-        }
-        const prev = caseStates[resolvedKey] ?? { open: false, loading: false, data: null };
-        const shouldOpen = !prev.open;
-        const shouldFetch = shouldOpen && !!item.value && !prev.data && !prev.loading;
-        setCaseStates(current => ({ ...current, [resolvedKey]: { ...prev, open: shouldOpen, loading: shouldFetch } }));
-        if (!shouldFetch)
-            return;
-        dispatchApi(api.v2.case.get(item.value), { throwError: false })
-            .then(caseResponse => {
-            if (!caseResponse)
-                return;
-            setCaseStates(current => ({ ...current, [resolvedKey]: { ...current[resolvedKey], data: caseResponse } }));
-        })
-            .finally(() => {
-            setCaseStates(current => ({ ...current, [resolvedKey]: { ...current[resolvedKey], loading: false } }));
-        });
-    }, [caseStates, dispatchApi]);
-    return (_jsxs(Stack, { sx: { overflow: 'visible' }, children: [name && (_jsx(CaseFolderContextMenu, { _case: _case, tree: tree, onUpdate: onItemUpdated, children: _jsxs(Stack, { direction: "row", pl: step * 1.5, py: 0.25, sx: {
-                        cursor: 'pointer',
-                        transition: theme.transitions.create('background', { duration: 50 }),
-                        background: 'transparent',
-                        '&:hover': {
-                            background: theme.palette.grey[800]
-                        }
-                    }, onClick: () => setOpen(_open => !_open), children: [_jsx(ChevronRight, { fontSize: "small", color: "disabled", sx: [
-                                { transition: theme.transitions.create('transform', { duration: 100 }), transform: 'rotate(0deg)' },
-                                open && { transform: 'rotate(90deg)' }
-                            ] }), _jsx(FolderIcon, { fontSize: "small", color: "disabled" }), _jsx(Typography, { variant: "caption", color: "textSecondary", sx: { userSelect: 'none', pl: 0.5, textWrap: 'nowrap' }, children: name })] }) })), open && (_jsxs(_Fragment, { children: [Object.entries(omit(tree, 'leaves')).map(([path, subfolder]) => (_jsx(CaseFolder, { name: path, case: _case, folder: subfolder, step: step + 1, rootCaseId: currentRootCaseId, pathPrefix: pathPrefix, onItemUpdated: onItemUpdated }, `${_case?.case_id}-${path}`))), tree.leaves?.map(leaf => {
-                        const itemType = leaf.type?.toLowerCase();
-                        const isCase = itemType === 'case';
-                        const fullRelativePath = [pathPrefix, leaf.path].filter(Boolean).join('/');
-                        const itemKey = fullRelativePath || leaf.value;
-                        const nodeState = itemKey ? caseStates[itemKey] : null;
-                        const isCaseOpen = !!nodeState?.open;
-                        const isCaseLoading = !!nodeState?.loading;
-                        const nestedCase = nodeState?.data ?? null;
-                        const itemPath = itemType !== 'reference'
-                            ? fullRelativePath
-                                ? `/cases/${currentRootCaseId}/${fullRelativePath}`
-                                : `/cases/${currentRootCaseId}`
-                            : leaf.value;
-                        const escalationColor = getEscalationColor(itemType, itemKey, leaf.value);
-                        const iconColor = escalationColor ?? 'inherit';
-                        const leafColor = escalationColor ? `${escalationColor}.light` : 'text.secondary';
-                        const Icon = ICON_FOR_TYPE[itemType ?? ''] ?? Article;
-                        return (_jsx(CaseFolderContextMenu, { _case: _case, leaf: leaf, onUpdate: onItemUpdated, children: _jsxs(Stack, { children: [_jsxs(Stack, { direction: "row", pl: step * 1.5 + 1, py: 0.25, sx: [
-                                            {
-                                                cursor: 'pointer',
-                                                overflow: 'visible',
-                                                color: `${theme.palette.text.secondary} !important`,
-                                                textDecoration: 'none',
-                                                transition: theme.transitions.create('background', { duration: 100 }),
-                                                background: 'transparent',
-                                                '&:hover': {
-                                                    background: theme.palette.grey[800]
-                                                },
-                                                borderRight: '3px solid transparent'
-                                            },
-                                            decodeURIComponent(location.pathname) === itemPath && {
-                                                background: alpha(theme.palette.grey[600], 0.15),
-                                                borderRightColor: theme.palette.primary.main
-                                            }
-                                        ], onClick: () => isCase && toggleCase(leaf, itemKey), component: Link, to: itemPath, target: itemType === 'reference' ? '_blank' : undefined, rel: itemType === 'reference' ? 'noopener noreferrer' : undefined, children: [_jsx(ChevronRight, { fontSize: "small", sx: [
-                                                    !isCase && { opacity: 0 },
-                                                    isCase && {
-                                                        transition: theme.transitions.create('transform', { duration: 100 }),
-                                                        transform: isCaseOpen ? 'rotate(90deg)' : 'rotate(0deg)'
-                                                    }
-                                                ] }), _jsx(Icon, { fontSize: "small", color: iconColor }), _jsx(Typography, { variant: "caption", color: leafColor, sx: { userSelect: 'none', pl: 0.5, textWrap: 'nowrap' }, children: leaf.path?.split('/').pop() || leaf.value })] }), isCase && isCaseOpen && isCaseLoading && (_jsx(Stack, { pl: step * 1.5 + 4, py: 0.25, children: _jsx(Skeleton, { width: 140, height: 16 }) })), isCase && isCaseOpen && nestedCase && (_jsx(CaseFolder, { case: nestedCase, step: step + 1, rootCaseId: currentRootCaseId, pathPrefix: fullRelativePath, onItemUpdated: onItemUpdated }))] }) }, `${_case?.case_id}-${leaf.value}-${leaf.path}`));
-                    })] }))] }));
-};
-export default CaseFolder;

package/components/routes/cases/detail/sidebar/CaseFolderContextMenu.d.ts

@@ -1,34 +0,0 @@
-import type { Case } from '@cccsaurora/howler-ui/models/entities/generated/Case';
-import type { Item } from '@cccsaurora/howler-ui/models/entities/generated/Item';
-import { type FC, type PropsWithChildren } from 'react';
-import type { Tree } from './types';
-/**
- * Recursively collects all leaf items from a folder tree.
- */
-export declare const collectAllLeaves: (tree: Tree) => Item[];
-/**
- * Returns the URL to open for a given leaf item, or null if no URL applies.
- * - reference: the item's value (an external URL)
- * - hit: /hits/<id>
- * - observable: /observables/<id>
- * - case: /cases/<id>
- * - table / lead: null (no dedicated detail page)
- */
-export declare const getOpenUrl: (leaf: Item) => string | null;
-export interface CaseFolderContextMenuProps extends PropsWithChildren {
-    /** The case that owns the item(s). */
-    _case: Case;
-    /** Present when the context menu is for a single leaf item. */
-    leaf?: Item;
-    /** Present when the context menu is for a folder (all leaves within it will be removed). */
-    tree?: Tree;
-    /** Called after item(s) have been updated (renamed, removed). */
-    onUpdate?: (updatedCase: Case) => void;
-}
-/**
- * Wraps its children with a right-click context menu providing:
- * - **Open item** – opens the item in a new tab (only for leaf items with a navigable URL).
- * - **Remove item / Remove folder** – deletes the leaf item or all items under a folder.
- */
-declare const CaseFolderContextMenu: FC<CaseFolderContextMenuProps>;
-export default CaseFolderContextMenu;

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

@@ -1,105 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Delete, DriveFileRenameOutline, OpenInNew } from '@mui/icons-material';
-import api from '@cccsaurora/howler-ui/api';
-import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
-import ContextMenu, {} from '@cccsaurora/howler-ui/components/elements/ContextMenu';
-import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
-import RenameItemModal from '@cccsaurora/howler-ui/components/routes/cases/modals/RenameItemModal';
-import { useContext, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-/**
- * Recursively collects all leaf items from a folder tree.
- */
-export const collectAllLeaves = (tree) => {
-    const result = [...(tree.leaves ?? [])];
-    for (const key of Object.keys(tree)) {
-        if (key !== 'leaves') {
-            result.push(...collectAllLeaves(tree[key]));
-        }
-    }
-    return result;
-};
-/**
- * Returns the URL to open for a given leaf item, or null if no URL applies.
- * - reference: the item's value (an external URL)
- * - hit: /hits/<id>
- * - observable: /observables/<id>
- * - case: /cases/<id>
- * - table / lead: null (no dedicated detail page)
- */
-export const getOpenUrl = (leaf) => {
-    const type = leaf.type?.toLowerCase();
-    if (type === 'reference') {
-        return leaf.value ?? null;
-    }
-    if (type === 'hit') {
-        return leaf.value ? `/hits/${leaf.value}` : null;
-    }
-    if (type === 'observable') {
-        return leaf.value ? `/observables/${leaf.value}` : null;
-    }
-    if (type === 'case') {
-        return leaf.value ? `/cases/${leaf.value}` : null;
-    }
-    return null;
-};
-/**
- * Wraps its children with a right-click context menu providing:
- * - **Open item** – opens the item in a new tab (only for leaf items with a navigable URL).
- * - **Remove item / Remove folder** – deletes the leaf item or all items under a folder.
- */
-const CaseFolderContextMenu = ({ _case, leaf, tree, onUpdate, children }) => {
-    const { dispatchApi } = useMyApi();
-    const { t } = useTranslation();
-    const { showModal } = useContext(ModalContext);
-    const items = useMemo(() => {
-        const entries = [];
-        if (leaf) {
-            const openUrl = getOpenUrl(leaf);
-            if (openUrl) {
-                entries.push({
-                    kind: 'item',
-                    id: 'open-item',
-                    label: t('page.cases.sidebar.item.open'),
-                    icon: _jsx(OpenInNew, { fontSize: "small" }),
-                    onClick: () => window.open(openUrl, '_blank', 'noopener noreferrer')
-                });
-            }
-            entries.push({
-                kind: 'item',
-                id: 'rename-item',
-                label: t('page.cases.sidebar.item.rename'),
-                icon: _jsx(DriveFileRenameOutline, { fontSize: "small" }),
-                onClick: () => showModal(_jsx(RenameItemModal, { _case: _case, leaf: leaf, onRenamed: onUpdate }), { height: null })
-            });
-        }
-        if (entries.length > 0) {
-            entries.push({ kind: 'divider', id: 'divider-remove' });
-        }
-        const isFolder = !leaf && !!tree;
-        entries.push({
-            kind: 'item',
-            id: 'remove-item',
-            label: isFolder ? t('page.cases.sidebar.folder.remove') : t('page.cases.sidebar.item.remove'),
-            icon: _jsx(Delete, { fontSize: "small" }),
-            onClick: () => {
-                if (!_case.case_id) {
-                    return;
-                }
-                const itemsToDelete = leaf ? [leaf] : tree ? collectAllLeaves(tree) : [];
-                const values = itemsToDelete.filter(i => !!i.value).map(i => i.value);
-                if (!values.length) {
-                    return;
-                }
-                dispatchApi(api.v2.case.items.del(_case.case_id, values), { throwError: false }).then(updatedCase => {
-                    if (updatedCase) {
-                        onUpdate?.(updatedCase);
-                    }
-                });
-            }
-        });
-        return entries;
-    }, [_case, leaf, tree, dispatchApi, onUpdate, showModal, t]);
-    return _jsx(ContextMenu, { items: items, children: children });
-};
-export default CaseFolderContextMenu;

package/components/routes/cases/detail/sidebar/CaseFolderContextMenu.test.d.ts

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

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

@@ -1,351 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { act } from 'react';
-import { beforeEach, describe, expect, it, vi } from 'vitest';
-// ---------------------------------------------------------------------------
-// Mocks
-// ---------------------------------------------------------------------------
-vi.mock('components/elements/ContextMenu', () => ({
-    default: ({ items, children }) => (_jsxs("div", { children: [children, items.map((item) => {
-                if (item.kind === 'item') {
-                    return (_jsx("button", { id: item.id, onClick: item.onClick, children: item.label }, item.id));
-                }
-                if (item.kind === 'divider') {
-                    return _jsx("hr", {}, item.id);
-                }
-                return null;
-            })] }))
-}));
-const mockDispatchApi = vi.hoisted(() => vi.fn());
-vi.mock('components/hooks/useMyApi', () => ({
-    default: () => ({ dispatchApi: mockDispatchApi })
-}));
-const mockDel = vi.hoisted(() => vi.fn());
-const mockPatch = vi.hoisted(() => vi.fn());
-vi.mock('api', () => ({
-    default: {
-        v2: {
-            case: {
-                items: {
-                    del: (...args) => mockDel(...args),
-                    patch: (...args) => mockPatch(...args)
-                }
-            }
-        }
-    }
-}));
-const mockShowModal = vi.hoisted(() => vi.fn());
-vi.mock('components/app/providers/ModalProvider', async () => {
-    const { createContext } = await import('react');
-    return {
-        ModalContext: createContext({ showModal: mockShowModal, close: vi.fn(), setContent: vi.fn() })
-    };
-});
-vi.mock('components/routes/cases/modals/RenameItemModal', () => ({
-    default: () => _jsx("div", { id: "rename-item-modal" })
-}));
-// ---------------------------------------------------------------------------
-// Imports (after mocks so that module registry picks up the stubs)
-// ---------------------------------------------------------------------------
-import CaseFolderContextMenu, { collectAllLeaves, getOpenUrl } from './CaseFolderContextMenu';
-// ---------------------------------------------------------------------------
-// Fixtures
-// ---------------------------------------------------------------------------
-const mockCase = { case_id: 'case-1', title: 'Test Case', items: [] };
-const hitLeaf = { type: 'hit', value: 'hit-123', path: 'folder/hit-item' };
-const referenceLeaf = { type: 'reference', value: 'https://example.com', path: 'folder/ref-item' };
-const observableLeaf = { type: 'observable', value: 'obs-456', path: 'folder/obs-item' };
-const caseLeaf = { type: 'case', value: 'nested-case-id', path: 'folder/case-item' };
-const tableLeaf = { type: 'table', value: 'table-789', path: 'folder/table-item' };
-const leadLeaf = { type: 'lead', value: 'lead-999', path: 'folder/lead-item' };
-const renderMenu = (props) => render(_jsx(CaseFolderContextMenu, { _case: mockCase, ...props, children: _jsx("div", { id: "child", children: "child" }) }));
-// ---------------------------------------------------------------------------
-// Setup
-// ---------------------------------------------------------------------------
-beforeEach(() => {
-    mockDel.mockClear();
-    mockPatch.mockClear();
-    mockDispatchApi.mockClear();
-    mockShowModal.mockClear();
-    mockDispatchApi.mockImplementation((p) => p);
-    mockDel.mockResolvedValue(mockCase);
-    mockPatch.mockResolvedValue(mockCase);
-    vi.spyOn(window, 'open').mockReturnValue(null);
-});
-// ---------------------------------------------------------------------------
-// Unit tests for exported utilities
-// ---------------------------------------------------------------------------
-describe('collectAllLeaves', () => {
-    it('returns leaves at the root level', () => {
-        const tree = { leaves: [hitLeaf, referenceLeaf] };
-        expect(collectAllLeaves(tree)).toEqual([hitLeaf, referenceLeaf]);
-    });
-    it('returns leaves from nested subfolders', () => {
-        const tree = {
-            leaves: [hitLeaf],
-            subfolder: { leaves: [referenceLeaf] }
-        };
-        expect(collectAllLeaves(tree)).toEqual([hitLeaf, referenceLeaf]);
-    });
-    it('returns leaves from deeply nested subfolders', () => {
-        const tree = {
-            leaves: [],
-            level1: {
-                leaves: [hitLeaf],
-                level2: { leaves: [referenceLeaf] }
-            }
-        };
-        const result = collectAllLeaves(tree);
-        expect(result).toContain(hitLeaf);
-        expect(result).toContain(referenceLeaf);
-    });
-    it('returns an empty array for an empty tree', () => {
-        expect(collectAllLeaves({ leaves: [] })).toEqual([]);
-    });
-});
-describe('getOpenUrl', () => {
-    it('returns the value directly for a reference item', () => {
-        expect(getOpenUrl(referenceLeaf)).toBe('https://example.com');
-    });
-    it('returns /hits/<id> for a hit item', () => {
-        expect(getOpenUrl(hitLeaf)).toBe('/hits/hit-123');
-    });
-    it('returns /observables/<id> for an observable item', () => {
-        expect(getOpenUrl(observableLeaf)).toBe('/observables/obs-456');
-    });
-    it('returns /cases/<id> for a case item', () => {
-        expect(getOpenUrl(caseLeaf)).toBe('/cases/nested-case-id');
-    });
-    it('returns null for a table item', () => {
-        expect(getOpenUrl(tableLeaf)).toBeNull();
-    });
-    it('returns null for a lead item', () => {
-        expect(getOpenUrl(leadLeaf)).toBeNull();
-    });
-    it('returns null when value is undefined', () => {
-        expect(getOpenUrl({ type: 'hit' })).toBeNull();
-    });
-    it('returns null when type is undefined', () => {
-        expect(getOpenUrl({ value: 'something' })).toBeNull();
-    });
-});
-// ---------------------------------------------------------------------------
-// Component tests
-// ---------------------------------------------------------------------------
-describe('CaseFolderContextMenu', () => {
-    describe('renders children', () => {
-        it('renders children content', () => {
-            renderMenu({ leaf: hitLeaf });
-            expect(screen.getByTestId('child')).toBeInTheDocument();
-        });
-    });
-    describe('menu items for leaf types', () => {
-        it('shows "Open item" and "Remove item" for a hit leaf', () => {
-            renderMenu({ leaf: hitLeaf });
-            expect(screen.getByTestId('open-item')).toBeInTheDocument();
-            expect(screen.getByTestId('remove-item')).toBeInTheDocument();
-        });
-        it('shows "Open item" and "Remove item" for a reference leaf', () => {
-            renderMenu({ leaf: referenceLeaf });
-            expect(screen.getByTestId('open-item')).toBeInTheDocument();
-            expect(screen.getByTestId('remove-item')).toBeInTheDocument();
-        });
-        it('shows "Open item" and "Remove item" for an observable leaf', () => {
-            renderMenu({ leaf: observableLeaf });
-            expect(screen.getByTestId('open-item')).toBeInTheDocument();
-            expect(screen.getByTestId('remove-item')).toBeInTheDocument();
-        });
-        it('shows "Open item" and "Remove item" for a case leaf', () => {
-            renderMenu({ leaf: caseLeaf });
-            expect(screen.getByTestId('open-item')).toBeInTheDocument();
-            expect(screen.getByTestId('remove-item')).toBeInTheDocument();
-        });
-        it('shows only "Remove item" for a table leaf (no open URL)', () => {
-            renderMenu({ leaf: tableLeaf });
-            expect(screen.queryByTestId('open-item')).not.toBeInTheDocument();
-            expect(screen.getByTestId('remove-item')).toBeInTheDocument();
-        });
-        it('shows only "Remove item" for a lead leaf (no open URL)', () => {
-            renderMenu({ leaf: leadLeaf });
-            expect(screen.queryByTestId('open-item')).not.toBeInTheDocument();
-            expect(screen.getByTestId('remove-item')).toBeInTheDocument();
-        });
-        it('labels the remove button "Remove item" for a leaf', () => {
-            renderMenu({ leaf: hitLeaf });
-            expect(screen.getByTestId('remove-item')).toHaveTextContent('page.cases.sidebar.item.remove');
-        });
-        it('shows a divider for all leaf types (between leaf actions and remove)', () => {
-            const { container: withOpen } = renderMenu({ leaf: hitLeaf });
-            expect(withOpen.querySelector('hr')).not.toBeNull();
-            const { container: withoutOpen } = renderMenu({ leaf: tableLeaf });
-            expect(withoutOpen.querySelector('hr')).not.toBeNull();
-            const { container: withFolder } = renderMenu({ tree: { leaves: [hitLeaf] } });
-            expect(withFolder.querySelector('hr')).toBeNull();
-        });
-    });
-    describe('menu items for folders', () => {
-        const folderTree = { leaves: [hitLeaf, referenceLeaf] };
-        it('shows only "Remove folder" for a folder (no open URL)', () => {
-            renderMenu({ tree: folderTree });
-            expect(screen.queryByTestId('open-item')).not.toBeInTheDocument();
-            expect(screen.getByTestId('remove-item')).toBeInTheDocument();
-        });
-        it('labels the remove button "Remove folder" for a tree', () => {
-            renderMenu({ tree: folderTree });
-            expect(screen.getByTestId('remove-item')).toHaveTextContent('page.cases.sidebar.folder.remove');
-        });
-    });
-    describe('"Open item" action', () => {
-        it('calls window.open with the hit URL', () => {
-            renderMenu({ leaf: hitLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('open-item'));
-            });
-            expect(window.open).toHaveBeenCalledWith('/hits/hit-123', '_blank', 'noopener noreferrer');
-        });
-        it('calls window.open with the reference URL directly', () => {
-            renderMenu({ leaf: referenceLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('open-item'));
-            });
-            expect(window.open).toHaveBeenCalledWith('https://example.com', '_blank', 'noopener noreferrer');
-        });
-        it('calls window.open with the observable URL', () => {
-            renderMenu({ leaf: observableLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('open-item'));
-            });
-            expect(window.open).toHaveBeenCalledWith('/observables/obs-456', '_blank', 'noopener noreferrer');
-        });
-        it('calls window.open with the case URL', () => {
-            renderMenu({ leaf: caseLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('open-item'));
-            });
-            expect(window.open).toHaveBeenCalledWith('/cases/nested-case-id', '_blank', 'noopener noreferrer');
-        });
-    });
-    describe('"Remove item" action for a leaf', () => {
-        it('calls dispatchApi with the delete call for the leaf', async () => {
-            renderMenu({ leaf: hitLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            await waitFor(() => {
-                expect(mockDel).toHaveBeenCalledWith('case-1', ['hit-123']);
-            });
-        });
-        it('calls onUpdate with the updated case after the delete resolves', async () => {
-            const onUpdate = vi.fn();
-            renderMenu({ leaf: hitLeaf, onUpdate: onUpdate });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            await waitFor(() => {
-                expect(onUpdate).toHaveBeenCalledWith(mockCase);
-            });
-        });
-        it('does not call the API when case_id is missing', () => {
-            renderMenu({ _case: { title: 'No ID' }, leaf: hitLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            expect(mockDel).not.toHaveBeenCalled();
-        });
-        it('skips items with no value', async () => {
-            const noValueLeaf = { type: 'hit', path: 'folder/no-value' };
-            renderMenu({ leaf: noValueLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            await waitFor(() => {
-                expect(mockDel).not.toHaveBeenCalled();
-            });
-        });
-    });
-    describe('"Rename item" action', () => {
-        it('shows "Rename item" entry for a hit leaf', () => {
-            renderMenu({ leaf: hitLeaf });
-            expect(screen.getByTestId('rename-item')).toBeInTheDocument();
-        });
-        it('shows "Rename item" for a table leaf', () => {
-            renderMenu({ leaf: tableLeaf });
-            expect(screen.getByTestId('rename-item')).toBeInTheDocument();
-        });
-        it('does not show "Rename item" for a folder', () => {
-            renderMenu({ tree: { leaves: [hitLeaf] } });
-            expect(screen.queryByTestId('rename-item')).not.toBeInTheDocument();
-        });
-        it('calls showModal when "Rename item" is clicked', () => {
-            renderMenu({ leaf: hitLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('rename-item'));
-            });
-            expect(mockShowModal).toHaveBeenCalledTimes(1);
-        });
-        it('passes the current case and leaf to the rename modal', () => {
-            const onUpdate = vi.fn();
-            renderMenu({ leaf: hitLeaf, onUpdate: onUpdate });
-            act(() => {
-                fireEvent.click(screen.getByTestId('rename-item'));
-            });
-            const [modalElement] = mockShowModal.mock.calls[0];
-            expect(modalElement.props._case).toBe(mockCase);
-            expect(modalElement.props.leaf).toBe(hitLeaf);
-        });
-        it('works fine when onUpdate is not provided', () => {
-            renderMenu({ leaf: hitLeaf });
-            act(() => {
-                fireEvent.click(screen.getByTestId('rename-item'));
-            });
-            expect(mockShowModal).toHaveBeenCalledTimes(1);
-        });
-    });
-    describe('"Remove folder" action', () => {
-        it('calls dispatchApi with all leaf values in a single batch call', async () => {
-            const folderTree = { leaves: [hitLeaf, referenceLeaf] };
-            renderMenu({ tree: folderTree });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            await waitFor(() => {
-                expect(mockDel).toHaveBeenCalledWith('case-1', ['hit-123', 'https://example.com']);
-                expect(mockDel).toHaveBeenCalledTimes(1);
-            });
-        });
-        it('calls dispatchApi with leaves from nested subfolders in a single batch call', async () => {
-            const nestedTree = {
-                leaves: [hitLeaf],
-                subfolder: { leaves: [referenceLeaf] }
-            };
-            renderMenu({ tree: nestedTree });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            await waitFor(() => {
-                expect(mockDel).toHaveBeenCalledWith('case-1', expect.arrayContaining(['hit-123', 'https://example.com']));
-                expect(mockDel).toHaveBeenCalledTimes(1);
-            });
-        });
-        it('calls onUpdate with the updated case after deletion', async () => {
-            const onUpdate = vi.fn();
-            const folderTree = { leaves: [hitLeaf, referenceLeaf] };
-            renderMenu({ tree: folderTree, onUpdate: onUpdate });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            await waitFor(() => {
-                expect(onUpdate).toHaveBeenCalledWith(mockCase);
-            });
-        });
-        it('does not call the API or onUpdate for an empty folder', () => {
-            const onUpdate = vi.fn();
-            renderMenu({ tree: { leaves: [] }, onUpdate: onUpdate });
-            act(() => {
-                fireEvent.click(screen.getByTestId('remove-item'));
-            });
-            expect(mockDel).not.toHaveBeenCalled();
-            expect(onUpdate).not.toHaveBeenCalled();
-        });
-    });
-});

package/components/routes/cases/detail/sidebar/types.d.ts

@@ -1,3 +0,0 @@
-import type { Item } from 'models/entities/generated/Item';
-
-export type Tree = { leaves?: Item[]; [folder: string]: Tree | Item[] };

package/components/routes/cases/detail/sidebar/utils.d.ts

@@ -1,3 +0,0 @@
-import type { Item } from '@cccsaurora/howler-ui/models/entities/generated/Item';
-import type { Tree } from './types';
-export declare const buildTree: (items?: Item[]) => Tree;

package/components/routes/cases/detail/sidebar/utils.js

@@ -1,25 +0,0 @@
-import { get, set } from 'lodash-es';
-export const buildTree = (items = []) => {
-    // Root tree node stores direct children in `leaves` and nested folders as object keys.
-    const tree = { leaves: [] };
-    items.forEach(item => {
-        // Ignore items that cannot be placed in the folder structure.
-        if (!item?.path) {
-            return;
-        }
-        // Split path into folder segments + item name, then remove the item name.
-        const parts = item.path.split('/');
-        parts.pop();
-        if (parts.length > 0) {
-            // Use dot notation so lodash `get/set` can address nested folder objects.
-            const key = parts.join('.');
-            const size = get(tree, key)?.leaves?.length || 0;
-            // Append this item to the folder's `leaves` array.
-            set(tree, `${key}.leaves.${size}`, item);
-            return;
-        }
-        // Items without parent folders are top-level leaves.
-        tree.leaves.push(item);
-    });
-    return tree;
-};