Webhook Editor

frontend/components/Domain/Household/GroupWebhookEditor.vue

@@ -50,24 +50,25 @@
   </div>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
 import type { ReadWebhook } from "~/lib/api/types/household";
 import { timeLocalToUTC, timeUTCToLocal } from "~/composables/use-group-webhooks";
 
-export default defineNuxtComponent({
+const props = defineProps<{
-  props: {
+  webhook: ReadWebhook;
-    webhook: {
+}>();
-      type: Object as () => ReadWebhook,
-      required: true,
-    },
-  },
-  emits: ["delete", "save", "test"],
-  setup(props, { emit }) {
-    const i18n = useI18n();
-    const itemUTC = ref<string>(props.webhook.scheduledTime);
-    const itemLocal = ref<string>(timeUTCToLocal(props.webhook.scheduledTime));
 
-    const scheduledTime = computed({
+const emit = defineEmits<{
+  delete: [id: string];
+  save: [webhook: ReadWebhook];
+  test: [id: string];
+}>();
+
+const i18n = useI18n();
+const itemUTC = ref<string>(props.webhook.scheduledTime);
+const itemLocal = ref<string>(timeUTCToLocal(props.webhook.scheduledTime));
+
+const scheduledTime = computed({
   get() {
     return itemLocal.value;
   },
@@ -75,27 +76,17 @@ export default defineNuxtComponent({
     itemUTC.value = timeLocalToUTC(v);
     itemLocal.value = v;
   },
-    });
+});
 
-    const webhookCopy = ref({ ...props.webhook });
+const webhookCopy = ref({ ...props.webhook });
 
-    function handleSave() {
+function handleSave() {
   webhookCopy.value.scheduledTime = itemLocal.value;
   emit("save", webhookCopy.value);
-    }
+}
 
-    // Set page title using useSeoMeta
+// Set page title using useSeoMeta
-    useSeoMeta({
+useSeoMeta({
   title: i18n.t("settings.webhooks.webhooks"),
-    });
-
-    return {
-      webhookCopy,
-      scheduledTime,
-      handleSave,
-      itemUTC,
-      itemLocal,
-    };
-  },
 });
 </script>