@cccsaurora/howler-ui 2.19.0-cases.1138 → 2.19.0-cases.1192

package/components/elements/addons/buttons/CustomIconButton.test.js

@@ -0,0 +1,81 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { render, screen } from '@testing-library/react';
+import { setupReactRouterMock } from '@cccsaurora/howler-ui/tests/mocks';
+import { vi } from 'vitest';
+setupReactRouterMock();
+import CustomIconButton from './CustomIconButton';
+describe('CustomIconButton', () => {
+    afterAll(() => vi.resetModules());
+    describe('rendering', () => {
+        it('renders a button element', () => {
+            render(_jsx(CustomIconButton, { "aria-label": "test", children: "icon" }));
+            expect(screen.getByRole('button', { name: 'test' })).toBeInTheDocument();
+        });
+        it('renders children inside the button', () => {
+            render(_jsx(CustomIconButton, { children: "\u2605" }));
+            expect(screen.getByText('★')).toBeInTheDocument();
+        });
+        it('renders with MUI IconButton classes', () => {
+            render(_jsx(CustomIconButton, { children: "i" }));
+            expect(screen.getByRole('button')).toHaveClass('MuiIconButton-root');
+        });
+    });
+    describe('disabled state', () => {
+        it('is disabled when disabled prop is true', () => {
+            render(_jsx(CustomIconButton, { disabled: true, children: "icon" }));
+            expect(screen.getByRole('button')).toBeDisabled();
+        });
+        it('is disabled when progress is truthy', () => {
+            render(_jsx(CustomIconButton, { progress: true, children: "icon" }));
+            expect(screen.getByRole('button')).toBeDisabled();
+        });
+        it('is NOT disabled when progress is set but clickableWithProgress=true', () => {
+            render(_jsx(CustomIconButton, { progress: true, clickableWithProgress: true, children: "icon" }));
+            expect(screen.getByRole('button')).not.toBeDisabled();
+        });
+    });
+    describe('progress indicator', () => {
+        it('renders a CircularProgress when progress is truthy', () => {
+            render(_jsx(CustomIconButton, { progress: true, children: "icon" }));
+            // CircularProgress renders an svg with role="progressbar"
+            expect(document.querySelector('circle')).toBeInTheDocument();
+        });
+        it('does not render CircularProgress when progress is falsy', () => {
+            render(_jsx(CustomIconButton, { children: "icon" }));
+            expect(document.querySelector('[role="progressbar"]')).not.toBeInTheDocument();
+        });
+    });
+    describe('tooltip', () => {
+        it('wraps the button in a Tooltip when tooltip prop is provided', () => {
+            render(_jsx(CustomIconButton, { tooltip: "Save", children: "icon" }));
+            // The button is wrapped in a <span> when a Tooltip is used
+            const span = screen.getByRole('button').closest('span');
+            expect(span).toBeInTheDocument();
+        });
+        it('does not add a surrounding span when no tooltip is given', () => {
+            render(_jsx(CustomIconButton, { children: "icon" }));
+            const button = screen.getByRole('button');
+            // Without tooltip the immediate parent should NOT be a span wrapper
+            expect(button.parentElement?.tagName).not.toBe('SPAN');
+        });
+    });
+    describe('route link', () => {
+        it('wraps the button in a Link when route prop is provided', () => {
+            render(_jsx(CustomIconButton, { route: "/hits", children: "icon" }));
+            expect(screen.getByRole('link')).toBeInTheDocument();
+        });
+        it('does not render a link when no route is given', () => {
+            render(_jsx(CustomIconButton, { children: "icon" }));
+            expect(screen.queryByRole('link')).not.toBeInTheDocument();
+        });
+    });
+    describe('href link', () => {
+        it('wraps the button in an anchor tag when href is provided', () => {
+            render(_jsx(CustomIconButton, { href: "https://example.com", children: "icon" }));
+            const anchor = screen.getByRole('link');
+            expect(anchor).toBeInTheDocument();
+            expect(anchor).toHaveAttribute('href', 'https://example.com');
+        });
+    });
+});

