@centreon/ui 23.10.57 → 23.10.59

package/src/InputField/Select/Autocomplete/Connected/Multi/MultiConnectedAutocompleteField.cypress.spec.tsx

@@ -73,15 +73,13 @@ describe('Multi connected autocomplete', () => {
       });
     });
 
-    cy.matchImageSnapshot(
-      'displays the list when the user clicks on the input'
-    );
+    cy.makeSnapshot('displays the list when the user clicks on the input');
 
     cy.get('@input').click();
 
     cy.get('@listOptions').should('not.exist');
 
-    cy.matchImageSnapshot('hides the list when the user clicks on the input');
+    cy.makeSnapshot('hides the list when the user clicks on the input');
   });
 
   it('displays exactly one option on the list when the user types that option', () => {
@@ -109,7 +107,7 @@ describe('Multi connected autocomplete', () => {
       cy.contains(optionOne).should('be.visible');
     });
 
-    cy.matchImageSnapshot();
+    cy.makeSnapshot();
   });
 
   it('displays all options on the list when the user searches for and selects an option', () => {
@@ -156,6 +154,6 @@ describe('Multi connected autocomplete', () => {
       });
     });
 
-    cy.matchImageSnapshot();
+    cy.makeSnapshot();
   });
 });

package/src/Listing/Listing.cypress.spec.tsx

@@ -105,7 +105,7 @@ describe('Listing', () => {
       });
     });
 
-    cy.matchImageSnapshot();
+    cy.makeSnapshot();
   });
 
   it('collapses the row when the corresponding icon si clicked', () => {
@@ -115,6 +115,6 @@ describe('Listing', () => {
 
     cy.contains('Sub item 100').should('not.exist');
 
-    cy.matchImageSnapshot();
+    cy.makeSnapshot();
   });
 });

package/src/RichTextEditor/RichTextEditor.cypress.spec.tsx

@@ -187,9 +187,11 @@ describe('Rich Text Editor', () => {
     });
 
     it('displays editor when editable props is false and an initialState exist', () => {
-      cy.get('[data-testid="RichTextEditor"]')
-        .invoke('attr', 'contenteditable')
-        .should('eq', 'false');
+      cy.get('[data-testid="RichTextEditor"]').should(
+        'have.attr',
+        'contenteditable',
+        'false'
+      );
       cy.findByLabelText('Undo').should('not.exist');
       cy.findByLabelText('Redo').should('not.exist');
       cy.findByLabelText('bold').should('not.exist');
@@ -214,9 +216,11 @@ describe('Rich Text Editor', () => {
     });
 
     it('displays editor when editable props is false and an initialState exist', () => {
-      cy.get('[data-testid="RichTextEditor"]')
-        .invoke('attr', 'contenteditable')
-        .should('eq', 'true');
+      cy.get('[data-testid="RichTextEditor"]').should(
+        'have.attr',
+        'contenteditable',
+        'false'
+      );
       cy.findByLabelText('Undo').should('be.disabled');
       cy.findByLabelText('Redo').should('be.disabled');
       cy.findByLabelText('bold').should('be.disabled');

package/src/TimePeriods/ResolutionTimePeriod.cypress.spec.tsx

@@ -59,7 +59,7 @@ data.forEach((item) =>
     });
 
     it(`displays correctly the dates design when screen resolution is ${width}px`, () => {
-      cy.matchImageSnapshot(`${width}px`);
+      cy.makeSnapshot(`${width}px`);
     });
   })
 );

package/src/TimePeriods/TimePeriods.cypress.spec.tsx

@@ -499,7 +499,7 @@ testData.forEach((item) =>
           getNextMonth({ currentMonth, labelButton: item.button });
         }
 
-        cy.matchImageSnapshot(
+        cy.makeSnapshot(
           `calendar-${item.timezone}-${
             Object.keys(element)[0]
           }-when-clicking-on-${item.button}`

package/src/api/useGraphQuery/index.ts

@@ -1,19 +1,20 @@
 import { T, always, cond, flatten, isEmpty, join, pipe, pluck } from 'ramda';
 import dayjs from 'dayjs';
 
-import { GraphData, useFetchQuery } from '../..';
+import { LineChartData, useFetchQuery } from '../..';
 
 import { ServiceMetric } from './models';
 
 interface UseMetricsQueryProps {
   baseEndpoint: string;
   metrics: Array<ServiceMetric>;
+  refreshInterval?: number | false;
   timePeriod?: TimePeriod;
 }
 
 interface UseMetricsQueryState {
   end: string;
-  graphData: GraphData | undefined;
+  graphData: LineChartData | undefined;
   isGraphLoading: boolean;
   isMetricIdsEmpty: boolean;
   start: string;
@@ -37,14 +38,15 @@ const getStartEndFromTimePeriod = (
   ])(timePeriod);
 };
 
-interface PerformanceGraphData extends Omit<GraphData, 'global'> {
+interface PerformanceGraphData extends Omit<LineChartData, 'global'> {
   base: number;
 }
 
 const useGraphQuery = ({
   metrics,
   baseEndpoint,
-  timePeriod = TimePeriod.lastDay
+  timePeriod = TimePeriod.lastDay,
+  refreshInterval = false
 }: UseMetricsQueryProps): UseMetricsQueryState => {
   const metricIds = pipe(
     pluck('metrics'),
@@ -65,6 +67,7 @@ const useGraphQuery = ({
     getQueryKey: () => ['graph', metricIds],
     queryOptions: {
       enabled: !isEmpty(metricIds),
+      refetchInterval: refreshInterval,
       suspense: false
     }
   });

package/src/components/CollapsibleItem/useCollapsibleItemStyles.ts

@@ -2,6 +2,7 @@ import { makeStyles } from 'tss-react/mui';
 
 export const useCollapsibleItemStyles = makeStyles()((theme) => ({
   accordion: {
+    backgroundColor: 'transparent',
     border: 'none',
     borderBottom: `1px solid ${theme.palette.divider}`
   },

package/src/index.ts

@@ -144,5 +144,6 @@ export type { ResponseError, CatchErrorProps } from './api/customFetch';
 export * from './utils';
 export { default as FluidTypography } from './Typography/FluidTypography';
 export * from './Dashboard';
-export { default as Graph } from './Graph';
-export type { GraphData } from './Graph/models';
+export * from './Graph';
+export type { LineChartData } from './Graph/common/models';
+export * from './Graph/common/timeSeries';

package/src/utils/useLicenseExpirationWarning.cypress.spec.tsx

@@ -132,6 +132,6 @@ describe('License', () => {
 
     cy.findByText(labelLicenseWarning('centreon-autodiscovery-server', 10));
 
-    cy.matchImageSnapshot();
+    cy.makeSnapshot();
   });
 });