Add lightbox retries and queue removal

resources/js/guest/queue/hooks.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { enqueue, list, processQueue, clearDone, type QueueItem } from './queue';
+import { enqueue, list, processQueue, clearDone, remove, type QueueItem } from './queue';
 
 export function useUploadQueue() {
   const [items, setItems] = React.useState<QueueItem[]>([]);
@@ -28,6 +28,14 @@ export function useUploadQueue() {
     await refresh();
   }, [refresh]);
 
+  const removeItem = React.useCallback(
+    async (id: number) => {
+      await remove(id);
+      await refresh();
+    },
+    [refresh]
+  );
+
   React.useEffect(() => {
     refresh();
     const online = () => processQueue().then(refresh);
@@ -35,6 +43,5 @@ export function useUploadQueue() {
     return () => window.removeEventListener('online', online);
   }, [refresh]);
 
-  return { items, loading, refresh, add, retryAll, clearFinished } as const;
+  return { items, loading, refresh, add, retryAll, clearFinished, remove: removeItem } as const;
 }
-

resources/js/guest/queue/queue.ts

@@ -57,6 +57,12 @@ export async function clearDone() {
   });
 }
 
+export async function remove(id: number) {
+  await withStore('readwrite', (store) => {
+    store.delete(id);
+  });
+}
+
 export async function processQueue() {
   if (processing) return; processing = true;
   try {