starting refinement

src/components/blog/DeletePostButton.tsx

@@ -0,0 +1,39 @@
+import { createSignal, Show } from "solid-js";
+import { api } from "~/lib/api";
+import TrashIcon from "~/components/icons/TrashIcon";
+import LoadingSpinner from "~/components/LoadingSpinner";
+
+export interface DeletePostButtonProps {
+  type: string;
+  postID: number;
+}
+
+export default function DeletePostButton(props: DeletePostButtonProps) {
+  const [loading, setLoading] = createSignal(false);
+
+  const deletePostTrigger = async (e: Event) => {
+    e.preventDefault();
+    const affirm = window.confirm("Are you sure you want to delete?");
+    if (affirm) {
+      setLoading(true);
+      try {
+        await api.database.deletePost.mutate({ id: props.postID });
+        // Refresh the page after successful deletion
+        window.location.reload();
+      } catch (error) {
+        alert("Failed to delete post");
+        setLoading(false);
+      }
+    }
+  };
+
+  return (
+    <form onSubmit={deletePostTrigger} class="flex w-full justify-end">
+      <button type="submit">
+        <Show when={loading()} fallback={<TrashIcon height={24} width={24} strokeWidth={1.5} />}>
+          <LoadingSpinner height={24} width={24} />
+        </Show>
+      </button>
+    </form>
+  );
+}