Alias Manager

frontend/components/Domain/Recipe/RecipeDataAliasManagerDialog.vue

@@ -33,7 +33,7 @@
   </div>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
 import { whenever } from "@vueuse/core";
 import { validators } from "~/composables/use-validators";
 import type { IngredientFood, IngredientUnit } from "~/lib/api/types/recipe";
@@ -42,28 +42,19 @@ export interface GenericAlias {
   name: string;
 }
 
-export default defineNuxtComponent({
-  props: {
-    modelValue: {
-      type: Boolean,
-      default: false,
-    },
-    data: {
-      type: Object as () => IngredientFood | IngredientUnit,
-      required: true,
-    },
-  },
-  emits: ["submit", "update:modelValue", "cancel"],
-  setup(props, context) {
+interface Props {
+  data: IngredientFood | IngredientUnit;
+}
+
+const props = defineProps<Props>();
+
+const emit = defineEmits<{
+  submit: [aliases: GenericAlias[]];
+  cancel: [];
+}>();
+
 // V-Model Support
-    const dialog = computed({
-      get: () => {
-        return props.modelValue;
-      },
-      set: (val) => {
-        context.emit("update:modelValue", val);
-      },
-    });
+const dialog = defineModel<boolean>({ default: false });
 
 function createAlias() {
   aliases.value.push({
@@ -85,7 +76,7 @@ export default defineNuxtComponent({
 
 initAliases();
 whenever(
-      () => props.modelValue,
+  () => dialog.value,
   () => {
     initAliases();
   },
@@ -111,17 +102,6 @@ export default defineNuxtComponent({
   });
 
   aliases.value = keepAliases;
-      context.emit("submit", keepAliases);
+  emit("submit", keepAliases);
 }
-
-    return {
-      aliases,
-      createAlias,
-      dialog,
-      deleteAlias,
-      saveAliases,
-      validators,
-    };
-  },
-});
 </script>

frontend/pages/group/data/units.vue

@@ -93,7 +93,7 @@
     <!-- Alias Sub-Dialog -->
     <RecipeDataAliasManagerDialog
       v-if="editTarget"
-      :value="aliasManagerDialog"
+      v-model="aliasManagerDialog"
       :data="editTarget"
       can-submit
       @submit="updateUnitAlias"