@centreon/ui 23.10.81 → 23.10.83

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@centreon/ui",
-  "version": "23.10.81",
+  "version": "23.10.83",
   "description": "Centreon UI Components",
   "scripts": {
     "eslint": "eslint ./src --ext .js,.jsx,.ts,.tsx --max-warnings 0",

package/src/api/useGraphQuery/index.ts

@@ -1,3 +1,5 @@
+import { useRef } from 'react';
+
 import { equals, has, isEmpty, pluck } from 'ramda';
 import dayjs from 'dayjs';
 
@@ -13,6 +15,7 @@ interface CustomTimePeriod {
 interface UseMetricsQueryProps {
   baseEndpoint: string;
   metrics: Array<string>;
+  refreshCount?: number;
   refreshInterval?: number | false;
   resources?: Array<Resource>;
   timePeriod?: {
@@ -72,7 +75,8 @@ const useGraphQuery = ({
   timePeriod = {
     timePeriodType: 1
   },
-  refreshInterval = false
+  refreshInterval = false,
+  refreshCount
 }: UseMetricsQueryProps): UseMetricsQueryState => {
   const timePeriodToUse = equals(timePeriod?.timePeriodType, -1)
     ? {
@@ -115,7 +119,8 @@ const useGraphQuery = ({
       'graph',
       JSON.stringify(definedMetrics),
       JSON.stringify(resources),
-      timePeriod
+      timePeriod,
+      refreshCount || 0
     ],
     queryOptions: {
       enabled: areResourcesFullfilled(resources) && !isEmpty(definedMetrics),
@@ -124,14 +129,19 @@ const useGraphQuery = ({
     }
   });
 
-  const formattedGraphData = graphData
+  const data = useRef<PerformanceGraphData | undefined>(undefined);
+  if (graphData) {
+    data.current = graphData;
+  }
+
+  const formattedGraphData = data.current
     ? {
         global: {
-          base: graphData.base,
+          base: data.current.base,
           title: ''
         },
-        metrics: graphData.metrics,
-        times: graphData.times
+        metrics: data.current.metrics,
+        times: data.current.times
       }
     : undefined;
 

package/src/components/Form/Dashboard/GlobalRefreshFieldOption.tsx

@@ -4,9 +4,12 @@ import { FormikValues, useFormikContext } from 'formik';
 import { useTranslation } from 'react-i18next';
 import { isEmpty } from 'ramda';
 import pluralize from 'pluralize';
+import { useAtomValue } from 'jotai';
 
 import { Typography } from '@mui/material';
 
+import { refreshIntervalAtom } from '@centreon/ui-context';
+
 import { TextField } from '../../..';
 
 import {
@@ -22,7 +25,9 @@ const GlobalRefreshFieldOption = (): JSX.Element => {
 
   const { values, setFieldValue } = useFormikContext<FormikValues>();
 
-  const value = values.refresh.interval;
+  const platformRefreshInterval = useAtomValue(refreshIntervalAtom);
+
+  const value = values.refresh?.interval;
 
   const changeInput = (event: ChangeEvent<HTMLInputElement>): void => {
     setFieldValue(
@@ -43,7 +48,7 @@ const GlobalRefreshFieldOption = (): JSX.Element => {
         }}
         size="compact"
         type="number"
-        value={value || ''}
+        value={value || platformRefreshInterval}
         onChange={changeInput}
       />
       <Typography>{pluralize(t(labelSeconds), value)}</Typography>

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

@@ -30,7 +30,8 @@ const useStyles = makeStyles<{
       maxWidth: 'unset',
       position: 'absolute',
       right: props?.right ?? 0,
-      top: props?.top ?? 0
+      top: props?.top ?? 0,
+      transition: theme.transitions.create('left')
     },
     '&[data-size="large"] .MuiDialog-paper': {
       maxWidth: '640px',