From eae0eb1d1f21856c6c5428069e692db96fce5e76 Mon Sep 17 00:00:00 2001
From: Maciej Bodek <maciej.bodek@gmail.com>
Date: Tue, 10 Dec 2024 10:28:38 +0100
Subject: [PATCH] rolling append logic - disabled for now

---
 .../src/scenes/Editor/Metrics/index.tsx       |  8 +++++++-
 .../src/scenes/Editor/Metrics/metric.tsx      | 20 ++++++++++++++++++-
 .../src/scenes/Editor/Metrics/utils.ts        | 20 +++++++++++++++++++
 .../Editor/Metrics/widgets/writeThroughput.ts |  1 +
 4 files changed, 47 insertions(+), 2 deletions(-)

diff --git a/packages/web-console/src/scenes/Editor/Metrics/index.tsx b/packages/web-console/src/scenes/Editor/Metrics/index.tsx
index db153d08b..859773a48 100644
--- a/packages/web-console/src/scenes/Editor/Metrics/index.tsx
+++ b/packages/web-console/src/scenes/Editor/Metrics/index.tsx
@@ -11,6 +11,7 @@ import {
   defaultSampleByForDuration,
   getRollingAppendRowLimit,
   MetricViewMode,
+  FetchMode,
 } from "./utils"
 import {
   GridAlt,
@@ -118,6 +119,7 @@ export const Metrics = () => {
   const [metrics, setMetrics] = useState<Metric[]>([])
   const telemetryConfig = useSelector(selectors.telemetry.getConfig)
   const [lastRefresh, setLastRefresh] = useState<number>(new Date().getTime())
+  const [fetchMode, setFetchMode] = useState<FetchMode>(FetchMode.OVERWRITE)
 
   const tabInFocusRef = React.useRef<boolean>(true)
   const refreshRateRef = React.useRef<RefreshRate>()
@@ -182,6 +184,7 @@ export const Metrics = () => {
   const focusListener = useCallback(() => {
     tabInFocusRef.current = true
     if (refreshRateRef.current !== RefreshRate.OFF) {
+      setFetchMode(FetchMode.OVERWRITE)
       setLastRefresh(new Date().getTime())
     }
   }, [refreshRateRef.current])
@@ -195,6 +198,7 @@ export const Metrics = () => {
       intervalRef.current = setInterval(
         () => {
           if (!tabInFocusRef.current) return
+          setFetchMode(FetchMode.ROLLING_APPEND)
           setLastRefresh(new Date().getTime())
         },
         refreshRateInSec > 0 ? refreshRateInSec * 1000 : 0,
@@ -241,7 +245,7 @@ export const Metrics = () => {
         },
       })
       updateBuffer(buffer.id, merged)
-
+      setFetchMode(FetchMode.OVERWRITE)
       setLastRefresh(new Date().getTime())
     }
   }, [metricDuration, refreshRate, metricViewMode])
@@ -414,6 +418,8 @@ export const Metrics = () => {
                 onColorChange={handleColorChange}
                 onMetricDurationChange={setMetricDuration}
                 lastRefresh={lastRefresh}
+                fetchMode={fetchMode}
+                rollingAppendLimit={rollingAppendLimit}
               />
             ))}
       </Charts>
diff --git a/packages/web-console/src/scenes/Editor/Metrics/metric.tsx b/packages/web-console/src/scenes/Editor/Metrics/metric.tsx
index f50e7429b..dd6019131 100644
--- a/packages/web-console/src/scenes/Editor/Metrics/metric.tsx
+++ b/packages/web-console/src/scenes/Editor/Metrics/metric.tsx
@@ -7,6 +7,8 @@ import {
   LastNotNull,
   ResultType,
   hasData,
+  FetchMode,
+  mergeRollingData,
 } from "./utils"
 import { widgets } from "./widgets"
 import { QuestContext } from "../../../providers"
