@gridsuite/commons-ui 0.74.0 → 0.75.0

package/dist/components/index.d.ts

@@ -20,3 +20,4 @@ export * from './overflowableText';
 export * from './snackbarProvider';
 export * from './topBar';
 export * from './treeViewFinder';
+export * from './notifications';

package/dist/components/index.js

@@ -104,6 +104,10 @@ import { TopBar } from "./topBar/TopBar.js";
 import { GridLogo, LogoText } from "./topBar/GridLogo.js";
 import { AboutDialog } from "./topBar/AboutDialog.js";
 import { TreeViewFinder, generateTreeViewFinderClass } from "./treeViewFinder/TreeViewFinder.js";
+import { NotificationsProvider } from "./notifications/NotificationsProvider.js";
+import { NotificationsContext } from "./notifications/contexts/NotificationsContext.js";
+import { useNotificationsListener } from "./notifications/hooks/useNotificationsListener.js";
+import { useListenerManager } from "./notifications/hooks/useListenerManager.js";
 export {
   AboutDialog,
   AddButton,
@@ -194,6 +198,8 @@ export {
   MultipleSelectionDialog,
   NAME,
   NO_ITEM_SELECTION_FOR_COPY,
+  NotificationsContext,
+  NotificationsProvider,
   NumericEditor,
   OPERATOR_OPTIONS,
   OperatorType,
@@ -289,5 +295,7 @@ export {
   useConvertValue,
   useCustomFormContext,
   useElementSearch,
+  useListenerManager,
+  useNotificationsListener,
   useValid
 };

package/dist/components/notifications/NotificationsProvider.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+
+export type NotificationsProviderProps = {
+    urls: Record<string, string>;
+};
+export declare function NotificationsProvider({ urls, children }: PropsWithChildren<NotificationsProviderProps>): import("react/jsx-runtime").JSX.Element;

package/dist/components/notifications/NotificationsProvider.js

@@ -0,0 +1,54 @@
+import { jsx } from "react/jsx-runtime";
+import { useEffect, useMemo } from "react";
+import ReconnectingWebSocket from "reconnecting-websocket";
+import { NotificationsContext } from "./contexts/NotificationsContext.js";
+import { useListenerManager } from "./hooks/useListenerManager.js";
+const DELAY_BEFORE_WEBSOCKET_CONNECTED = 12e3;
+function NotificationsProvider({ urls, children }) {
+  const {
+    broadcast: broadcastMessage,
+    addListener: addListenerMessage,
+    removeListener: removeListenerMessage
+  } = useListenerManager(urls);
+  const {
+    broadcast: broadcastOnReopen,
+    addListener: addListenerOnReopen,
+    removeListener: removeListenerOnReopen
+  } = useListenerManager(urls);
+  useEffect(() => {
+    const connections = Object.keys(urls).filter((u) => urls[u] != null).map((urlKey) => {
+      const rws = new ReconnectingWebSocket(() => urls[urlKey], [], {
+        // this option set the minimum duration being connected before reset the retry count to 0
+        minUptime: DELAY_BEFORE_WEBSOCKET_CONNECTED
+      });
+      rws.onmessage = broadcastMessage(urlKey);
+      rws.onclose = (event) => {
+        console.error(`Unexpected ${urlKey} Notification WebSocket closed`, event);
+      };
+      rws.onerror = (event) => {
+        console.error(`Unexpected ${urlKey} Notification WebSocket error`, event);
+      };
+      rws.onopen = () => {
+        console.info(`${urlKey} Notification Websocket connected`);
+        broadcastOnReopen(urlKey);
+      };
+      return rws;
+    });
+    return () => {
+      connections.forEach((c) => c.close());
+    };
+  }, [broadcastMessage, broadcastOnReopen, urls]);
+  const contextValue = useMemo(
+    () => ({
+      addListenerEvent: addListenerMessage,
+      removeListenerEvent: removeListenerMessage,
+      addListenerOnReopen,
+      removeListenerOnReopen
+    }),
+    [addListenerMessage, removeListenerMessage, addListenerOnReopen, removeListenerOnReopen]
+  );
+  return /* @__PURE__ */ jsx(NotificationsContext.Provider, { value: contextValue, children });
+}
+export {
+  NotificationsProvider
+};

package/dist/components/notifications/contexts/NotificationsContext.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) 2024, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+/// <reference types="react" />
+export type ListenerEventWS = {
+    id: string;
+    callback: (event: MessageEvent) => void;
+};
+export type ListenerOnReopen = {
+    id: string;
+    callback: () => void;
+};
+export type NotificationsContextType = {
+    addListenerEvent: (urlKey: string, l: ListenerEventWS) => void;
+    removeListenerEvent: (urlKey: string, idListener: string) => void;
+    addListenerOnReopen: (urlKey: string, l: ListenerOnReopen) => void;
+    removeListenerOnReopen: (urlKey: string, idListener: string) => void;
+};
+export type NotificationsContextRecordType = Record<string, NotificationsContextType>;
+export declare const NotificationsContext: import('react').Context<NotificationsContextType>;

package/dist/components/notifications/contexts/NotificationsContext.js

@@ -0,0 +1,14 @@
+import { createContext } from "react";
+const NotificationsContext = createContext({
+  addListenerEvent: () => {
+  },
+  removeListenerEvent: () => {
+  },
+  addListenerOnReopen: () => {
+  },
+  removeListenerOnReopen: () => {
+  }
+});
+export {
+  NotificationsContext
+};

package/dist/components/notifications/hooks/useListenerManager.d.ts

@@ -0,0 +1,7 @@
+import { ListenerEventWS, ListenerOnReopen } from '../contexts/NotificationsContext';
+
+export declare const useListenerManager: <TListener extends ListenerEventWS | ListenerOnReopen, TMessage extends MessageEvent<any>>(urls: Record<string, string>) => {
+    addListener: (urlKey: string, listener: TListener) => void;
+    removeListener: (urlKey: string, id: string) => void;
+    broadcast: (urlKey: string) => (event: TMessage) => void;
+};

package/dist/components/notifications/hooks/useListenerManager.js

@@ -0,0 +1,50 @@
+import { useRef, useEffect, useCallback } from "react";
+const useListenerManager = (urls) => {
+  const urlsListenersRef = useRef({});
+  useEffect(() => {
+    urlsListenersRef.current = Object.keys(urls).reduce((acc, urlKey) => {
+      acc[urlKey] = urlsListenersRef.current[urlKey] ?? [];
+      return acc;
+    }, {});
+  }, [urls]);
+  const addListenerEvent = useCallback((urlKey, listener) => {
+    const urlsListeners = urlsListenersRef.current;
+    if (urlKey in urlsListeners) {
+      urlsListeners[urlKey].push(listener);
+    } else {
+      urlsListeners[urlKey] = [listener];
+    }
+    urlsListenersRef.current = urlsListeners;
+  }, []);
+  const removeListenerEvent = useCallback((urlKey, id) => {
+    var _a;
+    const listeners = (_a = urlsListenersRef.current) == null ? void 0 : _a[urlKey];
+    if (listeners) {
+      const newListerners = listeners.filter((l) => l.id !== id);
+      urlsListenersRef.current = {
+        ...urlsListenersRef.current,
+        [urlKey]: newListerners
+      };
+    }
+  }, []);
+  const broadcast = useCallback(
+    (urlKey) => (event) => {
+      var _a;
+      const listeners = (_a = urlsListenersRef.current) == null ? void 0 : _a[urlKey];
+      if (listeners) {
+        listeners.forEach(({ callback }) => {
+          callback(event);
+        });
+      }
+    },
+    []
+  );
+  return {
+    addListener: addListenerEvent,
+    removeListener: removeListenerEvent,
+    broadcast
+  };
+};
+export {
+  useListenerManager
+};

package/dist/components/notifications/hooks/useNotificationsListener.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) 2024, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+export declare const useNotificationsListener: (listenerKey: string, { listenerCallbackMessage, listenerCallbackOnReopen, propsId, }: {
+    listenerCallbackMessage?: ((event: MessageEvent<any>) => void) | undefined;
+    listenerCallbackOnReopen?: (() => void) | undefined;
+    propsId?: string | undefined;
+}) => void;

