feat: deleting column from frontend

frontend/src/contexts/SearchImageContext.tsx

@@ -7,7 +7,13 @@ import {
     createResource,
     useContext,
 } from "solid-js";
-import { deleteImage, deleteImageFromStack, getUserImages, JustTheImageWhatAreTheseNames } from "../network";
+import {
+    deleteImage,
+    deleteImageFromStack,
+    deleteStackItem,
+    getUserImages,
+    JustTheImageWhatAreTheseNames,
+} from "../network";
 
 export type SearchImageStore = {
     imagesByDate: Accessor<
@@ -21,40 +27,41 @@ export type SearchImageStore = {
     onRefetchImages: () => void;
     onDeleteImage: (imageID: string) => void;
     onDeleteImageFromStack: (stackID: string, imageID: string) => void;
+    onDeleteStackItem: (stackID: string, schemaItemID: string) => void;
 };
 
 const SearchImageContext = createContext<SearchImageStore>();
 export const SearchImageContextProvider: Component<ParentProps> = (props) => {
     const [data, { refetch }] = createResource(getUserImages);
 
-    const sortedImages = createMemo<ReturnType<SearchImageStore["imagesByDate"]>>(
-        () => {
-            const d = data();
-            if (d == null) {
-                return [];
+    const sortedImages = createMemo<
+        ReturnType<SearchImageStore["imagesByDate"]>
+    >(() => {
+        const d = data();
+        if (d == null) {
+            return [];
+        }
+
+        // Sorted by day. But we could potentially add more in the future.
+        const buckets: Record<string, JustTheImageWhatAreTheseNames> = {};
+
+        for (const image of d.UserImages) {
+            if (image.CreatedAt == null) {
+                continue;
             }
 
-            // Sorted by day. But we could potentially add more in the future.
-            const buckets: Record<string, JustTheImageWhatAreTheseNames> = {};
-
-            for (const image of d.UserImages) {
-                if (image.CreatedAt == null) {
-                    continue;
-                }
-
-                const date = new Date(image.CreatedAt).toDateString();
-                if (!(date in buckets)) {
-                    buckets[date] = [];
-                }
-
-                buckets[date].push(image);
+            const date = new Date(image.CreatedAt).toDateString();
+            if (!(date in buckets)) {
+                buckets[date] = [];
             }
 
-            return Object.entries(buckets)
-                .map(([date, images]) => ({ date: new Date(date), images }))
-                .sort((a, b) => b.date.getTime() - a.date.getTime());
-        },
-    );
+            buckets[date].push(image);
+        }
+
+        return Object.entries(buckets)
+            .map(([date, images]) => ({ date: new Date(date), images }))
+            .sort((a, b) => b.date.getTime() - a.date.getTime());
+    });
 
     return (
         <SearchImageContext.Provider
@@ -68,7 +75,10 @@ export const SearchImageContextProvider: Component<ParentProps> = (props) => {
                 },
                 onDeleteImageFromStack: (stackID: string, imageID: string) => {
                     deleteImageFromStack(stackID, imageID).then(refetch);
-                }
+                },
+                onDeleteStackItem: (stackID: string, schemaItemID: string) => {
+                    deleteStackItem(stackID, schemaItemID).then(refetch);
+                },
             }}
         >
             {props.children}

frontend/src/network/index.ts

@@ -121,6 +121,18 @@ export const deleteImageFromStack = async (listID: string, imageID: string): Pro
     await fetch(request);
 }
 
+export const deleteStackItem = async (
+    stackID: string,
+    schemaItemID: string,
+): Promise<void> => {
+    const request = await getBaseAuthorizedRequest({
+        path: `stacks/${stackID}/${schemaItemID}`,
+        method: "DELETE",
+    });
+
+    await fetch(request);
+}
+
 export const deleteList = async (listID: string): Promise<void> => {
     const request = await getBaseAuthorizedRequest({
         path: `stacks/${listID}`,