From 8807590ce7b9287d1ea5586bd94103fa313c9fe3 Mon Sep 17 00:00:00 2001
From: Valentyne Stigloher <pixunil@posteo.eu>
Date: Sun, 16 Mar 2025 15:13:20 +0100
Subject: [PATCH] (admin) feature to delete storage items

---
 components/admin/AdminStorageItem.vue         | 21 ++++++++++++++++++-
 pages/admin/storage.vue                       |  3 +++
 .../api/admin/storage/items/[key].delete.ts   | 18 ++++++++++++++++
 src/injectionKeys.ts                          |  2 ++
 4 files changed, 43 insertions(+), 1 deletion(-)
 create mode 100644 server/api/admin/storage/items/[key].delete.ts

diff --git a/components/admin/AdminStorageItem.vue b/components/admin/AdminStorageItem.vue
index c3980b673..1ba948860 100644
--- a/components/admin/AdminStorageItem.vue
+++ b/components/admin/AdminStorageItem.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { formatSize } from '~/src/helpers.ts';
+import { adminStorageRefreshInjectionKey } from '~/src/injectionKeys.ts';
 
 const props = defineProps<{
     itemKey: string;
@@ -13,15 +14,33 @@ const contentUrl = computed(() => `/api/admin/storage/items/${props.itemKey}`);
 const contentAsyncData = useFetch(contentUrl.value, {
     immediate: false,
 });
+
+const adminStorageRefresh = inject(adminStorageRefreshInjectionKey);
+const dialogue = useDialogue();
+const remove = async () => {
+    try {
+        await dialogue.confirm(`Are you sure you want to remove ${props.itemKey}?`, 'danger');
+    } catch (error) {
+        console.error(error);
+        return;
+    }
+    await $fetch(contentUrl.value, { method: 'DELETE' });
+    if (adminStorageRefresh) {
+        await adminStorageRefresh();
+    }
+};
 </script>
 
 <template>
     <details @toggle="$event.newState === 'open' ? contentAsyncData.execute() : undefined">
         <summary>
-            <span class="py-1 d-inline-flex justify-content-between">
+            <span class="py-1 d-inline-flex justify-content-between align-items-start">
                 <code>{{ chunk }}</code>
                 <span>
                     <span class="badge text-bg-info">{{ formatSize(size) }}</span>
+                    <button type="button" class="btn btn-sm btn-outline-danger" @click="remove()">
+                        <Icon v="trash" />
+                    </button>
                 </span>
             </span>
         </summary>
diff --git a/pages/admin/storage.vue b/pages/admin/storage.vue
index e83d68cc6..831c5ed01 100644
--- a/pages/admin/storage.vue
+++ b/pages/admin/storage.vue
@@ -1,8 +1,11 @@
 <script setup lang="ts">
 import AdminStorageTree from '~/components/admin/AdminStorageTree.vue';
+import { adminStorageRefreshInjectionKey } from '~/src/injectionKeys.ts';
 
 const sizesAsyncData = useFetch('/api/admin/storage/sizes', { lazy: true });
 
+provide(adminStorageRefreshInjectionKey, sizesAsyncData.refresh);
+
 const tree = computed(() => {
     const tree = new Map();
     for (const [key, size] of Object.entries(sizesAsyncData.data.value ?? {})) {
diff --git a/server/api/admin/storage/items/[key].delete.ts b/server/api/admin/storage/items/[key].delete.ts
new file mode 100644
index 000000000..421239047
--- /dev/null
+++ b/server/api/admin/storage/items/[key].delete.ts
@@ -0,0 +1,18 @@
+export default defineEventHandler(async (event) => {
+    const { isGranted } = await useAuthentication(event);
+    if (!isGranted('code')) {
+        throw createError({
+            status: 401,
+            statusMessage: 'Unauthorised',
+        });
+    }
+
+    const key = getRouterParam(event, 'key');
+    if (key === undefined) {
+        throw createError({
+            status: 404,
+            statusMessage: 'Not Found',
+        });
+    }
+    await useStorage().removeItem(key);
+});
diff --git a/src/injectionKeys.ts b/src/injectionKeys.ts
index 144e1590e..7609a002d 100644
--- a/src/injectionKeys.ts
+++ b/src/injectionKeys.ts
@@ -9,3 +9,5 @@ export const changeSourceInjectionKey = Symbol() as InjectionKey<{
     remove: (source: Source) => void;
     edit: (source: Source) => void;
 }>;
+
+export const adminStorageRefreshInjectionKey = Symbol() as InjectionKey<() => Promise<void>>;