diff --git a/ui/dashboard/src/hooks/useDashboardState.tsx b/ui/dashboard/src/hooks/useDashboardState.tsx
index 7c8dd1544..129d62765 100644
--- a/ui/dashboard/src/hooks/useDashboardState.tsx
+++ b/ui/dashboard/src/hooks/useDashboardState.tsx
@@ -113,10 +113,10 @@ const reducer = (state: IDashboardContext, action) => {
         };
       }
 
-      const res = {
+      return {
         ...state,
         error: null,
-        panelsLog: buildPanelsLog(action.panels, action.timestamp),
+        panelsLog: buildPanelsLog(action.panels, action.start_time),
         panelsMap: addDataToPanels(action.panels, state.sqlDataMap),
         dashboard,
         execution_id: action.execution_id,
@@ -125,8 +125,6 @@ const reducer = (state: IDashboardContext, action) => {
         snapshot: null,
         state: "ready",
       };
-
-      return res;
     }
     case DashboardActions.EXECUTION_COMPLETE: {
       // If we're in live mode and not expecting execution events for this ID
@@ -156,13 +154,13 @@ const reducer = (state: IDashboardContext, action) => {
       // Build map of SQL to data
       const sqlDataMap = buildSqlDataMap(panels);
       // Replace the whole dashboard as this event contains everything
-      const res = {
+      return {
         ...state,
         error: null,
         panelsLog: updatePanelsLogFromCompletedPanels(
           state.panelsLog,
           panels,
-          action.timestamp
+          action.snapshot.end_time
         ),
         panelsMap: panels,
         dashboard,
@@ -171,8 +169,6 @@ const reducer = (state: IDashboardContext, action) => {
         snapshot: action.snapshot,
         state: "complete",
       };
-
-      return res;
     }
     case DashboardActions.EXECUTION_ERROR:
       return { ...state, error: action.error, progress: 100, state: "error" };
diff --git a/ui/dashboard/src/hooks/useDashboardWebSocket.ts b/ui/dashboard/src/hooks/useDashboardWebSocket.ts
index c84516be7..4edd7df7b 100644
--- a/ui/dashboard/src/hooks/useDashboardWebSocket.ts
+++ b/ui/dashboard/src/hooks/useDashboardWebSocket.ts
@@ -70,7 +70,7 @@ const useDashboardWebSocket = (
     if (!typedEvent || !typedEvent.action) {
       return;
     }
-    eventHandler({ ...typedEvent, timestamp: Date.now() });
+    eventHandler(typedEvent);
   }, [eventHandler, lastJsonMessage]);
 
   useEffect(() => {
diff --git a/ui/dashboard/src/types/index.ts b/ui/dashboard/src/types/index.ts
index 9a1a36fc3..92499247e 100644
--- a/ui/dashboard/src/types/index.ts
+++ b/ui/dashboard/src/types/index.ts
@@ -96,7 +96,7 @@ export type PanelLog = {
   isDependency?: boolean;
   prefix?: string;
   status: DashboardRunState;
-  timestamp: number;
+  timestamp: string;
   title: string;
 };
 
diff --git a/ui/dashboard/src/utils/dashboardEventHandlers.test.ts b/ui/dashboard/src/utils/dashboardEventHandlers.test.ts
index 3ef715d5a..036e5106e 100644
--- a/ui/dashboard/src/utils/dashboardEventHandlers.test.ts
+++ b/ui/dashboard/src/utils/dashboardEventHandlers.test.ts
@@ -494,7 +494,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "ready",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_a",
             },
           ],
@@ -516,7 +516,7 @@ describe("dashboard event handlers", () => {
               {
                 dashboard_node: updatedDashboardNode,
                 execution_id: "1",
-                timestamp: blockedAt.valueOf(),
+                timestamp: blockedAt.toString(),
               },
             ],
           },
@@ -531,7 +531,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "blocked",
-              timestamp: blockedAt.valueOf(),
+              timestamp: blockedAt.toString(),
               title: "panel_a",
             },
           ],
@@ -556,7 +556,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "ready",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_a",
             },
           ],
@@ -578,7 +578,7 @@ describe("dashboard event handlers", () => {
               {
                 dashboard_node: updatedDashboardNode,
                 execution_id: "1",
-                timestamp: runningAt.valueOf(),
+                timestamp: runningAt.toString(),
               },
             ],
           },
@@ -593,7 +593,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "running",
-              timestamp: runningAt.valueOf(),
+              timestamp: runningAt.toString(),
               title: "panel_a",
             },
           ],
@@ -618,7 +618,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "ready",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_a",
             },
           ],
@@ -640,7 +640,7 @@ describe("dashboard event handlers", () => {
               {
                 dashboard_node: updatedDashboardNode,
                 execution_id: "1",
-                timestamp: erroredAt.valueOf(),
+                timestamp: erroredAt.toString(),
               },
             ],
           },