package/dist/components/notifications/hooks/useNotificationsListener.js

@@ -0,0 +1,33 @@
+import { useContext, useEffect } from "react";
+import { v4 } from "uuid";
+import { NotificationsContext } from "../contexts/NotificationsContext.js";
+const useNotificationsListener = (listenerKey, {
+  listenerCallbackMessage,
+  listenerCallbackOnReopen,
+  propsId
+}) => {
+  const { addListenerEvent, removeListenerEvent, addListenerOnReopen, removeListenerOnReopen } = useContext(NotificationsContext);
+  useEffect(() => {
+    const id = propsId ?? v4();
+    if (listenerCallbackMessage) {
+      addListenerEvent(listenerKey, {
+        id,
+        callback: listenerCallbackMessage
+      });
+    }
+    return () => removeListenerEvent(listenerKey, id);
+  }, [addListenerEvent, removeListenerEvent, listenerKey, listenerCallbackMessage, propsId]);
+  useEffect(() => {
+    const id = propsId ?? v4();
+    if (listenerCallbackOnReopen) {
+      addListenerOnReopen(listenerKey, {
+        id,
+        callback: listenerCallbackOnReopen
+      });
+    }
+    return () => removeListenerOnReopen(listenerKey, id);
+  }, [addListenerOnReopen, removeListenerOnReopen, listenerKey, listenerCallbackOnReopen, propsId]);
+};
+export {
+  useNotificationsListener
+};

