add confirm and deny kill

components/ConfirmKill.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { useContext } from "react";
+import { useSWRConfig } from "swr";
+import { ErrorContext } from "./App";
+
+export default function ConfirmKill() {
+  const { mutate } = useSWRConfig();
+  const { setError } = useContext(ErrorContext);
+
+  async function onClick() {
+    const res = await fetch("/api/kill/confirm", {
+      method: "POST",
+    });
+
+    if (!res.ok) {
+      setError(await res.json());
+      return;
+    }
+
+    mutate("/api/user");
+  }
+
+  return (
+    <button className="btn btn-success" onClick={() => onClick()}>
+      Confirm Kill
+    </button>
+  );
+}

components/DenyKill.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { useContext } from "react";
+import { useSWRConfig } from "swr";
+import { ErrorContext } from "./App";
+
+export default function DenyKill() {
+  const { mutate } = useSWRConfig();
+  const { setError } = useContext(ErrorContext);
+
+  async function onClick() {
+    const res = await fetch("/api/kill/deny", {
+      method: "POST",
+    });
+
+    if (!res.ok) {
+      setError(await res.json());
+      return;
+    }
+
+    mutate("/api/user");
+  }
+
+  return (
+    <button className="btn btn-error" onClick={() => onClick()}>
+      Deny Kill
+    </button>
+  );
+}

components/KillTarget.tsx

@@ -1,26 +1,37 @@
 "use client";
 
+import { useContext } from "react";
 import { useSWRConfig } from "swr";
+import { ErrorContext } from "./App";
 
-export default function KillTarget() {
+export default function KillTarget({ pending }: { pending: boolean }) {
   const { mutate } = useSWRConfig();
+  const { setError } = useContext(ErrorContext);
 
-  async function killTarget() {
+  async function onClick() {
     const res = await fetch("/api/kill", {
       method: "POST",
     });
 
     if (!res.ok) {
-      throw new Error(await res.json());
+      setError(await res.json());
+      return;
     }
 
-    console.log(await res.json());
-
     mutate("/api/user");
   }
 
+  if (pending) {
+    return (
+      <button className="btn btn-accent">
+        Pending
+        <span className="loading loading-dots loading-sm"></span>
+      </button>
+    );
+  }
+
   return (
-    <button className="btn btn-accent" onClick={() => killTarget()}>
+    <button className="btn btn-accent" onClick={() => onClick()}>
       Kill Target
     </button>
   );

components/Party.tsx

@@ -16,8 +16,14 @@ import KillTarget from "./KillTarget";
 import PartyCard from "./PartyCard";
 import KickPlayer from "./KickPlayer";
 import { User } from "@/lib/user";
+import ConfirmKill from "./ConfirmKill";
+import DenyKill from "./DenyKill";
+import { useContext } from "react";
+import { ErrorContext } from "./App";
 
 export default function Party() {
+  const { setError } = useContext(ErrorContext);
+
   const fetcher: Fetcher<User, string> = (url) =>
     fetch(url).then((res) => res.json());
 
@@ -50,14 +56,22 @@ export default function Party() {
 
   if (party.started) {
     if (!user.target) {
-      throw new Error("User does not have a target");
+      setError("User has no target");
+      return;
     }
 
     return (
       <PartyCard code={party.code}>
         <h2>Target: {user.target.name}</h2>
         <div className="card-actions justify-center">
-          <KillTarget />
+          {user.pending ? (
+            <>
+              <ConfirmKill />
+              <DenyKill />
+            </>
+          ) : (
+            <KillTarget pending={user.target.pending} />
+          )}
           {party.adminId === user.id && <StopGame />}
           <LeaveParty />
         </div>