package/components/elements/addons/layout/FlexVertical.test.d.ts

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

package/components/elements/addons/layout/FlexVertical.test.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { render, screen } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+import FlexVertical from './FlexVertical';
+describe('FlexVertical', () => {
+    it('renders a div with display:flex and flex-direction:column', () => {
+        const { container } = render(_jsx(FlexVertical, { children: _jsx("span", { children: "child" }) }));
+        const div = container.firstChild;
+        expect(div).toBeInTheDocument();
+        expect(div).toHaveStyle({ display: 'flex', flexDirection: 'column' });
+    });
+    it('renders children inside the flex container', () => {
+        render(_jsx(FlexVertical, { children: _jsx("span", { id: "inner", children: "hello" }) }));
+        expect(screen.getByTestId('inner')).toBeInTheDocument();
+    });
+    it('renders multiple children', () => {
+        render(_jsxs(FlexVertical, { children: [_jsx("span", { id: "a", children: "A" }), _jsx("span", { id: "b", children: "B" })] }));
+        expect(screen.getByTestId('a')).toBeInTheDocument();
+        expect(screen.getByTestId('b')).toBeInTheDocument();
+    });
+    it('applies the default flex value of 1', () => {
+        const { container } = render(_jsx(FlexVertical, { children: _jsx("span", { children: "child" }) }));
+        const div = container.firstChild;
+        expect(div).toHaveStyle({ flex: 1 });
+    });
+    it('applies a custom flex value when provided', () => {
+        const { container } = render(_jsx(FlexVertical, { flex: 2, children: _jsx("span", { children: "child" }) }));
+        const div = container.firstChild;
+        expect(div).toHaveStyle({ flex: 2 });
+    });
+});

package/components/elements/addons/layout/vsbox/VSBoxContent.test.d.ts

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

package/components/elements/addons/layout/vsbox/VSBoxContent.test.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// <reference types="vitest" />
+import { render, screen } from '@testing-library/react';
+import { describe, expect, it } from 'vitest';
+import VSBoxContent from './VSBoxContent';
+describe('VSBoxContent', () => {
+    it('renders children inside a div with data-vsbox-content attribute', () => {
+        render(_jsx(VSBoxContent, { children: _jsx("span", { children: "hello" }) }));
+        const el = document.querySelector('[data-vsbox-content]');
+        expect(el).toBeInTheDocument();
+        expect(el).toHaveAttribute('data-vsbox-content', 'true');
+    });
+    it('renders children correctly', () => {
+        render(_jsx(VSBoxContent, { children: _jsx("span", { id: "child", children: "content" }) }));
+        expect(screen.getByTestId('child')).toBeInTheDocument();
+    });
+    it('passes additional MUI Box props through', () => {
+        const { container } = render(_jsx(VSBoxContent, { sx: { display: 'flex' }, children: _jsx("span", { children: "content" }) }));
+        expect(container.firstChild).toBeInTheDocument();
+    });
+    it('renders multiple children', () => {
+        render(_jsxs(VSBoxContent, { children: [_jsx("span", { id: "a", children: "A" }), _jsx("span", { id: "b", children: "B" })] }));
+        expect(screen.getByTestId('a')).toBeInTheDocument();
+        expect(screen.getByTestId('b')).toBeInTheDocument();
+    });
+});

package/components/elements/addons/search/phrase/WordLexer.test.d.ts

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

package/components/elements/addons/search/phrase/WordLexer.test.js

