From 70307a9e8272f22801c6765c947f8576cc1d1102 Mon Sep 17 00:00:00 2001
From: Nicolai Ort <info@nicolai-ort.com>
Date: Wed, 12 Apr 2023 14:34:06 +0200
Subject: [PATCH] Added delete cards button ref #161

---
 src/components/cards/CardsOverview.svelte | 41 ++++++++++++++++++++++-
 1 file changed, 40 insertions(+), 1 deletion(-)

diff --git a/src/components/cards/CardsOverview.svelte b/src/components/cards/CardsOverview.svelte
index 82290715..e9a693f1 100644
--- a/src/components/cards/CardsOverview.svelte
+++ b/src/components/cards/CardsOverview.svelte
@@ -72,7 +72,46 @@
     {#if current_cards.length === 0}
       <CardsEmptyState />
     {:else}
-      <div class="h-12">
+      <div class="h-12 mt-1">
+        {#if cards_show}
+          <button
+            type="button"
+            class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
+            id="options-menu"
+            on:click={async () => {
+              const prom = [];
+              for (const card of generate_cards) {
+                prom.push(
+                  RunnerCardService.runnerCardControllerRemove(card.id, true)
+                );
+              }
+              await Promise.all(prom);
+              Toastify({
+                text: $_("cards-deleted"),
+                duration: 3500,
+                backgroundColor:
+                  "linear-gradient(to right, #00b09b, #96c93d)",
+              }).showToast();
+              //TODO: Delete cards from table
+            }}
+          >
+            {$_("delete-cards")}
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke-width="1.5"
+              stroke="currentColor"
+              class="w-5 h-5"
+            >
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0"
+              />
+            </svg>
+          </button>
+        {/if}
         <GenerateRunnerCards bind:cards_show bind:generate_cards />
       </div>
       <Datatable {handler}>