@gridsuite/commons-ui 0.66.1 → 0.68.0

package/dist/components/topBar/TopBar.js

@@ -2,10 +2,13 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useMemo } from "react";
 import { FormattedMessage } from "react-intl";
 import { Menu, MenuItem, ListItemIcon, AppBar, Toolbar, Box, IconButton, ListItemText, Button, Popper, Paper, ClickAwayListener, MenuList, Typography, ToggleButtonGroup, ToggleButton, darken } from "@mui/material";
-import { Apps, ArrowDropUp, ArrowDropDown, Person, WbSunny, Brightness3, Computer, Settings, HelpOutline, ExitToApp } from "@mui/icons-material";
+import { Apps, ArrowDropUp, ArrowDropDown, Person, WbSunny, Brightness3, Computer, Settings, ManageAccounts, HelpOutline, ExitToApp } from "@mui/icons-material";
 import { styled } from "@mui/system";
-import GridLogo from "./GridLogo.js";
-import AboutDialog from "./AboutDialog.js";
+import { GridLogo } from "./GridLogo.js";
+import { AboutDialog } from "./AboutDialog.js";
+import { useStateBoolean } from "../../hooks/customStates/useStateBoolean.js";
+import UserInformationDialog from "./UserInformationDialog.js";
+import { LIGHT_THEME, DARK_THEME, LANG_SYSTEM, LANG_ENGLISH, LANG_FRENCH } from "../../utils/constants/browserConstants.js";
 const styles = {
   grow: {
     flexGrow: 1,
@@ -99,11 +102,6 @@ const CustomListItemIcon = styled(ListItemIcon)({
   paddingRight: "15px",
   borderRadius: "25px"
 });
-const DARK_THEME = "Dark";
-const LIGHT_THEME = "Light";
-const LANG_SYSTEM = "sys";
-const LANG_ENGLISH = "en";
-const LANG_FRENCH = "fr";
 const EN = "EN";
 const FR = "FR";
 function TopBar({
@@ -131,6 +129,11 @@ function TopBar({
 }) {
   const [anchorElSettingsMenu, setAnchorElSettingsMenu] = useState(null);
   const [anchorElAppsMenu, setAnchorElAppsMenu] = useState(null);
+  const {
+    value: userInformationDialogOpen,
+    setFalse: closeUserInformationDialog,
+    setTrue: openUserInformationDialog
+  } = useStateBoolean(false);
   const handleToggleSettingsMenu = (event) => {
     setAnchorElSettingsMenu(event.currentTarget);
   };
@@ -180,6 +183,10 @@ function TopBar({
       setAboutDialogOpen(true);
     }
   };
+  const onUserInformationDialogClicked = () => {
+    setAnchorElSettingsMenu(null);
+    openUserInformationDialog();
+  };
   const logoClickable = useMemo(
     () => /* @__PURE__ */ jsx(GridLogo, { onClick: onLogoClick, appLogo, appName, appColor }),
     [onLogoClick, appLogo, appName, appColor]
@@ -431,6 +438,24 @@ function TopBar({
                   }
                 ) }) })
               ] }),
+              /* @__PURE__ */ jsxs(
+                StyledMenuItem,
+                {
+                  sx: styles.borderBottom,
+                  style: { opacity: "1" },
+                  onClick: onUserInformationDialogClicked,
+                  children: [
+                    /* @__PURE__ */ jsx(CustomListItemIcon, { children: /* @__PURE__ */ jsx(ManageAccounts, { fontSize: "small" }) }),
+                    /* @__PURE__ */ jsx(ListItemText, { children: /* @__PURE__ */ jsx(Typography, { sx: styles.sizeLabel, children: /* @__PURE__ */ jsx(
+                      FormattedMessage,
+                      {
+                        id: "top-bar/userInformation",
+                        defaultMessage: "User information"
+                      }
+                    ) }) })
+                  ]
+                }
+              ),
               /* @__PURE__ */ jsxs(
                 StyledMenuItem,
                 {
@@ -451,6 +476,14 @@ function TopBar({
           }
         )
       ] }),
