@cccsaurora/howler-ui 2.14.0-dev.269 → 2.14.0-dev.272

package/components/app/drawers/AssignUserDrawer.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PersonOff } from '@mui/icons-material';
+import { Autocomplete, Avatar, Box, Button, CircularProgress, Stack, TextField, Typography } from '@mui/material';
+import api from '@cccsaurora/howler-ui/api';
+import HowlerAvatar from '@cccsaurora/howler-ui/components/elements/display/HowlerAvatar';
+import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
+import useMySnackbar from '@cccsaurora/howler-ui/components/hooks/useMySnackbar';
+import useMyUserList from '@cccsaurora/howler-ui/components/hooks/useMyUserList';
+import { useCallback, useMemo, useState } from 'react';
+import { Trans, useTranslation } from 'react-i18next';
+const AssignUserDrawer = ({ assignment, ids, onAssigned, skipSubmit = false }) => {
+    const { dispatchApi } = useMyApi();
+    const { showInfoMessage } = useMySnackbar();
+    const { t } = useTranslation();
+    const userIds = useMemo(() => new Set(['*']), []);
+    const users = useMyUserList(userIds);
+    const [assignedUserId, setAssignedUserId] = useState(assignment === 'unassigned' ? null : assignment);
+    const [loading, setLoading] = useState(false);
+    const onSubmit = useCallback(async () => {
+        if (!skipSubmit) {
+            setLoading(true);
+            try {
+                await Promise.all(ids.map(id => dispatchApi(api.hit.assign.put(id, { value: assignedUserId !== 'unassigned' ? assignedUserId : null }))));
+                showInfoMessage(t('app.drawer.hit.assignment.success'));
+            }
+            finally {
+                setLoading(false);
+            }
+        }
+        onAssigned(assignedUserId);
+    }, [assignedUserId, dispatchApi, ids, onAssigned, showInfoMessage, skipSubmit, t]);
+    return (_jsxs(Stack, { direction: "column", spacing: 2, sx: { mt: 2 }, children: [_jsx(Typography, { sx: { maxWidth: '500px' }, children: _jsx(Trans, { i18nKey: "app.drawer.hit.assignment.description" }) }), _jsx(Autocomplete, { disabled: Object.keys(users).length < 1, autoComplete: true, options: [
+                    ...Object.values(users),
+                    {
+                        email: t('app.drawer.hit.assignment.unassigned.email'),
+                        name: t('app.drawer.hit.assignment.unassigned.name'),
+                        username: 'unassigned'
+                    }
+                ], filterOptions: (_users, { inputValue }) => _users.filter(u => u.email.toLowerCase().includes(inputValue.toLowerCase()) ||
+                    u.name.toLowerCase().includes(inputValue.toLowerCase())), onKeyDown: e => e.stopPropagation(), getOptionLabel: (u) => u.name, isOptionEqualToValue: (u, u2) => u.username === u2.username, renderOption: (props, u) => {
+                    return (_jsx("li", { ...props, children: _jsxs(Box, { sx: {
+                                display: 'grid',
+                                gridTemplateColumns: 'auto 1fr',
+                                gridTemplateRows: 'auto auto',
+                                gridTemplateAreas: `"profile name"\n"profile email"`,
+                                columnGap: 1.5
+                            }, children: [u.username !== 'unassigned' ? (_jsx(HowlerAvatar, { sx: { gridArea: 'profile', alignSelf: 'center', height: '32px', width: '32px' }, userId: u.username })) : (_jsx(Avatar, { sx: { gridArea: 'profile', alignSelf: 'center', height: '32px', width: '32px' }, children: _jsx(PersonOff, {}) })), _jsx(Typography, { sx: { gridArea: 'name' }, variant: "body1", children: u.name }), _jsx(Typography, { sx: { gridArea: 'email' }, variant: "caption", children: u.email })] }) }, u.email));
+                }, renderInput: params => (_jsx(TextField, { ...params, label: _jsx(Trans, { i18nKey: "app.drawer.hit.assignment.autocomplete.label" }) })), value: users[assignedUserId] ?? null, onChange: (_, value) => setAssignedUserId(value?.username) }), _jsxs(Button, { disabled: !assignedUserId || assignedUserId === assignment || loading, variant: "contained", sx: { alignSelf: 'end' }, onClick: onSubmit, children: [loading && _jsx(CircularProgress, { size: "24px", sx: { mr: 1 } }), _jsx(Trans, { i18nKey: "button.save" })] })] }));
+};
+export default AssignUserDrawer;

