fix: do not call dateRangeChange in live mode

awslabs · Dec 28, 2022 · bdfd5a6 · bdfd5a6
1 parent efcfa05
commit bdfd5a6
Show file tree

Hide file tree

Showing 5 changed files with 27 additions and 8 deletions.
diff --git a/packages/synchro-charts/src/components/sc-table/sc-table.tsx b/packages/synchro-charts/src/components/sc-table/sc-table.tsx
@@ -5,7 +5,7 @@ import { isThreshold } from '../charts/common/annotations/utils';
 import { Trend } from '../charts/common/trends/types';
 import { Annotations, ChartConfig, Threshold } from '../charts/common/types';
 import { constructTableData, Row } from './constructTableData';
-import { viewportEndDate, viewportStartDate } from '../../utils/viewPort';
+import { viewportEndDate, viewportStartDate, isInLiveMode } from '../../utils/viewPort';
 import { isMinimalStaticViewport } from '../../utils/predicates';
 import { parseDuration } from '../../utils/time';
 import { webGLRenderer } from '../sc-webgl-context/webglContext';
@@ -53,8 +53,8 @@ export class ScTable implements ChartConfig {
     const hasViewPortChanged =
       viewportStartDate(this.viewport).getTime() !== start.getTime() ||
       viewportEndDate(this.viewport).getTime() !== end.getTime();
-    const isInLiveMode = Boolean(duration);
-    if (hasViewPortChanged && !isInLiveMode) {
+    const inLiveMode = isInLiveMode(this.viewport);
+    if (hasViewPortChanged && !inLiveMode) {
       this.onDateRangeChange([start, end, this.viewport.group]);
     }
     // Update active viewport

diff --git a/packages/synchro-charts/src/components/sc-widget-grid/sc-widget-grid.tsx b/packages/synchro-charts/src/components/sc-widget-grid/sc-widget-grid.tsx
@@ -15,7 +15,7 @@ import { getThresholds } from '../charts/common/annotations/utils';
 import { breachedThreshold } from '../charts/common/annotations/breachedThreshold';
 import { streamPairs } from '../../utils/streamPairs';
 import { RenderCell } from './types';
-import { viewportEndDate, viewportStartDate } from '../../utils/viewPort';
+import { viewportEndDate, viewportStartDate, isInLiveMode } from '../../utils/viewPort';
 import { Annotations, ChartConfig, Threshold, WidgetConfigurationUpdate } from '../charts/common/types';
 import { LabelsConfig } from '../common/types';
 import { DATA_ALIGNMENT } from '../charts/common/constants';
@@ -120,8 +120,8 @@ export class ScWidgetGrid implements ChartConfig {
     const hasViewPortChanged =
       viewportStartDate(this.viewport).getTime() !== start.getTime() ||
       viewportEndDate(this.viewport).getTime() !== end.getTime();
-    const isInLiveMode = Boolean(duration);
-    if (hasViewPortChanged && !isInLiveMode) {
+    const inLiveMode = isInLiveMode(this.viewport);
+    if (hasViewPortChanged && !inLiveMode) {
       this.onDateRangeChange([start, end, this.viewport.group]);
     }
     // Update active viewport

diff --git a/packages/synchro-charts/src/components/viewportHandler/viewportHandler.ts b/packages/synchro-charts/src/components/viewportHandler/viewportHandler.ts
@@ -117,7 +117,12 @@ export class ViewportHandler<T extends ViewPortManager> {
      * the current viewport groups time span.
      */
     if (manager.viewportGroup && this.viewportMap[manager.viewportGroup] && shouldSync) {
-      manager.updateViewPort(this.viewportMap[manager.viewportGroup]);
+      const shouldBlockDateRangeChangedEvent = Boolean(duration);
+      manager.updateViewPort({
+        ...this.viewportMap[manager.viewportGroup],
+        duration,
+        shouldBlockDateRangeChangedEvent
+      });
     }
     // If duration is not null, this means that we want to have live mode
     if (duration != null) {

diff --git a/packages/synchro-charts/src/utils/viewPort.spec.ts b/packages/synchro-charts/src/utils/viewPort.spec.ts
@@ -1,5 +1,5 @@
 import { DAY_IN_MS } from './time';
-import { viewportEndDate, viewportStartDate } from './viewPort';
+import { viewportEndDate, viewportStartDate, isInLiveMode } from './viewPort';
 
 const mockCurrentTime = (mockedDate: Date) => {
   // @ts-ignore
@@ -31,3 +31,13 @@ describe('viewportEnd', () => {
     expect(viewportEndDate({ duration: DAY_IN_MS })).toEqual(TIME);
   });
 });
+
+describe('isInLiveMode', () => {
+  it('returns true when in live mode', () => {
+    expect(isInLiveMode({ duration: 60000 })).toBeTrue();
+  });
+
+  it('returns false when viewport is static', () => {
+    expect(isInLiveMode({ start: new Date(), end: new Date() })).toBeFalse();
+  });
+});
diff --git a/packages/synchro-charts/src/utils/viewPort.ts b/packages/synchro-charts/src/utils/viewPort.ts
@@ -10,3 +10,7 @@ export const viewportStartDate = (viewportConfig: MinimalViewPortConfig): Date =
 export const viewportEndDate = (viewportConfig: MinimalViewPortConfig): Date => {
   return isMinimalStaticViewport(viewportConfig) ? new Date(viewportConfig.end) : new Date(Date.now());
 };
+
+export const isInLiveMode = (viewport: MinimalViewPortConfig): boolean => {
+  return !isMinimalStaticViewport(viewport) && Boolean(viewport.duration);
+};