@@ -0,0 +1,55 @@
+/// <reference types="vitest" />
+import { describe, expect, it } from 'vitest';
+import WordLexer from './word/WordLexer';
+describe('WordLexer', () => {
+    const lexer = new WordLexer();
+    describe('parse', () => {
+        it('parses a single word', () => {
+            const result = lexer.parse('hello');
+            expect(result.tokens).toHaveLength(2); // word + eop
+            expect(result.tokens[0].type).toBe('word');
+            expect(result.tokens[0].value).toBe('hello');
+        });
+        it('parses two words separated by a space', () => {
+            const result = lexer.parse('hello world');
+            const nonEop = result.tokens.filter(t => t.type !== 'eop');
+            expect(nonEop.some(t => t.type === 'word' && t.value === 'hello')).toBe(true);
+            expect(nonEop.some(t => t.type === 'word' && t.value === 'world')).toBe(true);
+        });
+        it('always ends with an eop token', () => {
+            const result = lexer.parse('foo bar');
+            const last = result.tokens[result.tokens.length - 1];
+            expect(last.type).toBe('eop');
+            expect(last.value).toBe('');
+        });
+        it('returns an eop-only token list for empty input', () => {
+            const result = lexer.parse('');
+            expect(result.tokens).toHaveLength(1);
+            expect(result.tokens[0].type).toBe('eop');
+        });
+        it('sets cursor correctly', () => {
+            const result = lexer.parse('hello', 3);
+            expect(result.cursor).toBe(3);
+        });
+        it('sets current token for cursor in the middle of a word', () => {
+            const result = lexer.parse('hello', 3);
+            expect(result.current?.type).toBe('word');
+        });
+        it('provides suggest token for current cursor position', () => {
+            const result = lexer.parse('hello world', 7);
+            expect(result.suggest).toBeDefined();
+            expect(result.suggest.token).toBeDefined();
+        });
+        it('sets startIndex/endIndex correctly on word tokens', () => {
+            const result = lexer.parse('hi');
+            const wordToken = result.tokens.find(t => t.type === 'word');
+            expect(wordToken.startIndex).toBe(0);
+            expect(wordToken.endIndex).toBe(1);
+        });
+        it('whitespace tokens have correct type', () => {
+            const result = lexer.parse('a b');
+            const wsToken = result.tokens.find(t => t.type === 'whitespace');
+            expect(wsToken).toBeDefined();
+        });
+    });
+});

package/components/elements/hit/HitLabels.test.d.ts

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

package/components/elements/hit/HitLabels.test.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+import HitLabels from './HitLabels';
+/**
+ * HitLabels.test.tsx
+ *
+ * Purpose:
+ * This test suite validates the core behavior of the HitLabels component.
+ * - Correct transformation of hit.howler.labels into UI chips
+ * - Proper rendering of all label values
+ * - Conditional display of the edit button based on readOnly mode
+ * - Safe rendering when no labels are present
+ */
+vi.mock('components/hooks/useMyApi', () => ({
+    default: () => ({
+        dispatchApi: vi.fn()
+    })
+}));
+vi.mock('components/app/providers/RecordProvider', () => ({
+    RecordContext: {}
+}));
+vi.mock('use-context-selector', () => ({
+    useContextSelector: () => vi.fn()
+}));
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({
+        t: (key) => key
+    }),
+    Trans: ({ i18nKey }) => i18nKey
+}));
+vi.mock('utils/constants', () => ({
+    LABEL_TYPES: {
+        security: { icon: null, color: '#ff0000' },
+        system: { icon: null, color: '#00ff00' }
+    }
+}));
+const baseHit = {
+    howler: {
+        id: 'hit-1',
+        labels: {
+            security: ['critical', 'high'],
+            system: ['info']
+        }
+    }
+};
+describe('HitLabels', () => {
+    it('renders all labels from hit.howler.labels', () => {
+        render(_jsx(HitLabels, { hit: baseHit, readOnly: true }));
+        expect(screen.getByText('critical')).toBeInTheDocument();
+        expect(screen.getByText('high')).toBeInTheDocument();
+        expect(screen.getByText('info')).toBeInTheDocument();
+    });
+    it('renders correct number of labels', () => {
+        render(_jsx(HitLabels, { hit: baseHit, readOnly: true }));
+        const labels = screen.getAllByText(/critical|high|info/);
+        expect(labels.length).toBe(3);
+    });
+    it('shows edit button when not readOnly', () => {
+        render(_jsx(HitLabels, { hit: baseHit, readOnly: false }));
+        expect(screen.getByRole('button')).toBeInTheDocument();
+    });
+    it('hides edit button when readOnly', () => {
+        render(_jsx(HitLabels, { hit: baseHit, readOnly: true }));
+        expect(screen.queryByRole('button')).not.toBeInTheDocument();
+    });
+    it('renders without crashing when labels are empty', () => {
+        const emptyHit = {
+            howler: {
+                id: 'hit-1',
+                labels: {}
+            }
+        };
+        const { container } = render(_jsx(HitLabels, { hit: emptyHit, readOnly: true }));
+        expect(container).toBeInTheDocument();
+    });
+});

