[Simulator] Initial data logging

lang/ui.en.json

@@ -247,6 +247,10 @@
     "defaultMessage": "Don't show this again",
     "description": "Text to never show a dialog again"
   },
+  "download-action": {
+    "defaultMessage": "Download",
+    "description": "Download action label"
+  },
   "drag-hover": {
     "defaultMessage": "Drag and drop",
     "description": "Draggable code hover text"
@@ -799,6 +803,26 @@
     "defaultMessage": "Collapse {title} module",
     "description": "Aria label for collapse simulator module button"
   },
+  "simulator-data-logging-empty": {
+    "defaultMessage": "No log entries.",
+    "description": "Shown in the simulator Data logging table when there are no rows"
+  },
+  "simulator-data-logging-full": {
+    "defaultMessage": "Log full",
+    "description": "Shown below the Data logging table to warn that the log is full"
+  },
+  "simulator-data-logging-rows": {
+    "defaultMessage": "{count, plural, =0 {No rows logged} 1 {# row logged} other {# rows logged}}",
+    "description": "Indicator of the number of rows logged"
+  },
+  "simulator-data-logging-save-log": {
+    "defaultMessage": "Save log",
+    "description": "Action label to save the data log as a file from the Data logging simulator panel"
+  },
+  "simulator-data-logging-truncated": {
+    "defaultMessage": "Older rows not shown",
+    "description": "Text shown in the Data logging table to indicate that old rows have been omitted"
+  },
   "simulator-expand": {
     "defaultMessage": "Expand simulator",
     "description": "Aria label for the expand simulator button"
@@ -831,6 +855,10 @@
     "defaultMessage": "Light level",
     "description": "Light level title"
   },
+  "simulator-log": {
+    "defaultMessage": "Data log",
+    "description": "Data log title"
+  },
   "simulator-loud": {
     "defaultMessage": "Loud",
     "description": "Sound level high threshold marker hover text"

lang/ui.fr.json

@@ -247,6 +247,10 @@
     "defaultMessage": "Don't show this again",
     "description": "Text to never show a dialog again"
   },
+  "download-action": {
+    "defaultMessage": "Download",
+    "description": "Download action label"
+  },
   "drag-hover": {
     "defaultMessage": "Drag and drop",
     "description": "Draggable code hover text"
@@ -798,6 +802,26 @@
     "defaultMessage": "Collapse {title} module",
     "description": "Aria label for collapse simulator module button"
   },
+  "simulator-data-logging-empty": {
+    "defaultMessage": "No log entries.",
+    "description": "Shown in the simulator Data logging table when there are no rows"
+  },
+  "simulator-data-logging-full": {
+    "defaultMessage": "Log full",
+    "description": "Shown below the Data logging table to warn that the log is full"
+  },
+  "simulator-data-logging-rows": {
+    "defaultMessage": "{count, plural, =0 {No rows} 1 {# row} other {# rows}}",
+    "description": "Indicator of the number of rows logged"
+  },
+  "simulator-data-logging-save-log": {
+    "defaultMessage": "Save log",
+    "description": "Action label to save the data log as a file from the Data logging simulator panel"
+  },
+  "simulator-data-logging-truncated": {
+    "defaultMessage": "Older rows not shown",
+    "description": "Text shown in the Data logging table to indicate that old rows have been omitted"
+  },
   "simulator-expand": {
     "defaultMessage": "Expand simulator",
     "description": "Aria label for the expand simulator button"
@@ -830,6 +854,10 @@
     "defaultMessage": "Light level",
     "description": "Light level title"
   },
+  "simulator-log": {
+    "defaultMessage": "Data log",
+    "description": "Data log title"
+  },
   "simulator-loud": {
     "defaultMessage": "Loud",
     "description": "Sound level high threshold marker hover text"

lang/ui.lol.json

@@ -247,6 +247,10 @@
     "defaultMessage": "Don't show this again",
     "description": "Text to never show a dialog again"
   },
+  "download-action": {
+    "defaultMessage": "Download",
+    "description": "Download action label"
+  },
   "drag-hover": {
     "defaultMessage": "Drag and drop",
     "description": "Draggable code hover text"
@@ -798,6 +802,26 @@
     "defaultMessage": "Collapse {title} module",
     "description": "Aria label for collapse simulator module button"
   },
+  "simulator-data-logging-empty": {
+    "defaultMessage": "No log entries.",
+    "description": "Shown in the simulator Data logging table when there are no rows"
+  },
+  "simulator-data-logging-full": {
+    "defaultMessage": "Log full",
+    "description": "Shown below the Data logging table to warn that the log is full"
+  },
+  "simulator-data-logging-rows": {
+    "defaultMessage": "{count, plural, =0 {No rows} 1 {# row} other {# rows}}",
+    "description": "Indicator of the number of rows logged"
+  },
+  "simulator-data-logging-save-log": {
+    "defaultMessage": "Save log",
+    "description": "Action label to save the data log as a file from the Data logging simulator panel"
+  },
+  "simulator-data-logging-truncated": {
+    "defaultMessage": "Older rows not shown",
+    "description": "Text shown in the Data logging table to indicate that old rows have been omitted"
+  },
   "simulator-expand": {
     "defaultMessage": "Expand simulator",
     "description": "Aria label for the expand simulator button"
@@ -830,6 +854,10 @@
     "defaultMessage": "Light level",
     "description": "Light level title"
   },
