@centreon/ui 25.10.9 → 25.10.11

package/src/ThemeProvider/index.tsx

@@ -1,12 +1,11 @@
 import { useAtomValue } from 'jotai';
-import { equals, mergeDeepRight } from 'ramda';
+import { equals } from 'ramda';
 import { CSSInterpolation } from 'tss-react';
 
 import {
   ButtonProps,
   InputBaseProps,
   ThemeProvider as MuiThemeProvider,
-  PaletteOptions,
   StyledEngineProvider,
   Theme,
   createTheme
@@ -27,7 +26,7 @@ import { ReactNode, useMemo } from 'react';
 import { getPalette } from './palettes';
 
 declare module '@mui/styles/defaultTheme' {
-  interface DefaultTheme extends Theme {}
+  interface DefaultTheme extends Theme { }
 }
 
 declare module '@mui/material/TextField' {
@@ -199,14 +198,14 @@ export const getTheme = (mode: ThemeMode): ThemeOptions => ({
       styleOverrides: {
         root: ({ theme }) => ({
           '&:hover, &.Mui-selected, &.Mui-selected:hover, &.Mui-selected:focus':
-            {
-              background: equals(theme.palette.mode, ThemeMode.dark)
-                ? theme.palette.primary.dark
-                : theme.palette.primary.light,
-              color: equals(theme.palette.mode, ThemeMode.dark)
-                ? theme.palette.common.white
-                : theme.palette.primary.main
-            },
+          {
+            background: equals(theme.palette.mode, ThemeMode.dark)
+              ? theme.palette.primary.dark
+              : theme.palette.primary.light,
+            color: equals(theme.palette.mode, ThemeMode.dark)
+              ? theme.palette.common.white
+              : theme.palette.primary.main
+          },
           fontSize: theme.typography.body2.fontSize
         })
       }
@@ -223,12 +222,12 @@ export const getTheme = (mode: ThemeMode): ThemeOptions => ({
       styleOverrides: {
         root: ({ theme }) => ({
           [`[role="tooltip"] &, &.MuiMenu-paper, &.${autocompleteClasses.paper}`]:
-            {
-              backgroundColor: theme.palette.background.default,
-              border: 'none',
-              borderRadius: `${theme.shape.borderRadius}px`,
-              boxShadow: theme.shadows[3]
-            }
+          {
+            backgroundColor: theme.palette.background.default,
+            border: 'none',
+            borderRadius: `${theme.shape.borderRadius}px`,
+            boxShadow: theme.shadows[3]
+          }
         })
       }
     },
@@ -258,23 +257,15 @@ export const getTheme = (mode: ThemeMode): ThemeOptions => ({
 
 interface Props {
   children: ReactNode;
-  overrideTheme?: {
-    light: Partial<PaletteOptions>;
-    dark: Partial<PaletteOptions>;
-  };
 }
 
-const ThemeProvider = ({ children, overrideTheme }: Props): JSX.Element => {
+const ThemeProvider = ({ children }: Props): JSX.Element => {
   const { themeMode } = useAtomValue(userAtom);
 
-  const theme = useMemo(() => {
-    const overrideThemeByMode = overrideTheme?.[themeMode || 'light'];
-    return createTheme(
-      mergeDeepRight(getTheme(themeMode || ThemeMode.light), {
-        palette: overrideThemeByMode || {}
-      })
-    );
-  }, [themeMode, overrideTheme]);
+  const theme = useMemo(
+    () => createTheme(getTheme(themeMode || ThemeMode.light)),
+    [themeMode]
+  );
 
   return (
     <StyledEngineProvider injectFirst enableCssLayer>

package/src/ThemeProvider/tailwindcss.css

@@ -25,7 +25,7 @@
   /* =============
      COLOR SYSTEM
      ============= */
-
+  
   /* Action colors */
   --color-action-acknowledged: #745f35;
   --color-action-acknowledged-background: #dfd2b9;
@@ -43,7 +43,7 @@
   --color-action-in-downtime-background: #e5d8f3;
   --color-action-selected: rgba(102, 102, 102, 0.3);
   --color-action-selected-opacity: 0.3;
-
+  
   /* Background colors */
   --color-background-default: #f4f4f4;
   --color-background-listing-header: #666666;
@@ -52,18 +52,18 @@
   --color-background-paper: #ffffff;
   --color-background-tooltip: #434e58;
   --color-background-widget: #f8f8f8;
-
+  
   /* Chip colors */
   --color-chip-error: #ff6666;
   --color-chip-info: #1588d1;
   --color-chip-neutral: #6da4e4;
   --color-chip-success: #88b922;
   --color-chip-warning: #fd9b27;
-
+  
   /* Utility colors */
   --color-divider: #e3e3e3;
   --color-error-main: #ff4a4a;
-
+  
   /* Header colors */
   --color-header-page-action-background-active: #1975d10f;
   --color-header-page-action-background-default: #ffffff00;
@@ -90,10 +90,10 @@
   --color-header-menu-item-color-active: #3e85d5;
   --color-header-menu-item-color-default: #1b2127;
   --color-header-menu-item-color-hover: #101418;
-
+  
   /* State colors */
   --color-pending-main: #1ebeb3;
-
+  
   /* Primary & Secondary colors */
   --color-primary-main: #2e68aa;
   --color-primary-light: #cde7fc;
@@ -101,7 +101,7 @@
   --color-secondary-main: #c772d6;
   --color-secondary-light: #e5a5f0;
   --color-secondary-dark: #ac28c1;
-
+  
   /* Status colors */
   --color-status-background-error: #ff6666;
   --color-status-background-none: --alpha(#2e68aa / 10%);
@@ -110,7 +110,7 @@
   --color-stauts-background-unknown: #e3e3e3;
   --color-status-background-warning: #fd9b27;
   --color-success-main: #88b922;
-
+  
   /* Text colors */
   --color-text-disabled: #999999;
   --color-text-primary: #000000;
@@ -118,7 +118,7 @@
   --color-warning-main: #fd9b27;
   --color-warning-light: #fcc481;
   --color-warning-dark: #fc7e00;
-
+  
   /* Base colors */
   --color-white: #ffffff;
   --color-black: #000000;

package/src/components/Form/AccessRights/ShareInput/ShareInput.tsx

@@ -8,6 +8,7 @@ import { SelectEntry, SingleConnectedAutocompleteField } from '../../../..';
 import RoleSelectField from '../common/RoleSelectField';
 import { Endpoints, Labels } from '../models';
 
+import { ReactElement } from 'react';
 import ContactSwitch from './ContactSwitch';
 import { useShareInputStyles } from './ShareInput.styles';
 import useShareInput from './useShareInput';
@@ -18,18 +19,18 @@ interface Props {
   roles: Array<SelectEntry>;
 }
 
-const ShareInput = ({ labels, endpoints, roles }: Props): JSX.Element => {
+const ShareInput = ({ labels, endpoints, roles }: Props): ReactElement => {
   const { t } = useTranslation();
   const { classes } = useShareInputStyles();
 
   const {
-    renderOption,
     selectedContact,
     getOptionDisabled,
     getEndpoint,
     selectContact,
     isContactGroup,
     selectedRole,
+    getRenderedOptionText,
     setSelectedRole,
     add,
     changeIdValue
@@ -46,6 +47,7 @@ const ShareInput = ({ labels, endpoints, roles }: Props): JSX.Element => {
           disableClearable={false}
           field="name"
           getEndpoint={getEndpoint}
+          getRenderedOptionText={getRenderedOptionText}
           getOptionDisabled={getOptionDisabled}
           label={t(
             isContactGroup
@@ -53,7 +55,6 @@ const ShareInput = ({ labels, endpoints, roles }: Props): JSX.Element => {
               : t(labels.autocompleteContact)
           )}
           queryKey={isContactGroup ? labels.contactGroup : labels.contact}
-          renderOption={renderOption}
           value={selectedContact}
           onChange={selectContact}
         />

package/src/components/Form/AccessRights/ShareInput/useShareInput.tsx

@@ -1,10 +1,15 @@
-import { Dispatch, SetStateAction, useEffect, useState } from 'react';
+import {
+  Dispatch,
+  ReactElement,
+  SetStateAction,
+  useEffect,
+  useState
+} from 'react';
 
 import { useAtomValue, useSetAtom } from 'jotai';
 import { equals, includes, isNil } from 'ramda';
 
 import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import { ListItemText, MenuItem } from '@mui/material';
 
 import { SelectEntry, buildListingEndpoint } from '../../../..';
 import {
@@ -20,7 +25,7 @@ interface UseShareInputState {
   getEndpoint: (parameters) => string;
   getOptionDisabled: (option) => boolean;
   isContactGroup: boolean;
-  renderOption: (attr, option) => JSX.Element;
+  getRenderedOptionText: (option: unknown) => ReactElement | string;
   selectContact: (_, entry) => void;
   selectedContact: AccessRightInitialValues | null;
   selectedRole: string;
@@ -40,7 +45,7 @@ const useShareInput = (endpoints: Endpoints): UseShareInputState => {
 
   const selectContact = (_, entry): void => {
     setSelectedContact(entry);
-    if (equals('editor', entry.most_permissive_role)) {
+    if (equals('editor', entry?.most_permissive_role)) {
       return;
     }
     setSelectedRole('viewer');
@@ -71,14 +76,14 @@ const useShareInput = (endpoints: Endpoints): UseShareInputState => {
       }
     });
 
-  const renderOption = (attr, option): JSX.Element => {
+  const getRenderedOptionText = (option): ReactElement => {
     return (
-      <MenuItem {...attr}>
-        <ListItemText>{option.name}</ListItemText>
-        {includes(option.id, accessRightIds) && (
+      <>
+        {option?.name}
+        {includes(option?.id, accessRightIds) && (
           <CheckCircleIcon color="success" />
         )}
-      </MenuItem>
+      </>
     );
   };
 
@@ -102,7 +107,7 @@ const useShareInput = (endpoints: Endpoints): UseShareInputState => {
     getEndpoint,
     getOptionDisabled,
     isContactGroup,
-    renderOption,
+    getRenderedOptionText,
     selectContact,
     selectedContact,
     selectedRole,

package/src/components/Menu/Button/MenuButton.tsx

@@ -5,13 +5,12 @@ import {
   Menu as MenuIcon
 } from '@mui/icons-material';
 
+import { useStyles } from './MenuButton.styles';
 import { AriaLabelingAttributes } from '../../../@types/aria-attributes';
 import { DataTestAttributes } from '../../../@types/data-attributes';
 import { Button, ButtonProps } from '../../Button';
 import { useMenu } from '../useMenu';
 
-import { useStyles } from './MenuButton.styles';
-
 type MenuButtonProps = {
   ariaLabel?: string;
   children?: ReactNode;

package/src/components/Modal/Modal.styles.ts

@@ -72,7 +72,8 @@ const useStyles = makeStyles<{
       opacity: 0.6
     },
     top: theme.spacing(1)
-  }
+  },
+  
 }));
 
 export { useStyles };

package/src/components/Modal/ModalHeader.tsx

@@ -16,11 +16,7 @@ const ModalHeader = ({
 }: ModalHeaderProps & DialogTitleProps): ReactElement => {
   return (
     <div className={modalHeader}>
-      <MuiDialogTitle
-        className="p-0 font-bold text-2xl"
-        color="primary"
-        {...rest}
-      >
+      <MuiDialogTitle className="p-0 font-bold text-2xl" color="primary" {...rest}>
         {children}
       </MuiDialogTitle>
     </div>

package/src/Graph/mockedData/dataWithMissingPoint.json

@@ -1,74 +0,0 @@
-{
-  "global": {},
-  "metrics": [
-    {
-      "metric": "count",
-      "metric_id": 1,
-      "legend": "count",
-      "displayAs": "bar",
-      "ds_data": {
-        "ds_stack": true,
-        "ds_transparency": 0,
-        "ds_filled": false,
-        "ds_color_area": "#4269d0",
-        "ds_color_line": "#4269d0"
-      },
-      "datasourceOptions": {
-        "field": null,
-        "group_by": null,
-        "op": "count-doc",
-        "query": "severity_text:\"Fatal\" OR severity_text:\"Error\"",
-        "period": 3600
-      },
-      "data": [
-        217, 270, 293, 300, 303, 295, 298, 283, 299, 299, 297, 285, 270, 248,
-        274, 292, 284, 47
-      ]
-    },
-    {
-      "metric": "count",
-      "metric_id": 2,
-      "legend": "count",
-      "displayAs": "bar",
-      "ds_data": {
-        "ds_stack": true,
-        "ds_transparency": 0,
-        "ds_filled": false,
-        "ds_color_area": "#efb118",
-        "ds_color_line": "#efb118"
-      },
-      "datasourceOptions": {
-        "field": null,
-        "group_by": null,
-        "op": "count-doc",
-        "query": "",
-        "period": 3600
-      },
-      "data": [
-        32, 825, 939, 922, 918, 939, 943, 947, 946, 909, 931, 939, 883, 907,
-        928, 904, 923, 893, 139
-      ]
-    }
-  ],
-  "times": [
-    "2025-10-04T16:19:30.000Z",
-    "2025-10-04T16:20:00.000Z",
-    "2025-10-04T16:20:30.000Z",
-    "2025-10-04T16:21:00.000Z",
-    "2025-10-04T16:21:30.000Z",
-    "2025-10-04T16:22:00.000Z",
-    "2025-10-04T16:22:30.000Z",
-    "2025-10-04T16:23:00.000Z",
-    "2025-10-04T16:23:30.000Z",
-    "2025-10-04T16:24:00.000Z",
-    "2025-10-04T16:24:30.000Z",
-    "2025-10-04T16:25:00.000Z",
-    "2025-10-04T16:25:30.000Z",
-    "2025-10-04T16:26:00.000Z",
-    "2025-10-04T16:26:30.000Z",
-    "2025-10-04T16:27:00.000Z",
-    "2025-10-04T16:27:30.000Z",
-    "2025-10-04T16:28:00.000Z",
-    "2025-10-04T16:28:30.000Z"
-  ]
-}