package/components/elements/hit/HitLinks.d.ts

@@ -1,10 +1,11 @@
+import type { FC } from 'react';
 import type { Analytic } from '@cccsaurora/howler-ui/models/entities/generated/Analytic';
 import type { Dossier } from '@cccsaurora/howler-ui/models/entities/generated/Dossier';
 import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
-import type { FC } from 'react';
-declare const HitLinks: FC<{
+interface HitLinksProps {
     hit?: Hit;
     analytic?: Analytic;
-    dossiers: Dossier[];
-}>;
+    dossiers?: Dossier[];
+}
+declare const HitLinks: FC<HitLinksProps>;
 export default HitLinks;

package/components/elements/hit/HitLinks.js

@@ -1,19 +1,37 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Grid, gridClasses } from '@mui/material';
+import { sortBy, uniqBy } from 'lodash-es';
+import { useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
 import HitNotebooks from '@cccsaurora/howler-ui/components/elements/hit/HitNotebooks';
+import ResolvePivotUrl from '@cccsaurora/howler-ui/components/elements/hit/ResolvePivotUrl';
 import PivotLink from '@cccsaurora/howler-ui/components/elements/hit/related/PivotLink';
 import RelatedLink from '@cccsaurora/howler-ui/components/elements/hit/related/RelatedLink';
-import { sortBy, uniqBy } from 'lodash-es';
-import { useTranslation } from 'react-i18next';
 const HitLinks = ({ hit, analytic, dossiers = [] }) => {
     const { i18n } = useTranslation();
-    return ((hit?.howler?.links?.length > 0 ||
-        analytic?.notebooks?.length > 0 ||
-        dossiers.filter(_dossier => _dossier.pivots?.length > 0).length > 0) && (_jsxs(Grid, { container: true, spacing: 1, pr: 2, sx: { [`& .${gridClasses.item}`]: { display: 'flex' } }, children: [hit?.howler?.links?.length > 0 &&
-                uniqBy(hit.howler.links, 'href')
-                    .slice(0, 3)
-                    .map(l => (_jsx(Grid, { item: true, children: _jsx(RelatedLink, { compact: true, ...l, target: "_blank", rel: "noopener noreferrer" }) }, l.href))), sortBy(dossiers.flatMap(_dossier => _dossier.pivots ?? []), `label.${i18n.language}`).map((_pivot, index) => (
-            // eslint-disable-next-line react/no-array-index-key
-            _jsx(Grid, { item: true, children: _jsx(PivotLink, { pivot: _pivot, hit: hit, compact: true }) }, _pivot.value + index))), analytic?.notebooks?.length > 0 && (_jsx(Grid, { item: true, children: _jsx(HitNotebooks, { analytic: analytic, hit: hit, compact: true }) }))] })));
+    const displayLinks = useMemo(() => uniqBy(hit?.howler?.links ?? [], 'href').slice(0, 3), [hit?.howler?.links]);
+    const displayPivots = useMemo(() => {
+        const flattened = dossiers.flatMap(dossier => (dossier.pivots ?? []).map(pivot => {
+            const pivotUrl = pivot.format === 'link' ? ResolvePivotUrl(pivot, hit) : undefined;
+            return {
+                pivot,
+                dossier,
+                resolvedUrl: pivotUrl || `/dossier/${dossier.dossier_id}`
+            };
+        }));
+        return sortBy(flattened, item => item.pivot.label?.[i18n.language]);
+    }, [dossiers, i18n.language, hit]);
+    const hasNotebooks = (analytic?.notebooks?.length ?? 0) > 0;
+    if (displayLinks.length === 0 && displayPivots.length === 0 && !hasNotebooks) {
+        return null;
+    }
+    return (_jsxs(Grid, { container: true, spacing: 1, pr: 2, sx: { [`& .${gridClasses.item}`]: { display: 'flex' } }, children: [displayLinks
+                .filter(link => !!link.href)
+                .map(link => {
+                const safeTitle = link.title ?? link.href;
+                return (_jsx(Grid, { item: true, children: _jsx(RelatedLink, { compact: true, title: safeTitle, href: link.href, target: "_blank", rel: "noopener noreferrer" }) }, link.href));
+            }), displayPivots.map(({ pivot, dossier, resolvedUrl }) => {
+                return (_jsx(Grid, { item: true, children: _jsx(PivotLink, { pivot: pivot, hit: hit, dossier: dossier, resolvedUrl: resolvedUrl, compact: true }) }, `${dossier.dossier_id}-${pivot.value}`));
+            }), hasNotebooks && (_jsx(Grid, { item: true, children: _jsx(HitNotebooks, { analytic: analytic, hit: hit, compact: true }) }))] }));
 };
 export default HitLinks;

package/components/elements/hit/HitNotebooks.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Avatar, Backdrop, Box, Button, Chip, CircularProgress, ClickAwayListener, Fade, MenuItem, Paper, Popper, Stack, TextField } from '@mui/material';
+import { Avatar, Backdrop, Box, Button, Chip, CircularProgress, ClickAwayListener, Fade, MenuItem, Paper, Popper, Stack, TextField, Tooltip } from '@mui/material';
 import api from '@cccsaurora/howler-ui/api';
 import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
 import { ModalContext } from '@cccsaurora/howler-ui/components/app/providers/ModalProvider';
