@centreon/ui 24.9.5 → 24.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@centreon/ui",
-  "version": "24.9.5",
+  "version": "24.10.0",
   "description": "Centreon UI Components",
   "scripts": {
     "update:deps": "pnpx npm-check-updates -i --format group",

package/src/Graph/BarChart/BarChart.cypress.spec.tsx

@@ -4,6 +4,7 @@ import { useAtomValue } from 'jotai';
 
 import { userAtom } from '@centreon/ui-context';
 
+import dataLastWeek from '../mockedData/lastWeek.json';
 import dataPingService from '../mockedData/pingService.json';
 import dataPingServiceMixedStacked from '../mockedData/pingServiceMixedStacked.json';
 import dataPingServiceStacked from '../mockedData/pingServiceStacked.json';
@@ -29,10 +30,10 @@ const initialize = ({
   tooltip,
   axis,
   orientation,
-  barStyle
+  barStyle,
 }: Pick<
   BarChartProps,
-  'data' | 'legend' | 'axis' | 'barStyle' | 'orientation' | 'tooltip'
+  'data' | 'legend' | 'axis' | 'barStyle' | 'orientation' | 'tooltip' | 'start'
 >): void => {
   cy.adjustViewport();
 
@@ -280,4 +281,14 @@ describe('Bar chart', () => {
 
     cy.makeSnapshot();
   });
+
+  it('displays the bottom axis correctly when data starts from several days ago', () => {
+    initialize({
+      data: dataLastWeek,
+      orientation: 'horizontal'
+    });
+
+    cy.contains('05/31/2023').should('be.visible');
+    cy.contains('06/07/2023').should('be.visible');
+  });
 });

package/src/Graph/common/Axes/index.tsx

@@ -1,6 +1,6 @@
 import { Axis } from '@visx/visx';
 import { ScaleLinear } from 'd3-scale';
-import { equals, isNil } from 'ramda';
+import { equals, head, isNil, last } from 'ramda';
 
 import { useLocaleDateTimeFormat } from '@centreon/ui';
 
@@ -48,7 +48,10 @@ const Axes = ({
 
   const xTickCount = Math.min(Math.ceil(width / 82), 12);
 
-  const [start, end] = xScale.domain();
+  const domain = xScale.domain();
+
+  const start = head(domain);
+  const end = last(domain);
 
   const tickFormat =
     data?.axisX?.xAxisTickFormat ?? getXAxisTickFormat({ end, start });