@@ -44,6 +46,8 @@ export const Metric = ({
   onColorChange,
   onMetricDurationChange,
   lastRefresh,
+  fetchMode,
+  rollingAppendLimit,
 }: {
   metric: MetricItem
   metricDuration: MetricDuration
@@ -52,6 +56,8 @@ export const Metric = ({
   onColorChange: (metric: MetricItem, color: string) => void
   onMetricDurationChange: (duration: MetricDuration) => void
   lastRefresh?: number
+  fetchMode: FetchMode
+  rollingAppendLimit: number
 }) => {
   const { quest } = useContext(QuestContext)
   const [loading, setLoading] = useState(false)
@@ -78,6 +84,9 @@ export const Metric = ({
           widgetConfig.getQuery({
             tableId: metric.tableId,
             metricDuration: metricDuration,
+            // ...(fetchMode === FetchMode.ROLLING_APPEND && {
+            //   limit: -rollingAppendLimit,
+            // }),
           }),
         ),
         quest.query<LastNotNull>(
@@ -89,7 +98,16 @@ export const Metric = ({
         const alignedData = widgetConfig.alignData(
           responses[0].data as unknown as ResultType[MetricType],
         )
-        setData(alignedData)
+        if (fetchMode === FetchMode.ROLLING_APPEND) {
+          setData(alignedData)
+          // console.log(
+          //   metric.metricType,
+          //   mergeRollingData(data, alignedData, rollingAppendLimit),
+          // )
+          // setData(mergeRollingData(data, alignedData, rollingAppendLimit))
+        } else {
+          setData(alignedData)
+        }
       }
 
       if (responses[1] && responses[1].type === QuestDB.Type.DQL) {
diff --git a/packages/web-console/src/scenes/Editor/Metrics/utils.ts b/packages/web-console/src/scenes/Editor/Metrics/utils.ts
index 3b63a6cd1..248fcac9d 100644
--- a/packages/web-console/src/scenes/Editor/Metrics/utils.ts
+++ b/packages/web-console/src/scenes/Editor/Metrics/utils.ts
@@ -63,6 +63,11 @@ export enum RefreshRate {
   OFF = "Off",
 }
 
+export enum FetchMode {
+  ROLLING_APPEND = "Rolling append",
+  OVERWRITE = "Overwrite",
+}
+
 export const refreshRatesInSeconds: Record<RefreshRate, number> = {
   [RefreshRate.AUTO]: 0,
   [RefreshRate.OFF]: 0,
@@ -223,3 +228,18 @@ export const hasData = (data?: uPlot.AlignedData) => {
     data[1].length > 0 && data[1].some((value) => value !== null && value !== 0)
   )
 }
+
+export const mergeRollingData = (
+  oldData: uPlot.AlignedData | undefined,
+  alignedData: uPlot.AlignedData,
+  rollingAppendLimit: number,
+) => {
+  const slicedOldData: uPlot.AlignedData = oldData
+    ? oldData.map((d) => d.slice(rollingAppendLimit))
+    : Array(alignedData.length).fill([])
+
+  return alignedData.map((d, i) => [
+    ...slicedOldData[i],
+    ...d,
+  ]) as uPlot.AlignedData
+}
diff --git a/packages/web-console/src/scenes/Editor/Metrics/widgets/writeThroughput.ts b/packages/web-console/src/scenes/Editor/Metrics/widgets/writeThroughput.ts
index 2a0a5acc9..cafdafaff 100644
--- a/packages/web-console/src/scenes/Editor/Metrics/widgets/writeThroughput.ts
+++ b/packages/web-console/src/scenes/Editor/Metrics/widgets/writeThroughput.ts
@@ -29,6 +29,7 @@ where ${tableId ? `tableId = ${tableId} and ` : ""}
 event = 105
 and ${getTimeFilter(minutes)}
 sample by ${sampleBy ?? defaultSampleByForDuration[metricDuration]}
+fill(null)
 ${limit ? `limit ${limit}` : ""}`
   },
   getQueryLastNotNull: (tableId) => `