+import NotebookTooltip from '@cccsaurora/howler-ui/components/elements/hit/NotebookTooltip';
 import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
 import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
 import { memo, useCallback, useContext, useEffect, useState } from 'react';
@@ -124,26 +125,26 @@ const HitNotebooks = ({ analytic, selectedNotebook, hit, compact }) => {
                                                 MenuProps: {
                                                     style: { zIndex: 35001 }
                                                 }
-                                            }, defaultValue: selectedNotebook ? analytic?.notebooks.find(n => n.name === selectedNotebook).value : '', children: [_jsx(MenuItem, { disabled: true, value: "", children: _jsx("em", { children: t('hit.notebook.select') }) }), analytic?.notebooks.sort(safeStringPropertyCompare('detection')).map(e => (_jsx(MenuItem, { value: e.value, children: _jsxs(Stack, { direction: 'row', sx: { width: '100%' }, children: [e.name, e.detection && (_jsxs(_Fragment, { children: [_jsx(Box, { flex: 1 }), _jsx(Chip, { label: e.detection, size: "small" })] }))] }) }, e.value)))] }), _jsx(Button, { variant: "outlined", disabled: loadedNotebook.name === '' || envs.length === 0, color: "success", onClick: () => checkJupyhub(), children: t('hit.notebook.goTo') })] })] }) })) }), _jsx(HowlerCard, { variant: compact ? 'outlined' : 'elevation', onClick: handleToggle, sx: [
-                        theme => ({
-                            cursor: 'pointer',
-                            backgroundColor: 'transparent',
-                            transition: theme.transitions.create(['border-color']),
-                            '&:hover': { borderColor: 'primary.main', '& a': { textDecoration: 'underline' } },
-                            '& > div': {
-                                height: '100%'
-                            },
-                            '& a': { textDecoration: 'none', color: 'text.primary' }
-                        }),
-                        !compact && { border: 'thin solid', borderColor: 'transparent' }
-                    ], children: _jsxs(Stack, { direction: "row", p: 1, spacing: 1, alignItems: "center", children: [_jsx(Avatar, { variant: "rounded", src: '/images/jupyter_notebook_file_icon.png', sx: [
-                                    theme => ({
-                                        width: theme.spacing(3),
-                                        height: theme.spacing(3),
-                                        '& img': {
-                                            objectFit: 'contain'
-                                        }
-                                    })
-                                ], children: 'jupyter_notebook_file_icon.png' }), t('hit.notebook.tooltip')] }) })] }) })));
+                                            }, defaultValue: selectedNotebook ? analytic?.notebooks.find(n => n.name === selectedNotebook).value : '', children: [_jsx(MenuItem, { disabled: true, value: "", children: _jsx("em", { children: t('hit.notebook.select') }) }), analytic?.notebooks.sort(safeStringPropertyCompare('detection')).map(e => (_jsx(MenuItem, { value: e.value, children: _jsxs(Stack, { direction: 'row', sx: { width: '100%' }, children: [e.name, e.detection && (_jsxs(_Fragment, { children: [_jsx(Box, { flex: 1 }), _jsx(Chip, { label: e.detection, size: "small" })] }))] }) }, e.value)))] }), _jsx(Button, { variant: "outlined", disabled: loadedNotebook.name === '' || envs.length === 0, color: "success", onClick: () => checkJupyhub(), children: t('hit.notebook.goTo') })] })] }) })) }), _jsx(Tooltip, { title: _jsx(NotebookTooltip, {}), children: _jsx("span", { children: _jsx(HowlerCard, { variant: compact ? 'outlined' : 'elevation', onClick: handleToggle, sx: [
+                                theme => ({
+                                    cursor: 'pointer',
+                                    backgroundColor: 'transparent',
+                                    transition: theme.transitions.create(['border-color']),
+                                    '&:hover': { borderColor: 'primary.main', '& a': { textDecoration: 'underline' } },
+                                    '& > div': {
+                                        height: '100%'
+                                    },
+                                    '& a': { textDecoration: 'none', color: 'text.primary' }
+                                }),
+                                !compact && { border: 'thin solid', borderColor: 'transparent' }
+                            ], children: _jsxs(Stack, { direction: "row", p: 1, spacing: 1, alignItems: "center", children: [_jsx(Avatar, { variant: "rounded", src: '/images/jupyter_notebook_file_icon.png', sx: [
+                                            theme => ({
+                                                width: theme.spacing(3),
+                                                height: theme.spacing(3),
+                                                '& img': {
+                                                    objectFit: 'contain'
+                                                }
+                                            })
+                                        ], children: 'jupyter_notebook_file_icon.png' }), t('hit.notebook.tooltip')] }) }) }) })] }) })));
 };
 export default memo(HitNotebooks);