package/components/app/drawers/ViewGroupsDrawer.d.ts

@@ -0,0 +1,7 @@
+import type { GroupDetailsResponse } from '@cccsaurora/howler-ui/api/user/groups';
+import type { FC } from 'react';
+type ViewGroupsDrawerProps = {
+    groups: GroupDetailsResponse;
+};
+declare const ViewGroupsDrawer: FC<ViewGroupsDrawerProps>;
+export default ViewGroupsDrawer;

package/components/app/drawers/ViewGroupsDrawer.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Divider, Stack, Typography } from '@mui/material';
+const ViewGroupsDrawer = ({ groups }) => {
+    return (_jsx(Stack, { direction: "column", spacing: 1, sx: { mt: 2 }, divider: _jsx(Divider, { orientation: "horizontal" }), children: groups.map(g => (_jsxs(Box, { children: [_jsx(Typography, { variant: "body1", children: g.name }), _jsx(Typography, { variant: "caption", color: "text.disabled", children: g.id })] }, g.id))) }));
+};
+export default ViewGroupsDrawer;

package/components/app/hooks/useMatchers.d.ts

@@ -0,0 +1,9 @@
+import type { Hit } from '@cccsaurora/howler-ui/models/entities/generated/Hit';
+import type { WithMetadata } from '@cccsaurora/howler-ui/models/WithMetadata';
+declare const useMatchers: () => {
+    getMatchingDossiers: (hit: WithMetadata<Hit>) => Promise<import("../../../models/entities/generated/Dossier").Dossier[]>;
+    getMatchingOverview: (hit: WithMetadata<Hit>) => Promise<import("../../../models/entities/generated/Overview").Overview>;
+    getMatchingTemplate: (hit: WithMetadata<Hit>) => Promise<import("../../../models/entities/generated/Template").Template>;
+    getMatchingAnalytic: (hit: WithMetadata<Hit>) => Promise<import("../../../models/entities/generated/Analytic").Analytic>;
+};
+export default useMatchers;

package/components/app/hooks/useMatchers.js

@@ -0,0 +1,82 @@
+/* eslint-disable no-console */
+import { has } from 'lodash-es';
+import { useCallback } from 'react';
+import { useContextSelector } from 'use-context-selector';
+import { HitContext } from '../providers/HitProvider';
+const useMatchers = () => {
+    const getHit = useContextSelector(HitContext, ctx => ctx.getHit);
+    const getMatchingTemplate = useCallback(async (hit) => {
+        if (!hit) {
+            return null;
+        }
+        if (has(hit, '__template')) {
+            return hit.__template;
+        }
+        // This is a fallback in case metadata is not included. In most cases templates are shown, the template metadata
+        // should also exist
+        try {
+            return (await getHit(hit.howler.id, true)).__template;
+        }
+        catch (e) {
+            console.warn(e);
+            return null;
+        }
+    }, [getHit]);
+    const getMatchingOverview = useCallback(async (hit) => {
+        if (!hit) {
+            return null;
+        }
+        if (has(hit, '__overview')) {
+            return hit.__overview;
+        }
+        // This is a fallback in case metadata is not included. In most cases templates are shown, the template metadata
+        // should also exist
+        try {
+            return (await getHit(hit.howler.id, true)).__overview;
+        }
+        catch (e) {
+            console.warn(e);
+            return null;
+        }
+    }, [getHit]);
+    const getMatchingDossiers = useCallback(async (hit) => {
+        if (!hit) {
+            return null;
+        }
+        if (has(hit, '__dossiers')) {
+            return hit.__dossiers;
+        }
+        // This is a fallback in case metadata is not included. In most cases templates are shown, the template metadata
+        // should also exist
+        try {
+            return (await getHit(hit.howler.id, true)).__dossiers ?? [];
+        }
+        catch (e) {
+            console.warn(e);
+            return [];
+        }
+    }, [getHit]);
+    const getMatchingAnalytic = useCallback(async (hit) => {
+        if (!hit) {
+            return null;
+        }
+        if (has(hit, '__analytic')) {
+            return hit.__analytic;
+        }
+        // This is a fallback in case metadata is not included.
+        try {
+            return (await getHit(hit.howler.id, true)).__analytic;
+        }
+        catch (e) {
+            console.warn(e);
+            return null;
+        }
+    }, [getHit]);
+    return {
+        getMatchingDossiers,
+        getMatchingOverview,
+        getMatchingTemplate,
+        getMatchingAnalytic
+    };
+};
+export default useMatchers;