package/dist/components/notifications/index.d.ts

@@ -0,0 +1,4 @@
+export * from './NotificationsProvider';
+export * from './contexts/NotificationsContext';
+export * from './hooks/useNotificationsListener';
+export * from './hooks/useListenerManager';

package/dist/components/notifications/index.js

@@ -0,0 +1,10 @@
+import { NotificationsProvider } from "./NotificationsProvider.js";
+import { NotificationsContext } from "./contexts/NotificationsContext.js";
+import { useNotificationsListener } from "./hooks/useNotificationsListener.js";
+import { useListenerManager } from "./hooks/useListenerManager.js";
+export {
+  NotificationsContext,
+  NotificationsProvider,
+  useListenerManager,
+  useNotificationsListener
+};

package/dist/index.js

@@ -105,6 +105,10 @@ import { TopBar } from "./components/topBar/TopBar.js";
 import { GridLogo, LogoText } from "./components/topBar/GridLogo.js";
 import { AboutDialog } from "./components/topBar/AboutDialog.js";
 import { TreeViewFinder, generateTreeViewFinderClass } from "./components/treeViewFinder/TreeViewFinder.js";
+import { NotificationsProvider } from "./components/notifications/NotificationsProvider.js";
+import { NotificationsContext } from "./components/notifications/contexts/NotificationsContext.js";
+import { useNotificationsListener } from "./components/notifications/hooks/useNotificationsListener.js";
+import { useListenerManager } from "./components/notifications/hooks/useListenerManager.js";
 import { useStateBoolean } from "./hooks/customStates/useStateBoolean.js";
 import { useStateNumber } from "./hooks/customStates/useStateNumber.js";
 import { useModificationLabelComputer } from "./hooks/useModificationLabelComputer.js";