package/components/elements/hit/NotebookTooltip.d.ts

@@ -0,0 +1,3 @@
+import type { FC } from 'react';
+declare const NotebookTooltip: FC;
+export default NotebookTooltip;

package/components/elements/hit/NotebookTooltip.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Typography } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+const NotebookTooltip = () => {
+    const { t } = useTranslation();
+    return (_jsxs(Box, { sx: { maxWidth: 300 }, children: [_jsx(Typography, { variant: "subtitle2", children: t('notebook.title') }), _jsx(Typography, { variant: "body2", color: "text.secondary", children: t('notebook.opens.panel') })] }));
+};
+export default NotebookTooltip;

package/components/elements/hit/PivotTooltip.d.ts

@@ -0,0 +1,7 @@
+import type { Dossier } from '@cccsaurora/howler-ui/models/entities/generated/Dossier';
+import type { FC } from 'react';
+declare const PivotTooltip: FC<{
+    dossier: Dossier;
+    resolvedUrl: string;
+}>;
+export default PivotTooltip;

package/components/elements/hit/PivotTooltip.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Link, Typography } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+const PivotTooltip = ({ dossier, resolvedUrl }) => {
+    const dossierUrl = `/dossiers/${dossier.dossier_id}/edit?tab=leads&query=${encodeURIComponent(dossier.query)}`;
+    const { t } = useTranslation();
+    return (_jsxs(Box, { sx: { maxWidth: 300 }, children: [_jsx(Typography, { variant: "subtitle2", children: dossier.title }), _jsx(Typography, { variant: "body2", color: "text.secondary", children: dossier.owner }), _jsx(Typography, { variant: "body2", sx: { mt: 2 }, children: dossier.leads?.[0]?.content?.slice(0, 120) ?? t('pivot.description.none') }), _jsxs(Box, { sx: { mt: 2, wordBreak: 'break-all' }, children: [_jsx(Typography, { variant: "caption", display: "block", children: t('pivot.url') }), _jsx(Link, { href: resolvedUrl, target: "_blank", rel: "noopener noreferrer", underline: "hover", children: resolvedUrl })] }), _jsx(Box, { sx: { mt: 2 }, children: _jsx(Link, { href: dossierUrl, target: "_blank", rel: "noopener noreferrer", underline: "hover", children: t('pivot.dossier.open') }) })] }));
+};
+export default PivotTooltip;