package/components/app/hooks/useMatchers.test.d.ts

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

package/components/app/hooks/useMatchers.test.js

@@ -0,0 +1,237 @@
+import { renderHook } from '@testing-library/react';
+import { useContextSelector } from 'use-context-selector';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { HitContext } from '../providers/HitProvider';
+import useMatchers from './useMatchers';
+// Mock the useContextSelector hook
+vi.mock('use-context-selector', () => ({
+    useContextSelector: vi.fn(),
+    createContext: vi.fn()
+}));
+// Mock lodash-es has function
+vi.mock('lodash-es', () => ({
+    has: vi.fn()
+}));
+// Create mock data
+const mockTemplate = {
+    name: 'test-template',
+    template: 'Test template content'
+};
+const mockOverview = {
+    name: 'test-overview',
+    overview: 'Test overview content'
+};
+const mockDossiers = [
+    {
+        name: 'test-dossier',
+        description: 'Test dossier content'
+    }
+];
+const mockHit = {
+    howler: {
+        id: 'test-hit-id',
+        analytic: 'test-analytic',
+        data: {}
+    }
+};
+const mockHitWithMetadata = {
+    ...mockHit,
+    __template: mockTemplate,
+    __overview: mockOverview,
+    __dossiers: mockDossiers
+};
+const mockGetHit = vi.fn();
+describe('useMatchers', () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+        // Mock useContextSelector to return our mock getHit function
+        useContextSelector.mockImplementation((context, selector) => {
+            if (context === HitContext) {
+                return selector({ getHit: mockGetHit });
+            }
+            return null;
+        });
+    });
+    describe('getMatchingTemplate', () => {
+        it('should return null when hit is null', async () => {
+            const { result } = renderHook(() => useMatchers());
+            const template = await result.current.getMatchingTemplate(null);
+            expect(template).toBeNull();
+        });
+        it('should return null when hit is undefined', async () => {
+            const { result } = renderHook(() => useMatchers());
+            const template = await result.current.getMatchingTemplate(undefined);
+            expect(template).toBeNull();
+        });
+        it('should return template from metadata when it exists', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(true);
+            const { result } = renderHook(() => useMatchers());
+            const template = await result.current.getMatchingTemplate(mockHitWithMetadata);
+            expect(template).toBe(mockTemplate);
+            expect(mockGetHit).not.toHaveBeenCalled();
+        });
+        it('should fetch hit with metadata when template is not present', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(false);
+            const hitWithFetchedMetadata = { ...mockHit, __template: mockTemplate };
+            mockGetHit.mockResolvedValue(hitWithFetchedMetadata);
+            const { result } = renderHook(() => useMatchers());
+            const template = await result.current.getMatchingTemplate(mockHit);
+            expect(template).toBe(mockTemplate);
+            expect(mockGetHit).toHaveBeenCalledWith('test-hit-id', true);
+        });
+        it('should handle getHit rejection gracefully', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(false);
+            mockGetHit.mockRejectedValue(new Error('Failed to fetch hit'));
+            const { result } = renderHook(() => useMatchers());
+            await expect(result.current.getMatchingTemplate(mockHit)).resolves.toBeNull();
+            expect(mockGetHit).toHaveBeenCalledWith('test-hit-id', true);
+        });
+    });
+    describe('getMatchingOverview', () => {
+        it('should return null when hit is null', async () => {
+            const { result } = renderHook(() => useMatchers());
+            const overview = await result.current.getMatchingOverview(null);
+            expect(overview).toBeNull();
+        });
+        it('should return null when hit is undefined', async () => {
+            const { result } = renderHook(() => useMatchers());
+            const overview = await result.current.getMatchingOverview(undefined);
+            expect(overview).toBeNull();
+        });
+        it('should return overview from metadata when it exists', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(true);
+            const { result } = renderHook(() => useMatchers());
+            const overview = await result.current.getMatchingOverview(mockHitWithMetadata);
+            expect(overview).toBe(mockOverview);
+            expect(mockGetHit).not.toHaveBeenCalled();
+        });
+        it('should fetch hit with metadata when overview is not present', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(false);
+            const hitWithFetchedMetadata = { ...mockHit, __overview: mockOverview };
+            mockGetHit.mockResolvedValue(hitWithFetchedMetadata);
+            const { result } = renderHook(() => useMatchers());
+            const overview = await result.current.getMatchingOverview(mockHit);
+            expect(overview).toBe(mockOverview);
+            expect(mockGetHit).toHaveBeenCalledWith('test-hit-id', true);
+        });
+        it('should handle getHit rejection gracefully', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(false);
+            mockGetHit.mockRejectedValue(new Error('Failed to fetch hit'));
+            const { result } = renderHook(() => useMatchers());
+            await expect(result.current.getMatchingOverview(mockHit)).resolves.toBeNull();
+            expect(mockGetHit).toHaveBeenCalledWith('test-hit-id', true);
+        });
+    });
+    describe('getMatchingDossiers', () => {
+        it('should return null when hit is null', async () => {
+            const { result } = renderHook(() => useMatchers());
+            const dossiers = await result.current.getMatchingDossiers(null);
+            expect(dossiers).toBeNull();
+        });
+        it('should return null when hit is undefined', async () => {
+            const { result } = renderHook(() => useMatchers());
+            const dossiers = await result.current.getMatchingDossiers(undefined);
+            expect(dossiers).toBeNull();
+        });
+        it('should return dossiers from metadata when they exist', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(true);
+            const { result } = renderHook(() => useMatchers());
+            const dossiers = await result.current.getMatchingDossiers(mockHitWithMetadata);
+            expect(dossiers).toBe(mockDossiers);
+            expect(mockGetHit).not.toHaveBeenCalled();
+        });
+        it('should fetch hit with metadata when dossiers are not present', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(false);
+            const hitWithFetchedMetadata = { ...mockHit, __dossiers: mockDossiers };
+            mockGetHit.mockResolvedValue(hitWithFetchedMetadata);
+            const { result } = renderHook(() => useMatchers());
+            const dossiers = await result.current.getMatchingDossiers(mockHit);
+            expect(dossiers).toBe(mockDossiers);
+            expect(mockGetHit).toHaveBeenCalledWith('test-hit-id', true);
+        });
+        it('should handle getHit rejection gracefully', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(false);
+            mockGetHit.mockRejectedValue(new Error('Failed to fetch hit'));
+            const { result } = renderHook(() => useMatchers());
+            await expect(result.current.getMatchingDossiers(mockHit)).resolves.toEqual([]);
+            expect(mockGetHit).toHaveBeenCalledWith('test-hit-id', true);
+        });
+    });
+    describe('integration tests', () => {
+        it('should correctly handle has function calls for different metadata properties', async () => {
+            const { has } = await import('lodash-es');
+            // Mock has to return true for __template, false for others
+            has.mockImplementation((_obj, prop) => {
+                return prop === '__template';
+            });
+            const hitWithPartialMetadata = {
+                ...mockHit,
+                __template: mockTemplate
+            };
+            mockGetHit.mockResolvedValue({
+                ...mockHit,
+                __overview: mockOverview,
+                __dossiers: mockDossiers
+            });
+            const { result } = renderHook(() => useMatchers());
+            // Should return template from metadata
+            const template = await result.current.getMatchingTemplate(hitWithPartialMetadata);
+            expect(template).toBe(mockTemplate);
+            // Should fetch overview
+            const overview = await result.current.getMatchingOverview(hitWithPartialMetadata);
+            expect(overview).toBe(mockOverview);
+            // Should fetch dossiers
+            const dossiers = await result.current.getMatchingDossiers(hitWithPartialMetadata);
+            expect(dossiers).toBe(mockDossiers);
+            // Verify has was called with correct parameters
+            expect(has).toHaveBeenCalledWith(hitWithPartialMetadata, '__template');
+            expect(has).toHaveBeenCalledWith(hitWithPartialMetadata, '__overview');
+            expect(has).toHaveBeenCalledWith(hitWithPartialMetadata, '__dossiers');
+        });
+        it('should handle empty or undefined metadata gracefully', async () => {
+            const { has } = await import('lodash-es');
+            has.mockReturnValue(false);
+            mockGetHit.mockResolvedValue({
+                ...mockHit,
+                __template: undefined,
+                __overview: null,
+                __dossiers: []
+            });
+            const { result } = renderHook(() => useMatchers());
+            const template = await result.current.getMatchingTemplate(mockHit);
+            const overview = await result.current.getMatchingOverview(mockHit);
+            const dossiers = await result.current.getMatchingDossiers(mockHit);
+            expect(template).toBeUndefined();
+            expect(overview).toBeNull();
+            expect(dossiers).toEqual([]);
+            expect(mockGetHit).toHaveBeenCalledTimes(3);
+        });
+        it('should maintain referential equality of returned functions', () => {
+            const { result, rerender } = renderHook(() => useMatchers());
+            const firstRender = {
+                getMatchingTemplate: result.current.getMatchingTemplate,
+                getMatchingOverview: result.current.getMatchingOverview,
+                getMatchingDossiers: result.current.getMatchingDossiers
+            };
+            rerender();
+            const secondRender = {
+                getMatchingTemplate: result.current.getMatchingTemplate,
+                getMatchingOverview: result.current.getMatchingOverview,
+                getMatchingDossiers: result.current.getMatchingDossiers
+            };
+            // Functions should be the same reference due to useCallback
+            expect(firstRender.getMatchingTemplate).toBe(secondRender.getMatchingTemplate);
+            expect(firstRender.getMatchingOverview).toBe(secondRender.getMatchingOverview);
+            expect(firstRender.getMatchingDossiers).toBe(secondRender.getMatchingDossiers);
+        });
+    });
+});

