From d11f0d50c60a5d270c00a2f388bf858fda1bb152 Mon Sep 17 00:00:00 2001
From: Julian Krauser <jkrauser209@gmail.com>
Date: Wed, 21 May 2025 10:33:24 +0200
Subject: [PATCH] enhance: double confirm deletion for newsletter dates

---
 .../admin/club/newsletter/NewsletterDates.vue      | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/views/admin/club/newsletter/NewsletterDates.vue b/src/views/admin/club/newsletter/NewsletterDates.vue
index 2fdaa1e..66a9baf 100644
--- a/src/views/admin/club/newsletter/NewsletterDates.vue
+++ b/src/views/admin/club/newsletter/NewsletterDates.vue
@@ -37,11 +37,15 @@
                   })
             }}
           </p>
-          <TrashIcon
+          <DoubleConfirmClick
             v-if="can('create', 'club', 'newsletter')"
-            class="w-5 h-5 p-1 box-content cursor-pointer text-white"
-            @click.prevent="removeSelected(item.calendarId)"
-          />
+            light
+            v-slot="{ isSensitive }"
+            @click:submit="removeSelected(item.calendarId)"
+          >
+            <TrashIcon v-if="!isSensitive" class="h-5 w-5" />
+            <TrashIconSolid v-else class="h-5 w-5" />
+          </DoubleConfirmClick>
         </summary>
         <div class="flex flex-col gap-2 px-1">
           <input
@@ -111,8 +115,10 @@ import { useAbilityStore } from "@/stores/ability";
 import { useCalendarStore } from "@/stores/admin/club/calendar";
 import type { CalendarViewModel } from "@/viewmodels/admin/club/calendar.models";
 import { TrashIcon } from "@heroicons/vue/24/outline";
+import { TrashIcon as TrashIconSolid } from "@heroicons/vue/24/solid";
 import cloneDeep from "lodash.clonedeep";
 import type { NewsletterDatesViewModel } from "@/viewmodels/admin/club/newsletter/newsletterDates.models";
+import DoubleConfirmClick from "@/components/DoubleConfirmClick.vue";
 </script>
 
 <script lang="ts">