fix: prevent view update (#1102)

ui/package.json

@@ -28,6 +28,7 @@
     "date-fns": "^3.6.0",
     "easymde": "^2.18.0",
     "lodash.debounce": "^4.0.8",
+    "lodash.isequal": "^4.5.0",
     "lucide-vue-next": "^0.365.0",
     "marked": "^12.0.2",
     "pinia": "^2.1.7",
@@ -48,6 +49,7 @@
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
     "@tsconfig/node20": "^20.1.2",
     "@types/lodash.debounce": "^4.0.9",
+    "@types/lodash.isequal": "^4.5.8",
     "@types/node": "^20.11.28",
     "@vitejs/plugin-vue": "^5.0.4",
     "@vue/eslint-config-prettier": "^8.0.0",

ui/src/components/form/JSONSchemaFormFields.vue

@@ -11,6 +11,7 @@ import {
   SelectValue
 } from '@/components/ui/select'
 
+import isEqual from 'lodash.isequal'
 import { onMounted, ref, watch } from 'vue'
 
 import type { JSONSchema } from '@/lib/types'
@@ -34,6 +35,11 @@ onMounted(() => {
 watch(
   () => formdata.value,
   () => {
+    const normFormdata = JSON.parse(JSON.stringify(formdata.value))
+    const normModel = JSON.parse(JSON.stringify(model.value))
+
+    if (isEqual(normFormdata, normModel)) return
+
     model.value = { ...formdata.value }
   },
   { deep: true }