package/components/app/hooks/useTitle.d.ts

@@ -0,0 +1,2 @@
+declare const useTitle: () => void;
+export default useTitle;

package/components/app/hooks/useTitle.js

@@ -0,0 +1,68 @@
+import useMySitemap from '@cccsaurora/howler-ui/components/hooks/useMySitemap';
+import { capitalize } from 'lodash-es';
+import { useCallback, useContext, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useLocation, useParams, useSearchParams } from 'react-router-dom';
+import { useContextSelector } from 'use-context-selector';
+import { AnalyticContext } from '../providers/AnalyticProvider';
+import { HitContext } from '../providers/HitProvider';
+const useTitle = () => {
+    const { t } = useTranslation();
+    const location = useLocation();
+    const params = useParams();
+    const searchParams = useSearchParams()[0];
+    const sitemap = useMySitemap();
+    const { getAnalyticFromId } = useContext(AnalyticContext);
+    const hits = useContextSelector(HitContext, ctx => ctx.hits);
+    const setTitle = useCallback((title) => {
+        document.querySelector('title').innerHTML = title;
+    }, []);
+    const runChecks = useCallback(async () => {
+        const searchType = location.pathname.replace(/^\/(\w+)(\/.+)?$/, '$1').replace(/s$/, '');
+        if (searchType === 'analytic') {
+            if (params.id) {
+                const analytic = await getAnalyticFromId(params.id);
+                if (analytic) {
+                    setTitle(`${t('route.analytics.view')} - ${analytic.name}`);
+                }
+                else {
+                    setTitle(`${t('route.analytics.view')}`);
+                }
+            }
+            else {
+                setTitle(`Howler - ${t('route.analytics')}`);
+            }
+        }
+        else if (searchType === 'hit' && params.id) {
+            const hit = hits[params.id];
+            let newTitle = `${capitalize(hit.howler.escalation)} - ${hit.howler.analytic}`;
+            if (hit.howler.detection) {
+                newTitle += `: ${hit.howler.detection}`;
+            }
+            setTitle(newTitle);
+        }
+        else if (searchType === 'template' && location.pathname.endsWith('view') && searchParams.has('analytic')) {
+            let title = t('route.templates.view');
+            if (searchParams.has('analytic')) {
+                title += ` - ${searchParams.get('analytic')}`;
+            }
+            else if (!searchParams.has('detection')) {
+                title = `Howler - ${title}`;
+            }
+            if (searchParams.has('detection')) {
+                title += `: ${searchParams.get('detection')}`;
+            }
+            setTitle(title);
+        }
+        else {
+            const matchingRoute = sitemap.routes.find(_route => _route.path === location.pathname);
+            if (matchingRoute) {
+                setTitle(`Howler - ${t(matchingRoute.title)}`);
+            }
+        }
+    }, [getAnalyticFromId, location.pathname, params.id, searchParams, hits, setTitle, sitemap.routes, t]);
+    useEffect(() => {
+        runChecks();
+    }, [runChecks]);
+};
+export default useTitle;