+  "simulator-log": {
+    "defaultMessage": "Data log",
+    "description": "Data log title"
+  },
   "simulator-loud": {
     "defaultMessage": "Loud",
     "description": "Sound level high threshold marker hover text"

src/common/use-raf-state.ts

@@ -8,6 +8,8 @@ import useIsUnmounted from "./use-is-unmounted";
 
 /**
  * State that rate limits changes with request animation frame.
+ *
+ * Note that if you rely on the previous state value you'll get a stale one.
  */
 const useRafState = <S>(
   initialState: S | (() => S)

src/device/simulator.ts

@@ -15,6 +15,7 @@ import {
 } from "./device";
 
 // Simulator-only events.
+export const EVENT_LOG_DATA = "log_data";
 export const EVENT_RADIO_DATA = "radio_data";
 export const EVENT_RADIO_GROUP = "radio_group";
 export const EVENT_RADIO_RESET = "radio_reset";
@@ -54,6 +55,11 @@ export interface EnumSensor {
 
 export type Sensor = RangeSensor | EnumSensor;
 
+export interface LogEntry {
+  headings?: string[];
+  data?: string[];
+}
+
 export interface SimulatorState {
   radio: RadioState;
 
@@ -96,6 +102,21 @@ export type SensorStateKey = Extract<
   | "buttonB"
 >;
 
+export interface DataLog {
+  headings: string[];
+  data: DataLogRow[];
+}
+
+export interface DataLogRow {
+  isHeading?: boolean;
+  data: string[];
+}
+
+const initialDataLog = (): DataLog => ({
+  headings: [],
+  data: [],
+});
+
 /**
  * A simulated device.
  *
@@ -108,13 +129,14 @@ export class SimulatorDeviceConnection
   status: ConnectionStatus = ConnectionStatus.NO_AUTHORIZED_DEVICE;
   state: SimulatorState | undefined;
 
+  log: DataLog = initialDataLog();
+
   private messageListener = (event: MessageEvent) => {
     const iframe = this.iframe();
     if (!iframe || event.source !== iframe.contentWindow || !event.data.kind) {
       // Not an event for us.
       return;
     }
-
     switch (event.data.kind) {
       case "ready": {
         this.state = event.data.state;
@@ -150,6 +172,28 @@ export class SimulatorDeviceConnection
         }
         break;
       }
+      case "log_output": {
+        const entry: LogEntry = event.data;
+        const result: DataLog = {
+          headings: entry.headings ?? this.log.headings,
+          data: this.log.data,
+        };
+        // The first row is all-time headings row so don't show the initial set.
+        if (entry.headings && this.log.data.length > 0) {
+          result.data.push({ isHeading: true, data: entry.headings });
+        }
+        if (entry.data) {
+          result.data.push({ data: entry.data });
+        }
+        this.log = result;
+        this.emit(EVENT_LOG_DATA, this.log);
+        break;
+      }
+      case "log_delete": {
+        this.log = initialDataLog();
+        this.emit(EVENT_LOG_DATA, this.log);
+        break;
+      }
       case "serial_output": {
         const text = event.data.data;
         if (typeof text === "string") {

src/messages/ui.en.json

@@ -497,6 +497,12 @@
       "value": "Don't show this again"
     }
   ],
+  "download-action": [
+    {
+      "type": 0,
+      "value": "Download"
+    }
+  ],
   "drag-hover": [
     {
       "type": 0,
@@ -1811,6 +1817,70 @@
       "value": " module"
     }
   ],
+  "simulator-data-logging-empty": [
+    {
+      "type": 0,
+      "value": "No log entries."
+    }
+  ],
+  "simulator-data-logging-full": [
+    {
+      "type": 0,
+      "value": "Log full"
+    }
+  ],
+  "simulator-data-logging-rows": [
+    {
+      "offset": 0,
+      "options": {
+        "1": {
+          "value": [
+            {
+              "type": 7
+            },
+            {
+              "type": 0,
+              "value": " row logged"
+            }
+          ]
+        },
+        "=0": {
+          "value": [
+            {
+              "type": 0,
+              "value": "No rows logged"
+            }
+          ]
+        },
+        "other": {
+          "value": [
+            {
+              "type": 7
+            },
+            {
+              "type": 0,
+              "value": " rows logged"
+            }
+          ]
+        }
+      },
+      "pluralType": "cardinal",
+      "type": 6,
+      "value": "count"
+    }
+  ],
+  "simulator-data-logging-save-log": [
+    {
+      "type": 0,
+      "value": "Save log"
+    }
+  ],
+  "simulator-data-logging-truncated": [
+    {
+      "type": 0,
+      "value": "Older rows not shown"
+    }
+  ],
   "simulator-expand": [
     {
       "type": 0,
@@ -1867,6 +1937,12 @@
       "value": "Light level"
     }
   ],
+  "simulator-log": [
+    {
+      "type": 0,
+      "value": "Data log"
+    }
+  ],
   "simulator-loud": [
     {
       "type": 0,