@cccsaurora/howler-ui 3.1.0-dev.1627 → 3.1.0-dev.1632

package/components/routes/analytics/widgets/Escalation.js

@@ -11,7 +11,7 @@ const Escalation = forwardRef(({ analytic, maxWidth = '45%' }, ref) => {
     const { doughnut } = useMyChart();
     const [loading, setLoading] = useState(false);
     const [escalationData, setEscalationData] = useState({});
-    const escalationColors = useMemo(() => Object.keys(escalationData).map(escalation => getEscalationColor(escalation, 'rgba(255, 255, 255, 0.16)', theme)), [theme]);
+    const escalationColors = useMemo(() => Object.keys(escalationData).map(escalation => getEscalationColor(escalation, 'rgba(255, 255, 255, 0.16)', theme)), [escalationData, theme]);
     useEffect(() => {
         if (!analytic) {
             return;

package/package.json

@@ -12,7 +12,7 @@
     ]
   },
   "dependencies": {
-    "@cccsaurora/clue-ui": "1.4.2",
+    "@cccsaurora/clue-ui": "1.4.4",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^7.0.0",
     "@dnd-kit/sortable": "^8.0.0",
@@ -97,7 +97,7 @@
     "url": "https://github.com/CybercentreCanada/howler"
   },
   "type": "module",
-  "version": "3.1.0-dev.1627",
+  "version": "3.1.0-dev.1632",
   "exports": {
     "./i18n": "./i18n.js",
     "./index.css": "./index.css",

package/plugins/clue/Provider.js

@@ -9,17 +9,17 @@ import { getStored } from '@cccsaurora/howler-ui/utils/localStorage';
 const Provider = ({ children, options = {} }) => {
     const { config } = useContext(ApiConfigContext);
     const features = config?.configuration?.features ?? {};
-    const [database, setDatabase] = useState();
+    const [database, setDatabase] = useState(null);
     const defaultGetToken = useCallback(() => getStored(StorageKey.APP_TOKEN) ?? '', []);
     const baseURL = options.baseURL ?? `${location.origin}/api/v1/clue`;
     const getToken = options.getToken ?? defaultGetToken;
     const publicIconify = options.publicIconify ?? location.origin.includes('localhost');
     const customIconify = options.customIconify ?? location.origin.replace('howler', 'icons');
     useEffect(() => {
-        let cancelled = false;
-        if (!features.clue) {
+        if (!features.clue || database) {
             return;
         }
+        let cancelled = false;
         void buildDatabase({
             storageType: options.storageType ?? 'memory',
             replicate: !!options.replicate,
@@ -33,7 +33,7 @@ const Provider = ({ children, options = {} }) => {
         return () => {
             cancelled = true;
         };
-    }, [baseURL, features.clue, getToken, options.storageType, options.replicate]);
+    }, [baseURL, features.clue, getToken, options.storageType, options.replicate, database]);
     return (_jsx(ClueProvider, { baseURL: baseURL, getToken: getToken, enabled: features.clue, publicIconify: publicIconify, customIconify: customIconify, defaultTimeout: options.defaultTimeout ?? 5, i18next: useTranslation('clue'), chunkSize: options.chunkSize ?? 50, database: database, includeContext: options.includeContext, children: children }));
 };
 export default Provider;

package/plugins/clue/Provider.test.js

@@ -51,7 +51,7 @@ describe('Clue Provider', () => {
         renderProvider({ configuration: { features: { clue: false } } });
         expect(mocks.buildDatabase).not.toHaveBeenCalled();
         expect(getProviderProps().enabled).toBe(false);
-        expect(getProviderProps().database).toBeUndefined();
+        expect(getProviderProps().database).toBeNull();
         expect(getProviderProps().getToken?.()).toBe('');
     });
     it('returns the current stored application token by default', () => {
@@ -114,6 +114,6 @@ describe('Clue Provider', () => {
         await act(async () => {
             resolveDatabase({ name: 'late' });
         });
-        expect(getProviderProps().database).toBeUndefined();
+        expect(getProviderProps().database).toBeNull();
     });
 });

package/plugins/clue/index.d.ts

@@ -9,6 +9,7 @@ import useSetup from './setup';
 export type { CluePluginOptions } from './Provider';
 declare class CluePlugin extends HowlerPlugin {
     private readonly options;
+    private readonly providerComponent;
     constructor(options?: CluePluginOptions);
     name: string;
     version: string;

package/plugins/clue/index.js

@@ -17,9 +17,11 @@ import Provider, {} from './Provider';
 import useSetup from './setup';
 class CluePlugin extends HowlerPlugin {
     options;
+    providerComponent;
     constructor(options = {}) {
         super();
         this.options = options;
+        this.providerComponent = ({ children }) => _jsx(Provider, { options: this.options, children: children });
     }
     name = 'CluePlugin';
     version = '0.0.1';
@@ -46,8 +48,7 @@ class CluePlugin extends HowlerPlugin {
         super.addPivot('clue', pivotForm, pivotRenderer);
     }
     provider() {
-        const options = this.options;
-        return ({ children }) => _jsx(Provider, { options: options, children: children });
+        return this.providerComponent;
     }
     setup() {
         return useSetup;

package/plugins/clue/index.test.d.ts

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

package/plugins/clue/index.test.js

@@ -0,0 +1,8 @@
+import { describe, expect, it } from 'vitest';
+import CluePlugin from './index';
+describe('Clue plugin', () => {
+    it('keeps its provider component identity stable', () => {
+        const plugin = new CluePlugin();
+        expect(plugin.provider()).toBe(plugin.provider());
+    });
+});