package/components/app/providers/AnalyticProvider.d.ts

@@ -0,0 +1,10 @@
+import type { Analytic } from '@cccsaurora/howler-ui/models/entities/generated/Analytic';
+import { type FC, type PropsWithChildren } from 'react';
+interface AnalyticContextType {
+    ready: boolean;
+    analytics: Analytic[];
+    getAnalyticFromId: (id: string) => Promise<Analytic>;
+}
+export declare const AnalyticContext: import("react").Context<AnalyticContextType>;
+declare const AnalyticProvider: FC<PropsWithChildren>;
+export default AnalyticProvider;

package/components/app/providers/AnalyticProvider.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import api from '@cccsaurora/howler-ui/api';
+import { useAppUser } from '@cccsaurora/howler-ui/commons/components/app/hooks';
+import { createContext, useCallback, useEffect, useState } from 'react';
+export const AnalyticContext = createContext(null);
+/**
+ * A set of promises for each analytic search. This is to stop several identical
+ * requests from going due to issues with react state updates not happening fast enough
+ */
+const PROMISES = {};
+const AnalyticProvider = ({ children }) => {
+    const appUser = useAppUser();
+    const [fetching, setFetching] = useState(false);
+    const [ready, setReady] = useState(false);
+    const [analytics, setAnalytics] = useState([]);
+    const fetchAnalytics = useCallback(async () => {
+        if (ready || fetching) {
+            return;
+        }
+        try {
+            setFetching(true);
+            setAnalytics(((await api.analytic.get()) ?? []));
+            setReady(true);
+        }
+        finally {
+            setFetching(false);
+        }
+    }, [ready, fetching]);
+    useEffect(() => {
+        if (!ready && appUser.isReady()) {
+            fetchAnalytics();
+        }
+    }, [ready, appUser, fetchAnalytics]);
+    const getAnalyticFromId = useCallback(async (id) => {
+        const candidate = analytics?.find(_analytic => _analytic.analytic_id === id);
+        if (candidate) {
+            return candidate;
+        }
+        // We check to see if there's already a request in progress
+        if (!PROMISES[id]) {
+            PROMISES[id] = api.search.analytic.post({
+                query: `analytic_id:${id}`
+            });
+        }
+        try {
+            const result = await PROMISES[id];
+            const analytic = result.items?.[0];
+            if (analytic) {
+                setAnalytics([...(analytics ?? []), analytic]);
+                return analytic;
+            }
+        }
+        catch (e) {
+            // eslint-disable-next-line no-console
+            console.error(e);
+        }
+        return null;
+    }, [analytics]);
+    return (_jsx(AnalyticContext.Provider, { value: { analytics, ready, getAnalyticFromId }, children: children }));
+};
+export default AnalyticProvider;

