Skip to content

Commit baa6fd2

Browse files
Copilotcschleiden
andcommitted
Improve JSON output formatting in web UI
Co-authored-by: cschleiden <[email protected]>
1 parent 7de822c commit baa6fd2

File tree

8 files changed

+43
-14
lines changed

8 files changed

+43
-14
lines changed

diag/app/build/asset-manifest.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
{
22
"files": {
33
"main.css": "./static/css/main.8b0db0ad.css",
4-
"main.js": "./static/js/main.e117a19e.js",
4+
"main.js": "./static/js/main.2241337e.js",
55
"index.html": "./index.html",
66
"main.8b0db0ad.css.map": "./static/css/main.8b0db0ad.css.map",
7-
"main.e117a19e.js.map": "./static/js/main.e117a19e.js.map"
7+
"main.2241337e.js.map": "./static/js/main.2241337e.js.map"
88
},
99
"entrypoints": [
1010
"static/css/main.8b0db0ad.css",
11-
"static/js/main.e117a19e.js"
11+
"static/js/main.2241337e.js"
1212
]
1313
}

diag/app/build/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><title>go-workflows</title><script defer="defer" src="./static/js/main.e117a19e.js"></script><link href="./static/css/main.8b0db0ad.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
1+
<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><title>go-workflows</title><script defer="defer" src="./static/js/main.2241337e.js"></script><link href="./static/css/main.8b0db0ad.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

diag/app/build/static/js/main.e117a19e.js renamed to diag/app/build/static/js/main.2241337e.js

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
File renamed without changes.

diag/app/build/static/js/main.2241337e.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

diag/app/build/static/js/main.e117a19e.js.map

Lines changed: 0 additions & 1 deletion
This file was deleted.

diag/app/src/Components.tsx

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,17 @@ import { WorkflowInstance as Instance } from "./client";
55

66
export function decodePayload(payload: string): string {
77
try {
8-
return atob(payload);
8+
const decoded = atob(payload);
9+
10+
// Try to parse as JSON and pretty-print if valid
11+
try {
12+
JSON.parse(decoded);
13+
// If parsing succeeds, pretty-print the JSON
14+
return JSON.stringify(JSON.parse(decoded), null, 2);
15+
} catch {
16+
// If not valid JSON, return as-is
17+
return decoded;
18+
}
919
} catch {
1020
return payload;
1121
}
@@ -40,6 +50,28 @@ export function decodePayloads(payload: { [key: string]: any }): any {
4050
return r;
4151
}
4252

53+
export function formatAttributesForDisplay(attributes: { [key: string]: any }): string {
54+
const decoded = decodePayloads(attributes);
55+
56+
// Custom replacer function to handle already-pretty-printed JSON strings in inputs
57+
const replacer = (key: string, value: any) => {
58+
if (key === "inputs" && Array.isArray(value)) {
59+
// For inputs, we want to parse the pretty-printed JSON strings back to objects
60+
// so they display nicely in the final JSON
61+
return value.map(input => {
62+
try {
63+
return JSON.parse(input);
64+
} catch {
65+
return input;
66+
}
67+
});
68+
}
69+
return value;
70+
};
71+
72+
return JSON.stringify(decoded, replacer, 2);
73+
}
74+
4375
export const Payload: React.FC<{ payloads: string[] }> = ({ payloads }) => {
4476
return (
4577
<div className="bg-dark text-light rounded p-2">

diag/app/src/Instance.tsx

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import {
88
WorkflowInstanceState,
99
decodePayload,
1010
decodePayloads,
11+
formatAttributesForDisplay,
1112
} from "./Components";
1213
import {
1314
ExecutionCompletedAttributes,
@@ -208,11 +209,7 @@ function Instance() {
208209
<dd>
209210
<Payload
210211
payloads={[
211-
JSON.stringify(
212-
decodePayloads(event.attributes),
213-
undefined,
214-
2
215-
),
212+
formatAttributesForDisplay(event.attributes)
216213
]}
217214
/>
218215
</dd>

0 commit comments

Comments
 (0)