Load and Save Form JSON Schemas

import { SurveyCreator } from "survey-creator-js";

const creator = new SurveyCreator({ showTranslationTab: true });
creator.JSON = (await fetch(`/api/forms/${formId}`).then(r => r.json())).definition;   // the .definition of GET /api/forms/{id}

creator.autoSaveEnabled = true;   // save after each change; without it, Creator shows a Save button
creator.saveSurveyFunc = async (saveNo, callback) => {
  const res = await fetch(`/api/forms/${formId}`, {
    method: "PUT",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify(creator.JSON)
  });
  callback(saveNo, res.ok);   // tells Creator whether the save succeeded
  if (!res.ok) creator.notify((await res.json()).error, "error");   // say why, e.g. 403: no editor rights
};

// PUT /api/forms/{id} — store the definition as-is: it's one JSON document
Route::put('/api/forms/{id}', function (Request $request, string $id) {
    Gate::authorize('edit-forms');                                           // editing is an admin action: 403 otherwise
    // The raw body, not $request->input(): PHP arrays would turn {} into [] in the stored JSON
    $definition = json_decode($request->getContent(), flags: JSON_THROW_ON_ERROR);
    StoredJson::put('forms', $id, $definition);                              // stored as it arrived: 1.0 stays 1.0

    return response()->noContent();                                          // the next page load renders the new version
});