package/components/app/providers/ApiConfigProvider.d.ts

@@ -0,0 +1,9 @@
+import type { ApiType } from '@cccsaurora/howler-ui/models/entities/generated/ApiType';
+import type { FC, PropsWithChildren } from 'react';
+export type ApiConfigContextType = {
+    config: ApiType;
+    setConfig: (config: ApiType) => void;
+};
+export declare const ApiConfigContext: import("react").Context<ApiConfigContextType>;
+declare const ApiConfigProvider: FC<PropsWithChildren>;
+export default ApiConfigProvider;

package/components/app/providers/ApiConfigProvider.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useMemo, useState } from 'react';
+export const ApiConfigContext = createContext(null);
+const ApiConfigProvider = ({ children }) => {
+    const [config, setConfig] = useState({
+        indexes: null,
+        lookups: null,
+        configuration: null,
+        c12nDef: null,
+        mapping: null
+    });
+    const context = useMemo(() => ({
+        config,
+        setConfig
+    }), [config, setConfig]);
+    return _jsx(ApiConfigContext.Provider, { value: context, children: children });
+};
+export default ApiConfigProvider;

package/components/app/providers/AppDrawerProvider.d.ts

@@ -0,0 +1,10 @@
+import type { FC, PropsWithChildren } from 'react';
+import type { AppDrawerProps } from '../drawers/AppDrawerType';
+export type AppDrawerContextState = {
+    close: () => void;
+    open: (props: AppDrawerProps) => void;
+    props: AppDrawerProps;
+};
+export declare const AppDrawerContext: import("react").Context<AppDrawerContextState>;
+declare const AppDrawerProvider: FC<PropsWithChildren>;
+export default AppDrawerProvider;