+      userInformationDialogOpen && /* @__PURE__ */ jsx(
+        UserInformationDialog,
+        {
+          openDialog: userInformationDialogOpen,
+          user,
+          onClose: closeUserInformationDialog
+        }
+      ),
       /* @__PURE__ */ jsx(
         AboutDialog,
         {
@@ -468,10 +501,5 @@ function TopBar({
   );
 }
 export {
-  DARK_THEME,
-  LANG_ENGLISH,
-  LANG_FRENCH,
-  LANG_SYSTEM,
-  LIGHT_THEME,
-  TopBar as default
+  TopBar
 };

package/dist/components/topBar/UserInformationDialog.d.ts

@@ -0,0 +1,9 @@
+import { User } from 'oidc-client';
+
+interface UserInformationDialogProps {
+    openDialog: boolean;
+    onClose: () => void;
+    user: User | undefined;
+}
+declare function UserInformationDialog({ openDialog, user, onClose }: UserInformationDialogProps): import("react/jsx-runtime").JSX.Element;
+export default UserInformationDialog;

package/dist/components/topBar/UserInformationDialog.js

@@ -0,0 +1,70 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { Dialog, DialogTitle, DialogContent, Grid, Typography, DialogActions } from "@mui/material";
+import { Box } from "@mui/system";
+import { FormattedMessage } from "react-intl";
+import { useState, useEffect } from "react";
+import { CancelButton } from "../inputs/reactHookForm/utils/CancelButton.js";
+import fetchUserDetails from "../../services/userAdmin.js";
+const styles = {
+  DialogTitle: { fontSize: "1.5rem" },
+  DialogContent: { marginTop: "10px" },
+  quotasBox: { marginTop: "60px" },
+  quotasTopography: { marginTop: "30px", marginBottom: "25px", fontSize: "1.15rem" },
+  usedTopography: { marginLeft: "15%" }
+};
+function UserInformationDialog({ openDialog, user, onClose }) {
+  const [userDetails, setUserDetails] = useState(void 0);
+  const getUserDetails = (userName) => {
+    fetchUserDetails(userName).then((response) => {
+      setUserDetails(response);
+    }).catch((error) => {
+      console.warn(`Could not fetch user information for ${userName}`, error);
+    });
+  };
+  useEffect(() => {
+    if (!user || user.expired) {
+      onClose();
+    }
+    if (user == null ? void 0 : user.profile.sub) {
+      getUserDetails(user == null ? void 0 : user.profile.sub);
+    }
+  }, [user, onClose]);
+  return /* @__PURE__ */ jsxs(Dialog, { open: openDialog && !!userDetails, onClose, children: [
+    /* @__PURE__ */ jsx(DialogTitle, { sx: styles.DialogTitle, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/title" }) }),
+    /* @__PURE__ */ jsxs(DialogContent, { children: [
+      /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, sx: styles.DialogContent, children: [
+        /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/role" }) }) }),
+        /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsx(Typography, { children: /* @__PURE__ */ jsx(
+          FormattedMessage,
+          {
+            id: (userDetails == null ? void 0 : userDetails.isAdmin) ? "user-information-dialog/role-admin" : "user-information-dialog/role-user"
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/profil" }) }) }),
+        /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: (userDetails == null ? void 0 : userDetails.profileName) === null ? /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/no-profile" }) : /* @__PURE__ */ jsx(Typography, { children: userDetails == null ? void 0 : userDetails.profileName }) })
+      ] }),
+      /* @__PURE__ */ jsxs(Box, { mt: 3, sx: styles.quotasBox, children: [
+        /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", sx: styles.quotasTopography, children: /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/quotas" }) }),
+        /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
+          /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/number-of-cases-or-studies" }) }) }),
+          /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsxs(Typography, { children: [
+            userDetails == null ? void 0 : userDetails.maxAllowedCases,
+            /* @__PURE__ */ jsxs(Box, { component: "span", sx: styles.usedTopography, children: [
+              "( ",
+              /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/used" }),
+              ":",
+              ` ${userDetails == null ? void 0 : userDetails.numberCasesUsed}`,
+              " )"
+            ] })
+          ] }) }),
+          /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: /* @__PURE__ */ jsx(FormattedMessage, { id: "user-information-dialog/number-of-builds-per-study" }) }) }),
+          /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, children: /* @__PURE__ */ jsx(Typography, { children: userDetails == null ? void 0 : userDetails.maxAllowedBuilds }) })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsx(CancelButton, { color: "primary", onClick: onClose }) })
+  ] });
+}
+export {
+  UserInformationDialog as default
+};

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

