Event history refactor

.gitignore

@@ -8,6 +8,7 @@ tmp/
 IGNORE-ME*
 .pyre/*
 .draft
+.coverage
 
 # local env files
 .env*.local

.pre-commit-config.yaml

@@ -19,6 +19,19 @@ repos:
         [
           "-rn", # Only display messages
         ]
+    - id: pytest
+      name: pytest
+      language: python
+      entry: pytest
+      types: [python]
+      pass_filenames: false
+    - id : pytest-coverage
+      name: coverage
+      language: python
+      entry: coverage report
+      types: [python]
+      pass_filenames: false
+      args: [--fail-under=9] # increase this over time
     - id: pyre-check
       name: pyre-check
       entry: pyre check

.pyre_configuration

@@ -1,6 +1,7 @@
 {
   "site_package_search_strategy": "pep561",
   "source_directories": [
-    "sidecar"
+    {"import_root": ".", "source": "sidecar"}
   ]
+
 }

pyproject.toml

@@ -25,6 +25,8 @@ dependencies=[
   "pre-commit",
   "cryptography",
   "httpx",
+  "pytest",
+  "pytest-cov",
 ]
 
 [project.scripts]
@@ -50,6 +52,15 @@ disable = [
   # "R0913",
 ]
 
+[tool.pylint.main]
+source-roots = ["sidecar"]
+
 [tool.black]
 target-version = ["py311", ]
 include = '\.pyi?$'
+
+[tool.pytest.ini_options]
+addopts = [
+    "--import-mode=importlib",
+]
+pythonpath = "sidecar"

server/app/query/servers.tsx

@@ -59,11 +59,20 @@ export const initialStatsByRemoteServer: StatsByRemoteServer =
     Object.values(RemoteServerNames).map((serverName) => [[serverName], []]),
   );
 
-export type RunTimeByRemoteServer = {
+export type StartTimeByRemoteServer = {
   [key in RemoteServerNames]: number | null;
 };
 
-export const initialRunTimeByRemoteServer: RunTimeByRemoteServer =
+export type EndTimeByRemoteServer = {
+  [key in RemoteServerNames]: number | null;
+};
+
+export const initialStartTimeByRemoteServer: StartTimeByRemoteServer =
+  Object.fromEntries(
+    Object.values(RemoteServerNames).map((serverName) => [[serverName], null]),
+  );
+
+export const initialEndTimeByRemoteServer: StartTimeByRemoteServer =
   Object.fromEntries(
     Object.values(RemoteServerNames).map((serverName) => [[serverName], null]),
   );
@@ -179,6 +188,8 @@ export class RemoteServer {
   openStatusSocket(
     id: string,
     setStatus: React.Dispatch<React.SetStateAction<StatusByRemoteServer>>,
+    setStartTime: React.Dispatch<React.SetStateAction<StartTimeByRemoteServer>>,
+    setEndTime: React.Dispatch<React.SetStateAction<EndTimeByRemoteServer>>,
   ): WebSocket {
     const ws = this.statusSocket(id);
 
@@ -189,8 +200,29 @@ export class RemoteServer {
       }));
     };
 
+    const updateStartTime = (runTime: number) => {
+      setStartTime((prevStartTime) => {
+        return {
+          ...prevStartTime,
+          [this.remoteServerName]: runTime,
+        };
+      });
+    };
+
+    const updateEndTime = (runTime: number) => {
+      setEndTime((prevEndTime) => {
+        return {
+          ...prevEndTime,
+          [this.remoteServerName]: runTime,
+        };
+      });
+    };
+
     ws.onmessage = (event) => {
-      const statusString: string = JSON.parse(event.data).status;
+      const eventData = JSON.parse(event.data);
+      updateStartTime(eventData.start_time);
+      updateEndTime(eventData.end_time ?? null);
+      const statusString: string = eventData.status;
       const status = getStatusFromString(statusString);
       updateStatus(status);
     };
@@ -207,7 +239,6 @@ export class RemoteServer {
   openStatsSocket(
     id: string,
     setStats: React.Dispatch<React.SetStateAction<StatsByRemoteServer>>,
-    setRunTime: React.Dispatch<React.SetStateAction<RunTimeByRemoteServer>>,
   ): WebSocket {
     const ws = this.statsSocket(id);
 
@@ -221,18 +252,8 @@ export class RemoteServer {
       });
     };
 
-    const updateRunTime = (runTime: number) => {
-      setRunTime((prevRunTime) => {
-        return {
-          ...prevRunTime,
-          [this.remoteServerName]: runTime,
-        };
-      });
-    };
-
     ws.onmessage = (event) => {
       const eventData = JSON.parse(event.data);
-      updateRunTime(eventData.run_time);
       const statsDataPoint: StatsDataPoint = {
         timestamp: eventData.timestamp,
         memoryRSSUsage: eventData.memory_rss_usage,

server/app/query/view/[id]/components.tsx

@@ -1,3 +1,4 @@
+import { useEffect, useState, useRef } from "react";
 import { Source_Code_Pro } from "next/font/google";
 import clsx from "clsx";
 import { ChevronDownIcon, ChevronRightIcon } from "@heroicons/react/24/solid";
@@ -65,12 +66,37 @@ function secondsToTime(e: number) {
 
 export function RunTimePill({
   status,
-  runTime,
+  startTime,
+  endTime,
 }: {
   status: Status;
-  runTime: number | null;
+  startTime: number | null;
+  endTime: number | null;
 }) {
+  const [runTime, setRunTime] = useState<number | null>(null);
   const runTimeStr = runTime ? secondsToTime(runTime) : "N/A";
+  const intervalId = useRef<ReturnType<typeof setTimeout> | null>(null);
+
+  useEffect(() => {
+    if (intervalId.current !== null) {
+      // any time startTime or endTime change, we remove the old setInterval
+      // which runs the timer. if a new one is needed, it's created.
+      clearTimeout(intervalId.current);
+    }
+    if (startTime === null) {
+      setRunTime(null);
+    } else {
+      if (endTime !== null && startTime !== null) {
+        setRunTime(endTime - startTime);
+      } else {
+        let newIntervalId = setInterval(() => {
+          setRunTime(Date.now() / 1000 - startTime);
+        }, 1000);
+        intervalId.current = newIntervalId;
+      }
+    }
+  }, [startTime, endTime]);
+
   return (
     <div className={clsx(`rounded-full px-2`, StatusClassNameMixins[status])}>
       {runTimeStr}

server/app/query/view/[id]/page.tsx

@@ -16,10 +16,12 @@ import {
   IPARemoteServers, //hack until the queryId is stored in a DB
   StatusByRemoteServer,
   StatsByRemoteServer,
-  RunTimeByRemoteServer,
+  StartTimeByRemoteServer,
+  EndTimeByRemoteServer,
   initialStatusByRemoteServer,
   initialStatsByRemoteServer,
-  initialRunTimeByRemoteServer,
+  initialStartTimeByRemoteServer,
+  initialEndTimeByRemoteServer,
 } from "@/app/query/servers";
 import { StatsComponent } from "@/app/query/view/[id]/charts";
 import { JSONSafeParse } from "@/app/utils";
@@ -48,8 +50,10 @@ export default function QueryPage({ params }: { params: { id: string } }) {
     useState<StatusByRemoteServer>(initialStatusByRemoteServer);
   const [statsByRemoteServer, setStatsByRemoteServer] =
     useState<StatsByRemoteServer>(initialStatsByRemoteServer);
-  const [runTimeByRemoteServer, setRunTimeByRemoteServer] =
-    useState<RunTimeByRemoteServer>(initialRunTimeByRemoteServer);
+  const [startTimeByRemoteServer, setStartTimeByRemoteServer] =
+    useState<StartTimeByRemoteServer>(initialStartTimeByRemoteServer);
+  const [endTimeByRemoteServer, setEndTimeByRemoteServer] =
+    useState<EndTimeByRemoteServer>(initialEndTimeByRemoteServer);
 
   function flipLogsHidden() {
     setLogsHidden(!logsHidden);
@@ -108,11 +112,12 @@ export default function QueryPage({ params }: { params: { id: string } }) {
         const statusWs = remoteServer.openStatusSocket(
           query.uuid,
           setStatusByRemoteServer,
+          setStartTimeByRemoteServer,
+          setEndTimeByRemoteServer,
         );
         const statsWs = remoteServer.openStatsSocket(
           query.uuid,
           setStatsByRemoteServer,
-          setRunTimeByRemoteServer,
         );
         webSockets = [...webSockets, loggingWs, statusWs, statsWs];
       }
@@ -212,8 +217,11 @@ export default function QueryPage({ params }: { params: { id: string } }) {
             <dl className="grid grid-cols-1 gap-2 sm:grid-cols-2 lg:grid-cols-4">
               {Object.values(IPARemoteServers).map(
                 (remoteServer: RemoteServer) => {
-                  const runTime =
-                    runTimeByRemoteServer[remoteServer.remoteServerName];
+                  const startTime =
+                    startTimeByRemoteServer[remoteServer.remoteServerName];
+                  const endTime =
+                    endTimeByRemoteServer[remoteServer.remoteServerName];
+
                   const status =
                     statusByRemoteServer[remoteServer.remoteServerName] ??
                     Status.UNKNOWN;
@@ -227,7 +235,11 @@ export default function QueryPage({ params }: { params: { id: string } }) {
                         {remoteServer.toString()} Run Time
                       </dt>
                       <dd>
-                        <RunTimePill status={status} runTime={runTime} />
+                        <RunTimePill
+                          status={status}
+                          startTime={startTime}
+                          endTime={endTime}
+                        />
                       </dd>
                     </div>
                   );