package/components/app/providers/AppDrawerProvider.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Drawer, Typography } from '@mui/material';
+import PageContent from '@cccsaurora/howler-ui/commons/components/pages/PageContent';
+import { createContext, useCallback, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+const APPDRAWER_INIT_STATE = {
+    props: { titleKey: null, children: null, onClosed: () => null },
+    close: () => null,
+    open: () => null
+};
+export const AppDrawerContext = createContext(APPDRAWER_INIT_STATE);
+const AppDrawerProvider = ({ children }) => {
+    const { t } = useTranslation();
+    const [isOpen, setOpen] = useState(false);
+    const [props, setProps] = useState(APPDRAWER_INIT_STATE.props);
+    const close = useCallback(() => {
+        setOpen(false);
+        if (props.onClosed) {
+            props.onClosed();
+        }
+    }, [props]);
+    const open = useCallback((_props) => {
+        setOpen(true);
+        setProps(_props);
+    }, []);
+    const context = useMemo(() => ({ props, open, close }), [props, open, close]);
+    return (_jsxs(AppDrawerContext.Provider, { value: context, children: [children, _jsx(Drawer, { anchor: "right", open: isOpen, PaperProps: { sx: { minWidth: 500 } }, onClose: close, children: _jsxs(PageContent, { children: [_jsx(Typography, { variant: "h4", children: t(props.titleKey) }), props.children] }) })] }));
+};
+export default AppDrawerProvider;

package/components/app/providers/AvatarProvider.d.ts

@@ -0,0 +1,7 @@
+import type { FC, PropsWithChildren } from 'react';
+interface AvatarContextType {
+    getAvatar: (id: string) => Promise<string>;
+}
+export declare const AvatarContext: import("react").Context<AvatarContextType>;
+declare const AvatarProvider: FC<PropsWithChildren>;
+export default AvatarProvider;

package/components/app/providers/AvatarProvider.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import api from '@cccsaurora/howler-ui/api';
+import useMyApi from '@cccsaurora/howler-ui/components/hooks/useMyApi';
+import { createContext, useCallback } from 'react';
+export const AvatarContext = createContext(null);
+/**
+ * Because of the nature of requesting avatars, there's often LOTS of requests firing off in rapid succession,
+ * too quickly for React to react (pardon the pun). To circumvent this, we just use a global object to remove race conditions.
+ */
+const promises = {};
+const AvatarProvider = ({ children }) => {
+    const { dispatchApi } = useMyApi();
+    const getAvatar = useCallback((id) => {
+        if (!id) {
+            return Promise.resolve('');
+        }
+        if (promises[id]) {
+            return promises[id];
+        }
+        try {
+            promises[id] = dispatchApi(api.user.avatar.get(id), { logError: false, showError: false, throwError: false });
+            return promises[id];
+        }
+        catch (e) {
+            promises[id] = api.user.get(id).then(user => user.name);
+            return promises[id];
+        }
+    }, [dispatchApi]);
+    return _jsx(AvatarContext.Provider, { value: { getAvatar }, children: children });
+};
+export default AvatarProvider;