refactor: POST env vars as JSON array instead of KEY=value string
All checks were successful
Check / check (pull_request) Successful in 4s

Replace the string-serialized KEY=value format with a proper JSON array
of {key, value} objects for the env var save endpoint.

Frontend changes:
- envVarEditor.submitAll() now uses fetch() with Content-Type:
  application/json and X-CSRF-Token header instead of form submission
- Sends JSON array: [{"key":"FOO","value":"bar"}, ...]
- Hidden bulk form replaced with hidden div holding CSRF token
- envVarEditor now receives appId parameter for the fetch URL

Backend changes:
- HandleEnvVarSave reads JSON body via json.NewDecoder instead of
  parsing form values with parseEnvPairs
- Returns JSON {"ok": true} instead of HTTP redirect
- Removed parseEnvPairs function and envPair struct entirely
- Added envPairJSON struct with json tags for deserialization

Tests updated to POST JSON arrays instead of form-encoded strings.

Closes #163
This commit is contained in:
clawbot
2026-03-10 11:37:55 -07:00
parent 3f96f4f81b
commit df6aad9b21
4 changed files with 54 additions and 74 deletions

View File

@@ -9,11 +9,12 @@ document.addEventListener("alpine:init", () => {
// ============================================
// Environment Variable Editor Component
// ============================================
Alpine.data("envVarEditor", () => ({
Alpine.data("envVarEditor", (appId) => ({
vars: [],
editIdx: -1,
editKey: "",
editVal: "",
appId: appId,
init() {
this.vars = Array.from(this.$el.querySelectorAll(".env-init")).map(
@@ -58,10 +59,25 @@ document.addEventListener("alpine:init", () => {
},
submitAll() {
this.$refs.bulkData.value = this.vars
.map((e) => e.key + "=" + e.value)
.join("\n");
this.$refs.bulkForm.submit();
const csrfInput = this.$el.querySelector(
'input[name="gorilla.csrf.Token"]',
);
const csrfToken = csrfInput ? csrfInput.value : "";
fetch("/apps/" + this.appId + "/env", {
method: "POST",
headers: {
"Content-Type": "application/json",
"X-CSRF-Token": csrfToken,
},
body: JSON.stringify(
this.vars.map((e) => ({ key: e.key, value: e.value })),
),
}).then((res) => {
if (res.ok) {
window.location.reload();
}
});
},
}));