@@ -291,6 +295,8 @@ export {
   MultipleSelectionDialog,
   NAME,
   NO_ITEM_SELECTION_FOR_COPY,
+  NotificationsContext,
+  NotificationsProvider,
   NumericEditor,
   OPERATOR_OPTIONS,
   OperatingStatus,
@@ -494,8 +500,10 @@ export {
   useDebounce,
   useElementSearch,
   useIntlRef,
+  useListenerManager,
   useLocalizedCountries,
   useModificationLabelComputer,
+  useNotificationsListener,
   usePredefinedProperties,
   usePrevious,
   useSnackMessage,

package/dist/translations/en/networkModificationsEn.d.ts

@@ -58,5 +58,5 @@ export declare const networkModificationsEn: {
     'network_modifications.TABULAR_CREATION': string;
     'network_modifications.tabular.GENERATOR_CREATION': string;
     'network_modifications.LCC_CREATION': string;
-    'network_modifications.CSPR_CREATION': string;
+    'network_modifications.STATIC_VAR_COMPENSATOR_CREATION': string;
 };

package/dist/translations/en/networkModificationsEn.js

@@ -52,7 +52,7 @@ const networkModificationsEn = {
   "network_modifications.TABULAR_CREATION": "Tabular creation - {computedLabel}",
   "network_modifications.tabular.GENERATOR_CREATION": "generator creations",
   "network_modifications.LCC_CREATION": "Creating HVDC (LCC) {computedLabel}",
-  "network_modifications.CSPR_CREATION": "Creating CSPR {computedLabel}"
+  "network_modifications.STATIC_VAR_COMPENSATOR_CREATION": "Creating static var compensator {computedLabel}"
 };
 export {
   networkModificationsEn

package/dist/utils/mapper/getFileIcon.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { Calculate, Settings, Article, NoteAlt, OfflineBolt, Photo, PhotoLibrary } from "@mui/icons-material";
+import { TableView, Calculate, Settings, Article, NoteAlt, OfflineBolt, Photo, PhotoLibrary } from "@mui/icons-material";
 import { ElementType } from "../types/elementType.js";
 function getFileIcon(type, style) {
   switch (type) {
@@ -22,6 +22,8 @@ function getFileIcon(type, style) {
       return /* @__PURE__ */ jsx(Settings, { sx: style });
     case ElementType.SPREADSHEET_CONFIG:
       return /* @__PURE__ */ jsx(Calculate, { sx: style });
+    case ElementType.SPREADSHEET_CONFIG_COLLECTION:
+      return /* @__PURE__ */ jsx(TableView, { sx: style });
     case ElementType.DIRECTORY:
       return void 0;
     default:

package/dist/utils/types/elementType.d.ts

@@ -13,6 +13,7 @@ export declare enum ElementType {
     LOADFLOW_PARAMETERS = "LOADFLOW_PARAMETERS",
     SENSITIVITY_PARAMETERS = "SENSITIVITY_PARAMETERS",
     SHORT_CIRCUIT_PARAMETERS = "SHORT_CIRCUIT_PARAMETERS",
-    SPREADSHEET_CONFIG = "SPREADSHEET_CONFIG"
+    SPREADSHEET_CONFIG = "SPREADSHEET_CONFIG",
+    SPREADSHEET_CONFIG_COLLECTION = "SPREADSHEET_CONFIG_COLLECTION"
 }
 export type ElementExistsType = (directory: UUID, value: string, elementType: ElementType) => Promise<boolean>;

package/dist/utils/types/elementType.js

@@ -12,6 +12,7 @@ var ElementType = /* @__PURE__ */ ((ElementType2) => {
   ElementType2["SENSITIVITY_PARAMETERS"] = "SENSITIVITY_PARAMETERS";
   ElementType2["SHORT_CIRCUIT_PARAMETERS"] = "SHORT_CIRCUIT_PARAMETERS";
   ElementType2["SPREADSHEET_CONFIG"] = "SPREADSHEET_CONFIG";
+  ElementType2["SPREADSHEET_CONFIG_COLLECTION"] = "SPREADSHEET_CONFIG_COLLECTION";
   return ElementType2;
 })(ElementType || {});
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gridsuite/commons-ui",
-    "version": "0.74.0",
+    "version": "0.75.0",
     "description": "common react components for gridsuite applications",
     "engines": {
         "npm": ">=9",
@@ -43,6 +43,7 @@
         "react-dnd-html5-backend": "^16.0.1",
         "react-querybuilder": "^7.2.0",
         "react-virtualized": "^9.22.5",
+        "reconnecting-websocket": "^4.4.0",
         "uuid": "^9.0.1"
     },
     "peerDependencies": {