fix: ui should compress traces into local storage

Signed-off-by: Nick Mitchell <[email protected]>

Author: starpit

pdl-live-react/package-lock.json

@@ -32,6 +32,7 @@
     "@xterm/addon-clipboard": "^0.1.0",
     "@xterm/addon-fit": "^0.10.0",
     "@xterm/xterm": "^5.3.0",
+    "lz-string": "^1.5.0",
     "pretty-bytes": "^6.1.1",
     "pretty-ms": "^9.2.0",
     "react": "^18.3.1",

pdl-live-react/package.json

@@ -1,11 +1,15 @@
+import { compressToUTF16, decompressFromUTF16 } from "lz-string"
+
 const mytracesLocalStorageKey = "pdl.sidebar-nav-mytraces.list"
 
 type MyTrace = {
   title: string
   timestamp: number
   filename: string
   value: string
+  isCompressed?: boolean
 }
+
 export function getMyTraces(): MyTrace[] {
   return (
     JSON.parse(
@@ -14,6 +18,9 @@ export function getMyTraces(): MyTrace[] {
   ).map((trace) =>
     Object.assign(trace, {
       title: trace.title.replace(/(\.trace)?.json$/, ""),
+      value: trace.isCompressed
+        ? decompressFromUTF16(trace.value)
+        : trace.value,
     }),
   )
 }
@@ -24,7 +31,8 @@ export function addMyTrace(filename: string, value: string): MyTrace {
     title: filename.replace(/(\.trace)?.json$/, ""),
     timestamp: Date.now(),
     filename,
-    value,
+    isCompressed: true,
+    value: compressToUTF16(value),
   }
 
   const alreadyIdx = traces.findIndex((_) => _.filename === filename)