Fix metrics maths

Author: JulienLavocat

tools/tpcc-dashboard/src/App.tsx

@@ -5,9 +5,32 @@ import type { NewOrderThroughtputChartData } from './NewOrderThroughtputChart';
 import NewOrderThroughtputChart from './NewOrderThroughtputChart';
 import type { State } from './module_bindings/types';
 
+function getTpmC(state: State): number | null {
+  const measureStartDate = new Date(Number(state.measureStartMs));
+  const measureEndDate = new Date(Number(state.measureEndMs));
+  // If we are in warmup, return "Warmup in progress..."
+  if (Date.now() < measureStartDate.getTime()) {
+    return null;
+  }
+
+  // If the run is in progress we calculate the ellapsed time based on the current time,
+  if (Date.now() < measureEndDate.getTime()) {
+    const ellapsedTimeSec = (Date.now() - measureStartDate.getTime()) / 1000;
+    const tpmC = (Number(state.orderCount) / ellapsedTimeSec) * 60;
+    return Math.trunc(tpmC);
+  }
+
+  // otherwise we calculate it based on the measure start and end date
+  const ellapsedTimeSec =
+    (measureEndDate.getTime() - measureStartDate.getTime()) / 1000;
+  const tpmC = (Number(state.orderCount) / ellapsedTimeSec) * 60;
+  return Math.trunc(tpmC);
+}
+
 function App() {
   const conn = useContext(SpacetimeDBContext);
   const [state, setState] = useState<State | null>(null);
+  const [measuredTransactionCount, setMeasuredTransactionCount] = useState(0);
   const [throughputData, setThroughputData] = useState<
     NewOrderThroughtputChartData[]
   >([]);
@@ -20,6 +43,12 @@ function App() {
     conn?.db.state.onUpdate((_, old, state) => {
       setState(state);
 
+      if (Date.now() >= Number(state.measureStartMs)) {
+        setMeasuredTransactionCount(
+          prev => prev + Number(state.orderCount - old.orderCount)
+        );
+      }
+
       setThroughputData(prevData => {
         const next = [
           ...prevData,
@@ -55,20 +84,24 @@ function App() {
   const measureStartDate = new Date(Number(state.measureStartMs));
   const measureEndDate = new Date(Number(state.measureEndMs));
 
-  // If the is in progress we calculate the ellapsed time based on the current time,
-  // otherwise we calculate it based on the measure end date
-  const ellapsedTimeSec =
-    Date.now() > measureEndDate.getTime()
-      ? (measureEndDate.getTime() - measureStartDate.getTime()) / 1000
-      : (Date.now() - measureStartDate.getTime()) / 1000;
-  const tpmC = (Number(state.orderCount) / ellapsedTimeSec) * 60;
+  const tpmC = getTpmC(state);
 
   return (
     <>
-      <p>measureStartMs: {measureStartDate.toLocaleTimeString()}</p>
-      <p>measureEndMs: {measureEndDate.toLocaleTimeString()}</p>
-      <p>total transactions: {state.orderCount}</p>
-      <p>MQTh: {Math.trunc(tpmC)} tpmC</p>
+      <p>
+        Measured duration: {measureStartDate.toLocaleTimeString()} -{' '}
+        {measureEndDate.toLocaleTimeString()} (
+        {Math.round(
+          (measureEndDate.getTime() - measureStartDate.getTime()) / 60000
+        )}{' '}
+        minutes)
+      </p>
+      <p>Total transactions: {state.orderCount}</p>
+      <p>Measured transactions: {measuredTransactionCount}</p>
+      <p>
+        MQTh:{' '}
+        {tpmC === null ? 'Warmup in progress...' : Math.trunc(tpmC) + ' tpmC'}
+      </p>
       <NewOrderThroughtputChart
         data={throughputData}
         runStartMs={Number(state.runStartMs)}