From 577f5ae69a31e14cdff6e0aed5f3091d07484faa Mon Sep 17 00:00:00 2001
From: Dominik Pschenitschni <mail@celement.de>
Date: Sat, 6 Jul 2024 12:05:19 +0200
Subject: [PATCH] feat: use withDefaults for Password

---
 frontend/src/components/input/Password.vue | 29 +++++++++++-----------
 1 file changed, 14 insertions(+), 15 deletions(-)

diff --git a/frontend/src/components/input/Password.vue b/frontend/src/components/input/Password.vue
index 4e1f10ee6..0e1e49cdf 100644
--- a/frontend/src/components/input/Password.vue
+++ b/frontend/src/components/input/Password.vue
@@ -32,33 +32,32 @@
 </template>
 
 <script lang="ts" setup>
-import {ref, watch} from 'vue'
+import {ref, watchEffect} from 'vue'
 import {useDebounceFn} from '@vueuse/core'
 import {useI18n} from 'vue-i18n'
 import BaseButton from '@/components/base/BaseButton.vue'
 
-const props = defineProps({
-	tabindex: String,
-	modelValue: String,
+const props = withDefaults(defineProps<{
+	modelValue: string,
+	tabindex?: string,
 	// This prop is a workaround to trigger validation from the outside when the user never had focus in the input.
-	validateInitially: Boolean,
-	validateMinLength: {
-		type: Boolean,
-		default: true,
-	},
+	validateInitially?: boolean,
+	validateMinLength?: boolean,
+}>(), {
+	validateMinLength: true,
 })
-const emit = defineEmits(['submit', 'update:modelValue'])
+
+const emit = defineEmits<{
+	'update:modelValue': [value: string],
+	'submit': [event: Event],
+}>()
 const {t} = useI18n()
 const passwordFieldType = ref('password')
 const password = ref('')
 const isValid = ref<true | string>(props.validateInitially === true ? true : '')
 const validateAfterFirst = ref(false)
 
-watch(
-	() => props.validateInitially,
-	() => props.validateInitially && validate(),
-	{immediate: true},
-)
+watchEffect(() => props.validateInitially && validate())
 
 const validate = useDebounceFn(() => {
 	if (password.value === '') {