fix json editor lint

frontend/components/global/RecipeJsonEditor.vue

@@ -1,6 +1,6 @@
 <template>
   <JsonEditorVue
-    :modelValue="modelValue"
+    :model-value="modelValue"
     v-bind="$attrs"
     :style="{ height }"
     :stringified="false"
@@ -8,28 +8,29 @@
   />
 </template>
 
-<script setup lang="ts">
-import { defineProps, defineEmits } from 'vue'
-import JsonEditorVue from 'json-editor-vue'
+<script lang="ts">
+import { defineComponent } from "vue";
+import JsonEditorVue from "json-editor-vue";
 
-const props = defineProps({
+export default defineComponent({
+  name: "RecipeJsonEditor",
+  components: { JsonEditorVue },
+  props: {
     modelValue: {
       type: Object,
       default: () => ({}),
     },
     height: {
       type: String,
-    default: '1500px',
+      default: "1500px",
     },
-})
-
-const emit = defineEmits(['update:modelValue'])
-
-function parseEvent(event: any): object {
+  },
+  emits: ["update:modelValue"],
+  setup(_, { emit }) {
+    function parseEvent(event: any): object {
       if (!event) {
         return {};
       }
-
       try {
         if (event.json) {
           return event.json;
@@ -40,12 +41,17 @@ function parseEvent(event: any): object {
         else {
           return event;
         }
-  } catch {
+      }
+      catch {
         return {};
       }
-}
-
-function onChange(event: any) {
-  emit('update:modelValue', parseEvent(event));
-}
+    }
+    function onChange(event: any) {
+      emit("update:modelValue", parseEvent(event));
+    }
+    return {
+      onChange,
+    };
+  },
+});
 </script>