@@ -4,7 +4,6 @@
  * 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 { default as TopBar } from './TopBar';
-export type { TopBarProps } from './TopBar';
+export * from './TopBar';
 export * from './GridLogo';
-export { default as AboutDialog } from './AboutDialog';
+export * from './AboutDialog';

package/dist/components/topBar/index.js

@@ -1,8 +1,9 @@
-import { default as default2 } from "./TopBar.js";
-import { LogoText } from "./GridLogo.js";
-import { default as default3 } from "./AboutDialog.js";
+import { TopBar } from "./TopBar.js";
+import { GridLogo, LogoText } from "./GridLogo.js";
+import { AboutDialog } from "./AboutDialog.js";
 export {
-  default3 as AboutDialog,
+  AboutDialog,
+  GridLogo,
   LogoText,
-  default2 as TopBar
+  TopBar
 };

package/dist/components/treeViewFinder/TreeViewFinder.d.ts

@@ -29,5 +29,4 @@ export interface TreeViewFinderProps {
     onTreeBrowse?: (nodeId: string) => void;
     sortMethod?: (a: TreeViewFinderNodeProps, b: TreeViewFinderNodeProps) => number;
 }
-declare const _default: import('@emotion/styled').StyledComponent<TreeViewFinderProps & import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme>, {}, {}>;
-export default _default;
+export declare const TreeViewFinder: import('@emotion/styled').StyledComponent<TreeViewFinderProps & import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme>, {}, {}>;

package/dist/components/treeViewFinder/TreeViewFinder.js