package/components/elements/hit/RelatedLinkTooltip.d.ts

@@ -0,0 +1,6 @@
+import type { FC } from 'react';
+declare const RelatedLinkTooltip: FC<{
+    title: string;
+    href: string;
+}>;
+export default RelatedLinkTooltip;

package/components/elements/hit/RelatedLinkTooltip.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Link, Typography } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+const RelatedLinkTooltip = ({ title, href }) => {
+    const { t } = useTranslation();
+    return (_jsxs(Box, { sx: { maxWidth: 300 }, children: [_jsx(Typography, { variant: "subtitle2", children: title }), _jsx(Box, { sx: { mt: 1, wordBreak: 'break-all' }, children: _jsx(Link, { href: href, target: "_blank", rel: "noopener noreferrer", underline: "hover", children: href }) }), _jsx(Box, { sx: { mt: 2 }, children: _jsx(Link, { href: href, target: "_blank", rel: "noopener noreferrer", underline: "hover", children: t('hit.header.link') }) })] }));
+};
+export default RelatedLinkTooltip;

package/components/elements/hit/ResolvePivotUrl.d.ts

@@ -0,0 +1,4 @@
+import type { Dossier } from '@cccsaurora/howler-ui/models/entities/generated/Dossier';
+import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
+declare const resolvePivotUrl: (pivot: NonNullable<Dossier["pivots"]>[number], currentHit?: Hit) => string;
+export default resolvePivotUrl;

package/components/elements/hit/ResolvePivotUrl.js

@@ -0,0 +1,22 @@
+import Handlebars from 'handlebars';
+import { flattenDeep } from '@cccsaurora/howler-ui/utils/utils';
+const resolvePivotUrl = (pivot, currentHit) => {
+    const flatHit = flattenDeep(currentHit ?? {});
+    const templateObject = Object.fromEntries((pivot.mappings ?? []).map(mapping => {
+        const value = mapping.field === 'custom'
+            ? mapping.custom_value
+            : Array.isArray(flatHit[mapping.field])
+                ? flatHit[mapping.field][0]
+                : flatHit[mapping.field];
+        return [mapping.key, value];
+    }));
+    try {
+        return Handlebars.compile(pivot.value)(templateObject);
+    }
+    catch (e) {
+        // eslint-disable-next-line no-console
+        console.error(`Failed to compile pivot template for value "${pivot.value}":`, e);
+        return pivot.value;
+    }
+};
+export default resolvePivotUrl;

package/components/{routes/hits/search → elements/hit}/grid/ColumnHeader.d.ts