@@ -655,7 +655,7 @@ describe("dashboard event handlers", () => {
             {
               error: "BOOM!",
               status: "error",
-              timestamp: erroredAt.valueOf(),
+              timestamp: erroredAt.toString(),
               title: "panel_a",
             },
           ],
@@ -680,7 +680,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "running",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_a",
             },
           ],
@@ -702,7 +702,7 @@ describe("dashboard event handlers", () => {
               {
                 dashboard_node: updatedDashboardNode,
                 execution_id: "1",
-                timestamp: completeAt.valueOf(),
+                timestamp: completeAt.toString(),
               },
             ],
           },
@@ -718,7 +718,7 @@ describe("dashboard event handlers", () => {
               error: null,
               executionTime: 1000,
               status: "complete",
-              timestamp: completeAt.valueOf(),
+              timestamp: completeAt.toString(),
               title: "panel_a",
             },
           ],
@@ -745,7 +745,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "ready",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_a",
             },
           ],
@@ -753,7 +753,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "ready",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_b",
             },
           ],
@@ -761,7 +761,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "ready",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_c",
             },
           ],
@@ -769,7 +769,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "ready",
-              timestamp: readyAt.valueOf(),
+              timestamp: readyAt.toString(),
               title: "panel_d",
             },
           ],
@@ -803,12 +803,12 @@ describe("dashboard event handlers", () => {
               {
                 dashboard_node: updatedDashboardNode1,
                 execution_id: "1",
-                timestamp: panelACompleteAt.valueOf(),
+                timestamp: panelACompleteAt.toString(),
               },
               {
                 dashboard_node: updatedDashboardNode2,
                 execution_id: "1",
-                timestamp: panelBCompleteAt.valueOf(),
+                timestamp: panelBCompleteAt.toString(),
               },
             ],
           },
@@ -823,7 +823,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "complete",
-              timestamp: panelACompleteAt.valueOf(),
+              timestamp: panelACompleteAt.toString(),
               title: "panel_a",
             },
           ],
@@ -832,7 +832,7 @@ describe("dashboard event handlers", () => {
             {
               error: null,
               status: "complete",
-              timestamp: panelBCompleteAt.valueOf(),
+              timestamp: panelBCompleteAt.toString(),
               title: "panel_b",
             },
           ],
diff --git a/ui/dashboard/src/utils/state.ts b/ui/dashboard/src/utils/state.ts
index f0f9368ea..39fbc2059 100644
--- a/ui/dashboard/src/utils/state.ts
+++ b/ui/dashboard/src/utils/state.ts
@@ -1,3 +1,4 @@
+import dayjs from "dayjs";
 import get from "lodash/get";
 import paths from "deepdash/paths";
 import set from "lodash/set";
@@ -156,7 +157,7 @@ const panelLogTitle = (panel: PanelDefinition) => {
 
 const buildPanelLog = (
   panel: PanelDefinition,
-  timestamp: number,
+  timestamp: string,
   executionTime?: number
 ): PanelLog => {
   return {
@@ -168,7 +169,7 @@ const buildPanelLog = (
   };
 };
 
-const buildPanelsLog = (panels: PanelsMap, timestamp: number) => {
+const buildPanelsLog = (panels: PanelsMap, timestamp: string) => {
   const panelsLog: PanelsLog = {};
   for (const [name, panel] of Object.entries(panels || {})) {
     panelsLog[name] = [buildPanelLog(panel, timestamp)];
@@ -177,7 +178,7 @@ const buildPanelsLog = (panels: PanelsMap, timestamp: number) => {
 };
 
 const calculateExecutionTime = (
-  timestamp: number,
+  timestamp: string,
   panel: PanelDefinition,
   panelLogs: PanelLog[]
 ): number | undefined => {
@@ -185,7 +186,7 @@ const calculateExecutionTime = (
   if (panel.status === "complete") {
     const runningLog = panelLogs.find((l) => l.status === "running");
     if (runningLog) {
-      overallTime = timestamp - runningLog.timestamp;
+      overallTime = dayjs(timestamp).diff(runningLog.timestamp);
     }
   }
   return overallTime;
@@ -194,7 +195,7 @@ const calculateExecutionTime = (
 const addUpdatedPanelLogs = (
   panelsLog: PanelsLog,
   panel: PanelDefinition,
-  timestamp: number
+  timestamp: string
 ) => {
   const newPanelsLog = { ...panelsLog };
   const newPanelLog = [...(newPanelsLog[panel.name] || [])];
@@ -211,7 +212,7 @@ const addUpdatedPanelLogs = (
 const updatePanelsLogFromCompletedPanels = (
   panelsLog: PanelsLog,
   panels: PanelsMap,
-  timestamp: number
+  timestamp: string
 ) => {
   const newPanelsLog = { ...panelsLog };
   for (const [panelName, panel] of Object.entries(panels || {})) {