@cccsaurora/howler-ui 2.17.0-dev.548 → 2.17.0-dev.551

package/components/elements/display/handlebars/helpers.d.ts

@@ -6,7 +6,11 @@ export interface HowlerHelper {
         en: string;
         fr: string;
     };
+    async?: boolean;
     callback?: Handlebars.HelperDelegate;
     componentCallback?: (...args: any[]) => ReactElement | Promise<ReactElement>;
 }
-export declare const useHelpers: () => HowlerHelper[];
+export declare const useHelpers: (opts?: {
+    async: boolean;
+    components: boolean;
+}) => HowlerHelper[];

package/components/elements/display/handlebars/helpers.js

@@ -13,7 +13,7 @@ import { usePluginStore } from 'react-pluggable';
 import ActionButton from '../ActionButton';
 import JSONViewer from '../json/JSONViewer';
 const FETCH_RESULTS = {};
-export const useHelpers = () => {
+export const useHelpers = (opts = { async: true, components: true }) => {
     const pluginStore = usePluginStore();
     const allHelpers = useMemo(() => [
         {
@@ -86,6 +86,7 @@ export const useHelpers = () => {
                 en: 'Fetches the url provided and returns the given (flattened) key from the returned JSON object. Note that the result must be JSON!',
                 fr: "Récupère l'URL fournie et retourne la clé donnée (aplatie) de l'objet JSON retourné. Notez que le résultat doit être du JSON !"
             },
+            async: true,
             callback: async (url, key) => {
                 try {
                     if (!FETCH_RESULTS[url]) {
@@ -164,7 +165,7 @@ export const useHelpers = () => {
                 en: 'Returns the given (flattened) key from the provided object.',
                 fr: "Retourne la clé donnée (aplatie) de l'objet fourni."
             },
-            callback: async (data, key) => {
+            callback: (data, key) => {
                 try {
                     return get(data, key);
                 }
@@ -213,7 +214,17 @@ export const useHelpers = () => {
                 return _jsx(ActionButton, { actionId: actionId, hitId: hitId, ...(context.hash ?? {}) });
             }
         },
+        {
+            keyword: 'replace',
+            documentation: {
+                en: '',
+                fr: ''
+            },
+            callback: (str, searchValue, replaceValue) => {
+                return str.replace(searchValue ?? '', replaceValue ?? '');
+            }
+        },
         ...howlerPluginStore.plugins.flatMap(plugin => pluginStore.executeFunction(`${plugin}.helpers`))
-    ], [pluginStore]);
+    ].filter((entry) => (opts.async || !entry.async) && (opts.components || !entry.componentCallback)), [opts.async, opts.components, pluginStore]);
     return allHelpers;
 };

package/components/elements/hit/related/PivotLink.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { ErrorOutline } from '@mui/icons-material';
 import { Tooltip } from '@mui/material';
+import { useHelpers } from '@cccsaurora/howler-ui/components/elements/display/handlebars/helpers';
 import HowlerCard from '@cccsaurora/howler-ui/components/elements/display/HowlerCard';
 import Handlebars from 'handlebars';
 import { isEmpty } from 'lodash-es';
@@ -11,7 +12,9 @@ import { flattenDeep } from '@cccsaurora/howler-ui/utils/utils';
 import RelatedLink from './RelatedLink';
 const PivotLink = ({ pivot, hit, compact = false }) => {
     const { i18n } = useTranslation();
+    const helpers = useHelpers({ async: false, components: false });
     const pluginStore = usePluginStore();
+    const handlebars = useMemo(() => Handlebars.create(), []);
     const flatHit = useMemo(() => flattenDeep(hit ?? {}), [hit]);
     const href = useMemo(() => {
         if (!pivot || pivot.format !== 'link' || !flatHit || isEmpty(flatHit)) {
@@ -30,10 +33,25 @@ const PivotLink = ({ pivot, hit, compact = false }) => {
             }
             return result;
         }));
-        return Handlebars.compile(pivot.value)(templateObject);
-    }, [flatHit, pivot]);
+        helpers.forEach(helper => {
+            if (handlebars.helpers[helper.keyword]) {
+                return;
+            }
+            handlebars.registerHelper(helper.keyword, (...args) => {
+                // eslint-disable-next-line no-console
+                console.debug(`Running helper ${helper.keyword}`);
+                return helper.callback(...args);
+            });
+        });
+        try {
+            return handlebars.compile(pivot.value)(templateObject);
+        }
+        catch (e) {
+            return pivot.value;
+        }
+    }, [flatHit, pivot, handlebars, helpers]);
     if (href) {
-        return _jsx(RelatedLink, { title: pivot.label[i18n.language], href: href, compact: compact, icon: pivot.icon });
+        return (_jsx(RelatedLink, { title: pivot.label[i18n.language], href: href, compact: compact, icon: pivot.icon, target: "_blank" }));
     }
     // Hide a relatively useless console error, we'll show a UI component instead
     // eslint-disable-next-line no-console

package/components/elements/hit/related/RelatedLink.d.ts

@@ -4,5 +4,6 @@ declare const RelatedLink: React.FC<PropsWithChildren<{
     title?: string;
     href?: string;
     compact?: boolean;
+    target?: string;
 }>>;
 export default RelatedLink;

package/components/elements/hit/related/RelatedLink.js

@@ -4,8 +4,8 @@ import HowlerCard from '@cccsaurora/howler-ui/components/elements/display/Howler
 import React, {} from 'react';
 import { Link } from 'react-router-dom';
 import RelatedIcon from './RelatedIcon';
-const RelatedLink = ({ icon, title, href, compact = false, children }) => {
-    return (_jsx(HowlerCard, { variant: compact ? 'outlined' : 'elevation', onClick: () => window.open(href), sx: [
+const RelatedLink = ({ icon, title, href, target, compact = false, children }) => {
+    return (_jsx(HowlerCard, { variant: compact ? 'outlined' : 'elevation', onClick: () => window.open(href, target), sx: [
             theme => ({
                 cursor: 'pointer',
                 backgroundColor: 'transparent',
@@ -17,6 +17,6 @@ const RelatedLink = ({ icon, title, href, compact = false, children }) => {
                 '& a': { textDecoration: 'none', color: 'text.primary' }
             }),
             !compact && { border: 'thin solid', borderColor: 'transparent' }
-        ], children: _jsxs(Stack, { direction: "row", p: compact ? 0.5 : 1, spacing: 1, alignItems: "center", children: [children || _jsx(RelatedIcon, { icon: icon, title: title, href: href, compact: compact }), _jsx(Typography, { component: Link, to: href, onClick: e => e.stopPropagation(), children: title ?? href })] }) }, href));
+        ], children: _jsxs(Stack, { direction: "row", p: compact ? 0.5 : 1, spacing: 1, alignItems: "center", children: [children || _jsx(RelatedIcon, { icon: icon, title: title, href: href, compact: compact }), _jsx(Typography, { component: Link, to: href, target: target, onClick: e => e.stopPropagation(), children: title ?? href })] }) }, href));
 };
 export default RelatedLink;

package/components/routes/hits/search/shared/CustomSpan.js

@@ -18,7 +18,7 @@ const CustomSpan = () => {
     const endDate = useContextSelector(ParameterContext, ctx => (ctx.endDate ? dayjs(ctx.endDate) : defaultEndDate));
     useEffect(() => {
         if (span?.endsWith('custom')) {
-            setCustomSpan(startDate.format('YYYY-MM-DD HH:mm'), endDate.format('YYYY-MM-DD HH:mm'));
+            setCustomSpan(startDate.toISOString(), endDate.toISOString());
         }
     }, [endDate, setCustomSpan, span, startDate]);
     return span?.endsWith('custom') ? (_jsx(LocalizationProvider, { dateAdapter: AdapterDayjs, children: _jsxs(Stack, { direction: "row", spacing: 1, useFlexGap: true, flexWrap: "wrap", children: [_jsx(DateTimePicker, { sx: { minWidth: '175px', flexGrow: 1, marginTop: 1 }, slotProps: { textField: { size: 'small' } }, label: t('date.select.start'), value: startDate ? dayjs(startDate) : dayjs().subtract(1, 'days'), maxDate: endDate, onChange: (newStartDate) => setCustomSpan(newStartDate.toISOString(), endDate.toISOString()), ampm: false, disableFuture: true }), _jsx(DateTimePicker, { sx: { minWidth: '175px', flexGrow: 1, marginTop: 1 }, slotProps: { textField: { size: 'small' } }, label: t('date.select.end'), value: endDate, minDate: startDate, onChange: (newEndDate) => setCustomSpan(startDate.toISOString(), newEndDate.toISOString()), ampm: false, disableFuture: true })] }) })) : null;

package/package.json

@@ -101,7 +101,7 @@
     "internal-slot": "1.0.7"
   },
   "type": "module",
-  "version": "2.17.0-dev.548",
+  "version": "2.17.0-dev.551",
   "exports": {
     "./i18n": "./i18n.js",
     "./index.css": "./index.css",