From 37ad2c38f8ae70fec98f378debebe33b2eb10640 Mon Sep 17 00:00:00 2001
From: Christian <christian.quiros+github@gmail.com>
Date: Thu, 1 May 2025 21:20:27 -0600
Subject: [PATCH 1/2] Update SagaUpdateNode to lossless-json

---
 .../messages2/SagaDiagram/SagaUpdateNode.vue  | 20 ++++++++-----------
 1 file changed, 8 insertions(+), 12 deletions(-)

diff --git a/src/Frontend/src/components/messages2/SagaDiagram/SagaUpdateNode.vue b/src/Frontend/src/components/messages2/SagaDiagram/SagaUpdateNode.vue
index 43bc9cb29..ee6364473 100644
--- a/src/Frontend/src/components/messages2/SagaDiagram/SagaUpdateNode.vue
+++ b/src/Frontend/src/components/messages2/SagaDiagram/SagaUpdateNode.vue
@@ -7,6 +7,7 @@ import DiffViewer from "@/components/messages2/DiffViewer.vue";
 import CodeEditor from "@/components/CodeEditor.vue";
 import { useSagaDiagramStore } from "@/stores/SagaDiagramStore";
 import { ref, watch, computed } from "vue";
+import { parse, stringify } from "lossless-json";
 
 // Import the images directly
 import CommandIcon from "@/assets/command.svg";
@@ -15,13 +16,6 @@ import SagaUpdatedIcon from "@/assets/SagaUpdatedIcon.svg";
 import TimeoutIcon from "@/assets/timeout.svg";
 import SagaTimeoutIcon from "@/assets/SagaTimeoutIcon.svg";
 
-// Define types for JSON values and properties
-type JsonValue = string | number | boolean | null | JsonObject | JsonArray;
-interface JsonObject {
-  [key: string]: JsonValue;
-}
-type JsonArray = Array<JsonValue>;
-
 const props = defineProps<{
   update: SagaUpdateViewModel;
   showMessageData?: boolean;
@@ -56,18 +50,20 @@ watch(
 const formatJsonValue = (value: unknown): string => {
   if (value === null || value === undefined) return "null";
   if (typeof value === "object") {
-    return JSON.stringify(value, null, 2);
+    return stringify(value as object, null, 2) || "{}";
   }
   return String(value);
 };
 
 // Process JSON state and remove standard properties
-const processState = (state: string | undefined): Record<string, JsonValue> => {
+const processState = (state: string | undefined): object => {
   if (!state) return {};
 
   let stateObj: Record<string, unknown>;
   try {
-    stateObj = JSON.parse(state);
+    const parsedState = parse(state);
+
+    stateObj = parsedState as Record<string, unknown>;
   } catch (e) {
     console.error("Error parsing state:", e);
     hasParsingError.value = true;
@@ -82,7 +78,7 @@ const processState = (state: string | undefined): Record<string, JsonValue> => {
     }
   });
 
-  return stateObj as Record<string, JsonValue>;
+  return stateObj;
 };
 
 const sagaUpdateStateChanges = computed(() => {
@@ -119,7 +115,7 @@ const hasStateChanges = computed(() => {
   const currentState = processState(props.update.stateAfterChange);
   const previousState = processState(props.update.previousStateAfterChange);
 
-  return JSON.stringify(currentState) !== JSON.stringify(previousState);
+  return stringify(currentState) !== stringify(previousState);
 });
 </script>
 

From 23f60bb85d3b3b63e69d84c102f7be6066c5eb29 Mon Sep 17 00:00:00 2001
From: Christian <christian.quiros+github@gmail.com>
Date: Thu, 1 May 2025 21:24:57 -0600
Subject: [PATCH 2/2] Update sagaDiagramStore to use lossless-json

---
 src/Frontend/src/stores/SagaDiagramStore.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Frontend/src/stores/SagaDiagramStore.ts b/src/Frontend/src/stores/SagaDiagramStore.ts
index af2d9db82..92c0c74c0 100644
--- a/src/Frontend/src/stores/SagaDiagramStore.ts
+++ b/src/Frontend/src/stores/SagaDiagramStore.ts
@@ -3,6 +3,7 @@ import { ref, watch } from "vue";
 import { SagaHistory, SagaMessage } from "@/resources/SagaHistory";
 import { useFetchFromServiceControl } from "@/composables/serviceServiceControlUrls";
 import Message from "@/resources/Message";
+import { parse } from "lossless-json";
 
 const StandardKeys = ["$type", "Id", "Originator", "OriginalMessageId"];
 export interface SagaMessageDataItem {
@@ -155,12 +156,11 @@ export const useSagaDiagramStore = defineStore("SagaDiagramStore", () => {
     }
   }
 
-  // Replace or modify the existing processJsonValues function
   function processJsonValues(jsonBody: string | Record<string, unknown>): SagaMessageDataItem[] {
     let parsedBody: Record<string, unknown>;
     if (typeof jsonBody === "string") {
       try {
-        parsedBody = JSON.parse(jsonBody);
+        parsedBody = parse(jsonBody) as Record<string, unknown>;
       } catch (e) {
         console.error("Error parsing JSON:", e);
         return [];