@@ -1,7 +1,8 @@
 import { type FC, type SetStateAction } from 'react';
 declare const ColumnHeader: FC<{
-    width: string;
+    width: number;
     col: string;
+    colSource?: string[];
     setColumns: (val: SetStateAction<string[]>) => void;
     onMouseDown: (col: string, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
 }>;

package/components/{routes/hits/search → elements/hit}/grid/ColumnHeader.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
-import { DragIndicator, Remove } from '@mui/icons-material';
+import { DragIndicator, JoinFull, Remove } from '@mui/icons-material';
 import { Box, IconButton, Stack, TableCell, Tooltip, useTheme } from '@mui/material';
 import { ApiConfigContext } from '@cccsaurora/howler-ui/components/app/providers/ApiConfigProvider';
 import FlexOne from '@cccsaurora/howler-ui/components/elements/addons/layout/FlexOne';
 import { useContext } from 'react';
-const ColumnHeader = ({ col, width, setColumns, onMouseDown }) => {
+const ColumnHeader = ({ col, width, colSource, setColumns, onMouseDown }) => {
     const theme = useTheme();
     const { config } = useContext(ApiConfigContext);
     const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: col });
@@ -15,7 +15,7 @@ const ColumnHeader = ({ col, width, setColumns, onMouseDown }) => {
             borderRightColor: 'divider',
             py: 0.5,
             position: 'relative'
-        }, style: { transform: CSS.Translate.toString(transform), transition }, children: _jsxs(Stack, { className: `col-${col.replaceAll('.', '-')}`, direction: "row", spacing: 1, alignItems: "center", sx: [{ minWidth: '220px' }, !!width ? { width, maxWidth: width } : { maxWidth: '300px' }], children: [_jsx(Tooltip, { title: config.indexes.hit[col].description, children: _jsx("span", { children: col }) }), _jsx(FlexOne, {}), _jsx(IconButton, { size: "small", sx: { fontSize: '1rem' }, onClick: () => setColumns(_columns => _columns.filter(_col => _col !== col)), children: _jsx(Remove, { fontSize: "inherit" }) }), _jsx(DragIndicator, { fontSize: "small", sx: { cursor: 'grab' }, ...attributes, ...listeners }), _jsx(Box, { sx: {
+        }, style: { transform: CSS.Translate.toString(transform), transition }, children: _jsxs(Stack, { className: `col-${col.replaceAll('.', '-')}`, direction: "row", spacing: 1, alignItems: "center", sx: [{ minWidth: '220px' }, !!width ? { width, maxWidth: width } : { maxWidth: '300px' }], children: [_jsx(Tooltip, { title: config.indexes.hit[col].description, children: _jsx("span", { children: col }) }), colSource?.length > 1 && (_jsx(Tooltip, { title: colSource.join(', '), children: _jsx(JoinFull, { fontSize: "small" }) })), _jsx(FlexOne, {}), _jsx(IconButton, { size: "small", sx: { fontSize: '1rem' }, onClick: () => setColumns(_columns => _columns.filter(_col => _col !== col)), children: _jsx(Remove, { fontSize: "inherit" }) }), _jsx(DragIndicator, { fontSize: "small", sx: { cursor: 'grab' }, ...attributes, ...listeners }), _jsx(Box, { sx: {
                         position: 'absolute',
                         top: theme.spacing(0.75),
                         bottom: theme.spacing(0.75),

package/components/{routes/hits/search → elements/hit}/grid/RecordRow.d.ts

@@ -4,7 +4,7 @@ declare const _default: import("react").NamedExoticComponent<{
     record: Hit | Event;
     analyticIds: Record<string, string>;
     columns: string[];
-    columnWidths: Record<string, string>;
+    columnWidths: Record<string, number>;
     collapseMainColumn: boolean;
     onClick: (e: React.MouseEvent<HTMLDivElement>, record: Hit | Event) => void;
 }>;

package/components/elements/hit/grid/RecordTable.d.ts

@@ -0,0 +1,13 @@
+import type { Event } from '@cccsaurora/howler-ui/models/entities/generated/Event';
+import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
+import type { WithMetadata } from '@cccsaurora/howler-ui/models/WithMetadata';
+import React, { type PropsWithChildren } from 'react';
+declare const RecordTable: ({ query, items, refreshItems, ContextMenu, contextMenuProps, onItemClick }: {
+    query: string;
+    items?: WithMetadata<Hit | Event>[];
+    refreshItems?: (query: string, append?: boolean) => void;
+    ContextMenu?: React.FC<PropsWithChildren<object>>;
+    contextMenuProps?: object;
+    onItemClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>, record: Hit | Event) => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export default RecordTable;