From d7191983bd5ccd51ccb1e98dd2ea4a7fe9010e6e Mon Sep 17 00:00:00 2001
From: Michael Genson <71845777+michael-genson@users.noreply.github.com>
Date: Mon, 28 Jul 2025 02:50:50 -0500
Subject: [PATCH] fix: JSON Editor Breaks On Invalid JSON (#5814)

Co-authored-by: Kuchenpirat <24235032+Kuchenpirat@users.noreply.github.com>
---
 .../Domain/Recipe/RecipePage/RecipePage.vue           |  4 ++--
 frontend/components/global/RecipeJsonEditor.vue       | 11 +++++++----
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/frontend/components/Domain/Recipe/RecipePage/RecipePage.vue b/frontend/components/Domain/Recipe/RecipePage/RecipePage.vue
index 46eda6bbc..6a1f9a3d4 100644
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePage.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePage.vue
@@ -81,7 +81,7 @@
       </v-card>
       <WakelockSwitch />
       <RecipePageComments
-        v-if="!recipe.settings.disableComments && !isEditForm && !isCookMode"
+        v-if="!recipe.settings?.disableComments && !isEditForm && !isCookMode"
         v-model="recipe"
         class="px-1 my-4 d-print-none"
       />
@@ -278,7 +278,7 @@ async function deleteRecipe() {
  * View Preferences
  */
 const landscape = computed(() => {
-  const preferLandscape = recipe.value.settings.landscapeView;
+  const preferLandscape = recipe.value.settings?.landscapeView;
   const smallScreen = !$vuetify.display.smAndUp.value;
 
   if (preferLandscape) {
diff --git a/frontend/components/global/RecipeJsonEditor.vue b/frontend/components/global/RecipeJsonEditor.vue
index a90e1e8be..a5d3dc55a 100644
--- a/frontend/components/global/RecipeJsonEditor.vue
+++ b/frontend/components/global/RecipeJsonEditor.vue
@@ -26,10 +26,10 @@ export default defineComponent({
     },
   },
   emits: ["update:modelValue"],
-  setup(_, { emit }) {
+  setup(props, { emit }) {
     function parseEvent(event: any): object {
       if (!event) {
-        return {};
+        return props.modelValue || {};
       }
       try {
         if (event.json) {
@@ -43,11 +43,14 @@ export default defineComponent({
         }
       }
       catch {
-        return {};
+        return props.modelValue || {};
       }
     }
     function onChange(event: any) {
-      emit("update:modelValue", parseEvent(event));
+      const parsed = parseEvent(event);
+      if (parsed !== props.modelValue) {
+        emit("update:modelValue", parsed);
+      }
     }
     return {
       onChange,