From a80e6d1ca45636837c03b254c2a2a108a4d7f706 Mon Sep 17 00:00:00 2001 From: MechaCat02 Date: Sat, 23 May 2026 22:52:07 +0200 Subject: [PATCH] feat(dashboard): CodeMirror editors for Rhai source + JSON MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replaces the four + {#if createError}
{createError}
@@ -191,8 +192,7 @@ grid-column: 1 / -1; } - .create-form input, - .create-form textarea { + .create-form input { background: #0b1220; color: #e2e8f0; border: 1px solid #334155; @@ -201,13 +201,6 @@ font: inherit; } - .create-form textarea { - font-family: - ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace; - min-height: 8rem; - resize: vertical; - } - .actions { display: flex; justify-content: flex-end; diff --git a/dashboard/src/routes/scripts/[id]/+page.svelte b/dashboard/src/routes/scripts/[id]/+page.svelte index 5bbf4bd..d64d15e 100644 --- a/dashboard/src/routes/scripts/[id]/+page.svelte +++ b/dashboard/src/routes/scripts/[id]/+page.svelte @@ -13,6 +13,18 @@ } from '$lib/api'; import { logLevelColor, statusColor } from '$lib/styles'; import { guessHostKind, guessPathKind, pathKindMismatchWarning } from '$lib/route-utils'; + import CodeEditor from '$lib/CodeEditor.svelte'; + + /// Pretty-print a JSON string in place, leaving it untouched if the + /// input doesn't parse. The error state is shown next to the button + /// so users see why it didn't reformat. + function formatJson(s: string): { ok: true; text: string } | { ok: false; error: string } { + try { + return { ok: true, text: JSON.stringify(JSON.parse(s), null, 2) }; + } catch (e) { + return { ok: false, error: e instanceof Error ? e.message : String(e) }; + } + } // Route is `/scripts/[id]` so `page.params.id` is always present. let id = $derived(page.params.id ?? ''); @@ -72,7 +84,28 @@ let testBody = $state('{}'); let testHeaders = $state('{}'); + let testBodyFormatError = $state(null); + let testHeadersFormatError = $state(null); let testInProgress = $state(false); + + function formatTestBody() { + const r = formatJson(testBody); + if (r.ok) { + testBody = r.text; + testBodyFormatError = null; + } else { + testBodyFormatError = r.error; + } + } + function formatTestHeaders() { + const r = formatJson(testHeaders); + if (r.ok) { + testHeaders = r.text; + testHeadersFormatError = null; + } else { + testHeadersFormatError = r.error; + } + } let testResult = $state<{ status: number; headers: Record; @@ -352,7 +385,7 @@

Source

- + {#if saveSourceError}
{saveSourceError}
{/if} @@ -369,14 +402,30 @@

Test invoke

- - +
+
+ Request body (JSON) + +
+ + {#if testBodyFormatError} +
{testBodyFormatError}
+ {/if} +
+
+
+ Headers (JSON object) + +
+ + {#if testHeadersFormatError} +
{testHeadersFormatError}
+ {/if} +