From 90a6ac0aed3d74da73180230ff90b245bbc40a1d Mon Sep 17 00:00:00 2001
From: Mysterious-Dev <mysteriousdevs@gmail.com>
Date: Sun, 26 Nov 2023 14:33:54 +0100
Subject: [PATCH 1/2] Use TYpescript for Confirm Modal Component

---
 lib/components/modal/ConfirmModal.vue | 52 +++++++++++----------------
 1 file changed, 21 insertions(+), 31 deletions(-)

diff --git a/lib/components/modal/ConfirmModal.vue b/lib/components/modal/ConfirmModal.vue
index 57c9c7472..363b4b566 100644
--- a/lib/components/modal/ConfirmModal.vue
+++ b/lib/components/modal/ConfirmModal.vue
@@ -33,41 +33,31 @@
   </Modal>
 </template>
 
-<script setup>
+<script setup lang="ts">
 import { Modal, TrashIcon, XIcon, renderString } from '@'
-import { ref } from 'vue'
+import { ref, VNodeRef } from 'vue'
 
-const props = defineProps({
-  confirmationText: {
-    type: String,
-    default: '',
-  },
-  hasToType: {
-    type: Boolean,
-    default: false,
-  },
-  title: {
-    type: String,
-    default: 'No title defined',
-    required: true,
-  },
-  description: {
-    type: String,
-    default: 'No description defined',
-    required: true,
-  },
-  proceedLabel: {
-    type: String,
-    default: 'Proceed',
-  },
-  noblur: {
-    type: Boolean,
-    default: false,
-  },
-})
+const props = withDefaults(
+  defineProps<{
+    confirmationText: string
+    hasToType: boolean
+    title: string
+    description: string
+    proceedLabel: string
+    noblur: boolean
+  }>(),
+  {
+    confirmationText: '',
+    hasToType: false,
+    title: 'No title defined',
+    description: 'No description defined',
+    proceedLabel: 'Proceed',
+    noblur: false,
+  }
+)
 
 const emit = defineEmits(['proceed'])
-const modal = ref(null)
+const modal = ref<VNodeRef | null>(null)
 
 const action_disabled = ref(props.hasToType)
 const confirmation_typed = ref('')

From 4558e09cde124d6b274d503e14681512bf70add2 Mon Sep 17 00:00:00 2001
From: Mysterious-Dev <mysteriousdevs@gmail.com>
Date: Fri, 26 Jan 2024 17:39:18 +0100
Subject: [PATCH 2/2] Fix some things

---
 lib/components/modal/ConfirmModal.vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/lib/components/modal/ConfirmModal.vue b/lib/components/modal/ConfirmModal.vue
index 363b4b566..3fad4c527 100644
--- a/lib/components/modal/ConfirmModal.vue
+++ b/lib/components/modal/ConfirmModal.vue
@@ -20,7 +20,7 @@
         />
       </div>
       <div class="input-group push-right">
-        <button class="btn" @click="modal.hide()">
+        <button class="btn" @click="modal?.hide()">
           <XIcon />
           Cancel
         </button>
@@ -35,7 +35,7 @@
 
 <script setup lang="ts">
 import { Modal, TrashIcon, XIcon, renderString } from '@'
-import { ref, VNodeRef } from 'vue'
+import { ref } from 'vue'
 
 const props = withDefaults(
   defineProps<{
@@ -57,13 +57,13 @@ const props = withDefaults(
 )
 
 const emit = defineEmits(['proceed'])
-const modal = ref<VNodeRef | null>(null)
+const modal = ref<InstanceType<typeof Modal> | null>(null)
 
 const action_disabled = ref(props.hasToType)
 const confirmation_typed = ref('')
 
 function proceed() {
-  modal.value.hide()
+  modal.value?.hide()
   emit('proceed')
 }
 
@@ -75,7 +75,7 @@ function type() {
 }
 
 function show() {
-  modal.value.show()
+  modal.value?.show()
 }
 
 defineExpose({ show })