@@ -6,7 +6,7 @@ import { Dialog, DialogTitle, DialogContent, DialogContentText, DialogActions, B
 import { TreeView, TreeItem } from "@mui/x-tree-view";
 import { ChevronRight, ExpandMore, Check } from "@mui/icons-material";
 import { toNestedGlobalSelectors, makeComposeClasses } from "../../utils/styles.js";
-import CancelButton from "../inputs/reactHookForm/utils/CancelButton.js";
+import { CancelButton } from "../inputs/reactHookForm/utils/CancelButton.js";
 const cssDialogPaper = "dialogPaper";
 const cssLabelRoot = "labelRoot";
 const cssLabelText = "labelText";
@@ -35,7 +35,7 @@ const defaultStyles = {
 };
 const generateTreeViewFinderClass = (className) => `GsiTreeViewFinder-${className}`;
 const composeClasses = makeComposeClasses(generateTreeViewFinderClass);
-function TreeViewFinder(props) {
+function TreeViewFinderComponant(props) {
   const intl = useIntl();
   const {
     classes = {},
@@ -231,7 +231,10 @@ function TreeViewFinder(props) {
     {
       open,
       onClose: (e, r) => {
-        if (r === "escapeKeyDown" || r === "backdropClick") {
+        if (r === "backdropClick") {
+          return;
+        }
+        if (r === "escapeKeyDown") {
           onClose == null ? void 0 : onClose([]);
           setSelected([]);
         }
@@ -289,8 +292,8 @@ function TreeViewFinder(props) {
   );
 }
 const nestedGlobalSelectorsStyles = toNestedGlobalSelectors(defaultStyles, generateTreeViewFinderClass);
-const TreeViewFinder$1 = styled(TreeViewFinder)(nestedGlobalSelectorsStyles);
+const TreeViewFinder = styled(TreeViewFinderComponant)(nestedGlobalSelectorsStyles);
 export {
-  TreeViewFinder$1 as default,
+  TreeViewFinder,
   generateTreeViewFinderClass
 };

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

@@ -4,5 +4,4 @@
  * 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 { default as TreeViewFinder, generateTreeViewFinderClass } from './TreeViewFinder';
-export type { TreeViewFinderProps, TreeViewFinderNodeProps } from './TreeViewFinder';
+export * from './TreeViewFinder';

package/dist/components/treeViewFinder/index.js

@@ -1,5 +1,5 @@
-import { default as default2, generateTreeViewFinderClass } from "./TreeViewFinder.js";
+import { TreeViewFinder, generateTreeViewFinderClass } from "./TreeViewFinder.js";
 export {
-  default2 as TreeViewFinder,
+  TreeViewFinder,
   generateTreeViewFinderClass
 };

package/dist/hooks/customStates/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * 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 * from './useStateBoolean';
+export * from './useStateNumber';

package/dist/hooks/customStates/index.js

@@ -0,0 +1,6 @@
+import { useStateBoolean } from "./useStateBoolean.js";
+import { useStateNumber } from "./useStateNumber.js";
+export {
+  useStateBoolean,
+  useStateNumber
+};

package/dist/hooks/customStates/useStateBoolean.d.ts

@@ -7,5 +7,4 @@ export type UseStateBooleanReturn = {
     invert: () => void;
     setValue: Dispatch<SetStateAction<boolean>>;
 };
-declare const useStateBoolean: (initialState: boolean | (() => boolean)) => UseStateBooleanReturn;
-export default useStateBoolean;
+export declare const useStateBoolean: (initialState: boolean | (() => boolean)) => UseStateBooleanReturn;

package/dist/hooks/customStates/useStateBoolean.js

@@ -7,5 +7,5 @@ const useStateBoolean = (initialState) => {
   return { value, setTrue, setFalse, invert, setValue };
 };
 export {
-  useStateBoolean as default
+  useStateBoolean
 };

package/dist/hooks/customStates/useStateNumber.d.ts

@@ -7,5 +7,4 @@ export type UseStateNumberReturn = {
     decrement: (step?: number) => void;
     reset: () => void;
 };
-declare const useStateNumber: (initialState?: number | (() => number)) => UseStateNumberReturn;
-export default useStateNumber;
+export declare const useStateNumber: (initialState?: number | (() => number)) => UseStateNumberReturn;

package/dist/hooks/customStates/useStateNumber.js

@@ -7,5 +7,5 @@ const useStateNumber = (initialState = 0) => {
   return { value, increment, decrement, reset, setValue };
 };
 export {
-  useStateNumber as default
+  useStateNumber
 };

package/dist/hooks/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * 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 * from './customStates';
+export * from './useConfidentialityWarning';
+export * from './useDebounce';
+export * from './useIntlRef';
+export * from './useLocalizedCountries';
+export * from './usePredefinedProperties';
+export * from './usePrevious';
+export * from './useSnackMessage';

package/dist/hooks/index.js

@@ -0,0 +1,22 @@
+import { useStateBoolean } from "./customStates/useStateBoolean.js";
+import { useStateNumber } from "./customStates/useStateNumber.js";
+import { useConfidentialityWarning } from "./useConfidentialityWarning.js";
+import { useDebounce } from "./useDebounce.js";
+import { useIntlRef } from "./useIntlRef.js";
+import { getComputedLanguage, getSystemLanguage, useLocalizedCountries } from "./useLocalizedCountries.js";
+import { usePredefinedProperties } from "./usePredefinedProperties.js";
+import { usePrevious } from "./usePrevious.js";
+import { useSnackMessage } from "./useSnackMessage.js";
+export {
+  getComputedLanguage,
+  getSystemLanguage,
+  useConfidentialityWarning,
+  useDebounce,
+  useIntlRef,
+  useLocalizedCountries,
+  usePredefinedProperties,
+  usePrevious,
+  useSnackMessage,
+  useStateBoolean,
+  useStateNumber
+};

package/dist/hooks/useConfidentialityWarning.d.ts

@@ -4,5 +4,4 @@
  * 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/.
  */
-declare const useConfidentialityWarning: () => string | undefined;
-export default useConfidentialityWarning;
+export declare const useConfidentialityWarning: () => string | undefined;

package/dist/hooks/useConfidentialityWarning.js

@@ -10,5 +10,5 @@ const useConfidentialityWarning = () => {
   return confidentialityWarningKey;
 };
 export {
-  useConfidentialityWarning as default
+  useConfidentialityWarning
 };

package/dist/hooks/useDebounce.d.ts

@@ -4,5 +4,4 @@
  * 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/.
  */
-declare const useDebounce: <T extends (...args: any[]) => any>(func: T, delay?: number) => T & import('@mui/utils/debounce').Cancelable;
-export default useDebounce;
+export declare const useDebounce: <T extends (...args: any[]) => any>(func: T, delay?: number) => T & import('@mui/utils/debounce').Cancelable;

package/dist/hooks/useDebounce.js

@@ -10,5 +10,5 @@ const useDebounce = (func, delay = 700) => {
   return debouncedChangeHandler;
 };
 export {
-  useDebounce as default
+  useDebounce
 };

package/dist/hooks/useIntlRef.d.ts

@@ -5,5 +5,4 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 /// <reference types="react" />
-declare function useIntlRef(): import('react').MutableRefObject<import("react-intl").IntlShape>;
-export default useIntlRef;
+export declare function useIntlRef(): import('react').MutableRefObject<import("react-intl").IntlShape>;

package/dist/hooks/useIntlRef.js

@@ -9,5 +9,5 @@ function useIntlRef() {
   return intlRef;
 }
 export {
-  useIntlRef as default
+  useIntlRef
 };

package/dist/hooks/useLocalizedCountries.js

@@ -2,7 +2,7 @@ import { useState, useEffect, useMemo, useCallback } from "react";
 import localizedCountries from "localized-countries";
 import countriesFr from "localized-countries/data/fr";
 import countriesEn from "localized-countries/data/en";
-import { LANG_ENGLISH, LANG_SYSTEM, LANG_FRENCH } from "../components/topBar/TopBar.js";
+import { LANG_ENGLISH, LANG_SYSTEM, LANG_FRENCH } from "../utils/constants/browserConstants.js";
 const supportedLanguages = [LANG_FRENCH, LANG_ENGLISH];
 const getSystemLanguage = () => {
   const systemLanguage = navigator.language.split(/[-_]/)[0];

package/dist/hooks/usePredefinedProperties.d.ts

@@ -1,5 +1,5 @@
-import { EquipmentType, PredefinedProperties } from '../utils/types/types';
+import { EquipmentType } from '../utils';
+import { PredefinedProperties } from '../utils/types/types';
 import { Dispatch, SetStateAction } from 'react';
 
-declare const usePredefinedProperties: (initialType: EquipmentType | null) => [PredefinedProperties, Dispatch<SetStateAction<EquipmentType | null>>];
-export default usePredefinedProperties;
+export declare const usePredefinedProperties: (initialType: EquipmentType | null) => [PredefinedProperties, Dispatch<SetStateAction<EquipmentType | null>>];

package/dist/hooks/usePredefinedProperties.js

@@ -1,10 +1,10 @@
 import { useState, useEffect } from "react";
-import mapEquipmentTypeForPredefinedProperties from "../utils/mapper/equipmentTypesForPredefinedPropertiesMapper.js";
+import { equipmentTypesForPredefinedPropertiesMapper } from "../utils/mapper/equipmentTypesForPredefinedPropertiesMapper.js";
 import { useSnackMessage } from "./useSnackMessage.js";
 import { fetchStudyMetadata } from "../services/appsMetadata.js";
 const fetchPredefinedProperties = async (equipmentType) => {
   var _a;
-  const networkEquipmentType = mapEquipmentTypeForPredefinedProperties(equipmentType);
+  const networkEquipmentType = equipmentTypesForPredefinedPropertiesMapper(equipmentType);
   if (networkEquipmentType === void 0) {
     return Promise.resolve(void 0);
   }
@@ -31,5 +31,5 @@ const usePredefinedProperties = (initialType) => {
   return [equipmentPredefinedProps, setType];
 };
 export {
-  usePredefinedProperties as default
+  usePredefinedProperties
 };

package/dist/hooks/usePrevious.d.ts

@@ -1,2 +1 @@
 export declare function usePrevious<T = undefined>(value: T): T | undefined;
-export default usePrevious;

package/dist/hooks/usePrevious.js

@@ -7,6 +7,5 @@ function usePrevious(value) {
   return ref.current;
 }
 export {
-  usePrevious as default,
   usePrevious
 };

package/dist/hooks/useSnackMessage.js

@@ -1,6 +1,6 @@
 import { useCallback } from "react";
 import { useSnackbar } from "notistack";
-import useIntlRef from "./useIntlRef.js";
+import { useIntlRef } from "./useIntlRef.js";
 function checkInputs(txt, id, values) {
   if (txt && (id || values)) {
     console.warn("Snack inputs should be [*Txt] OR [*Id, *Values]");