feat: ability to delete your account

apps/client/src/components/account-content.tsx

@@ -1,25 +1,33 @@
 /* eslint-disable @next/next/no-img-element */
 "use client";
 
-import Button from "./button";
-// import { useRef } from "react";
-// import { FiX } from "react-icons/fi";
+import Button, { SecondaryButton } from "./button";
+import { useRef } from "react";
+import { FiX } from "react-icons/fi";
 import { Session } from "next-auth";
 import { signOut } from "next-auth/react";
 import * as Sentry from "@sentry/nextjs";
+import { deleteUser } from "@ai/utils/queries";
+import toast from "react-hot-toast";
 
 export default function AccountContent({ session }: { session: Session }) {
-  // const dialogRef = useRef<HTMLDialogElement>(null);
+  const dialogRef = useRef<HTMLDialogElement>(null);
 
   const handleSignOut = () => {
     Sentry.setUser(null);
     signOut();
   };
 
-  // const handleDeleteAccount = () => {
-  //   Sentry.setUser(null);
-  //   signOut();
-  // };
+  const handleDeleteAccount = async () => {
+    try {
+      await deleteUser(session.user.id);
+      Sentry.setUser(null);
+      signOut();
+    } catch (error) {
+      toast.error("Unable to delete your account");
+      Sentry.captureException(error);
+    }
+  };
 
   return (
     <>
@@ -41,13 +49,11 @@ export default function AccountContent({ session }: { session: Session }) {
         <Button className="mt-8" onClick={handleSignOut}>
           Sign Out
         </Button>
-        {/* TODO: finish ability to delete account */}
-        {/* <SecondaryButton onClick={() => dialogRef.current?.showModal()}>
+        <SecondaryButton onClick={() => dialogRef.current?.showModal()}>
           Delete Account
-        </SecondaryButton> */}
+        </SecondaryButton>
       </section>
-      {/* TODO: finish ability to delete account */}
-      {/* <dialog
+      <dialog
         ref={dialogRef}
         className="relative mx-auto w-full max-w-2xl rounded-xl p-8 transition backdrop:bg-slate-900/50 open:animate-modal open:backdrop:animate-modal"
       >
@@ -65,7 +71,7 @@ export default function AccountContent({ session }: { session: Session }) {
             </SecondaryButton>
           </div>
         </form>
-      </dialog> */}
+      </dialog>
     </>
   );
 }

apps/client/src/utils/queries.ts

@@ -117,6 +117,25 @@ export async function existingHost({
   return data;
 }
 
+export type DeleteUserResponse = {
+  user: User;
+};
+
+export async function deleteUser(userId: string) {
+  const response = await fetch(`${URL}/user/${userId}`, {
+    method: "DELETE",
+    credentials: "include",
+  });
+
+  if (!response.ok) {
+    throw new Error("Failed to delete user");
+  }
+
+  const data: DeleteUserResponse = await response.json();
+
+  return data;
+}
+
 // ! ----------> ROOMS <----------
 
 export type JoinRoomResponse = {

apps/server/src/controllers/user.controller.ts

@@ -1,7 +1,7 @@
 import type { NextFunction, Request, Response } from "express";
 
 import { createRoom, joinRoom } from "../services/room.service";
-import { updateUserNickname } from "../services/user.service";
+import { deleteUser, updateUserNickname } from "../services/user.service";
 
 export async function existingHostController(
   req: Request<{}, {}, { userId: string; nickname: string }>,
@@ -28,3 +28,22 @@ export async function existingHostController(
     next(error);
   }
 }
+
+export async function deleteUserController(
+  req: Request<{ id: string }>,
+  res: Response,
+  next: NextFunction
+) {
+  try {
+    const { id } = req.params;
+
+    console.log("HEREEEE????");
+
+    const deletedUser = await deleteUser({ userId: id });
+    console.log("DELETED USER", deletedUser);
+
+    res.status(200).json({ user: deletedUser });
+  } catch (error) {
+    next(error);
+  }
+}

apps/server/src/routes/user.route.ts

@@ -1,6 +1,10 @@
 import type { Express } from "express";
-import { existingHostController } from "../controllers/user.controller";
+import {
+  deleteUserController,
+  existingHostController,
+} from "../controllers/user.controller";
 
 export function userRoutes(app: Express) {
   app.post("/user/existingHost", existingHostController);
+  app.delete("/user/:id", deleteUserController);
 }

apps/server/src/server.ts

@@ -55,7 +55,7 @@ export function buildServer() {
   app.use(express.json());
   app.use(
     cors({
-      methods: ["GET", "POST"],
+      methods: ["GET", "POST", "DELETE"],
       origin: process.env.APP_URL ?? "https://www.artificialunintelligence.gg",
       credentials: true,
     })

apps/server/src/services/user.service.ts

@@ -43,3 +43,12 @@ export async function checkUserSession({
 
   return checkDBForSession[0];
 }
+
+export async function deleteUser({ userId }: { userId: string }) {
+  const deletedUser = await db
+    .delete(users)
+    .where(eq(users.id, userId))
+    .returning();
+
+  return deletedUser[0];
+}

packages/database/drizzle/0002_romantic_meltdown.sql

@@ -0,0 +1,47 @@
+ALTER TABLE "generations" DROP CONSTRAINT "generations_user_id_users_id_fk";
+--> statement-breakpoint
+ALTER TABLE "questions_to_games" DROP CONSTRAINT "questions_to_games_question_id_questions_id_fk";
+--> statement-breakpoint
+ALTER TABLE "rooms" DROP CONSTRAINT "rooms_host_id_users_id_fk";
+--> statement-breakpoint
+ALTER TABLE "users_to_games" DROP CONSTRAINT "users_to_games_user_id_users_id_fk";
+--> statement-breakpoint
+ALTER TABLE "users_to_rooms" DROP CONSTRAINT "users_to_rooms_user_id_users_id_fk";
+--> statement-breakpoint
+ALTER TABLE "votes" DROP CONSTRAINT "votes_user_id_users_id_fk";
+--> statement-breakpoint
+DO $$ BEGIN
+ ALTER TABLE "generations" ADD CONSTRAINT "generations_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "users"("id") ON DELETE cascade ON UPDATE no action;
+EXCEPTION
+ WHEN duplicate_object THEN null;
+END $$;
+--> statement-breakpoint
+DO $$ BEGIN
+ ALTER TABLE "questions_to_games" ADD CONSTRAINT "questions_to_games_question_id_questions_id_fk" FOREIGN KEY ("question_id") REFERENCES "questions"("id") ON DELETE cascade ON UPDATE no action;
+EXCEPTION
+ WHEN duplicate_object THEN null;
+END $$;
+--> statement-breakpoint
+DO $$ BEGIN
+ ALTER TABLE "rooms" ADD CONSTRAINT "rooms_host_id_users_id_fk" FOREIGN KEY ("host_id") REFERENCES "users"("id") ON DELETE set null ON UPDATE no action;
+EXCEPTION
+ WHEN duplicate_object THEN null;
+END $$;
+--> statement-breakpoint
+DO $$ BEGIN
+ ALTER TABLE "users_to_games" ADD CONSTRAINT "users_to_games_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "users"("id") ON DELETE cascade ON UPDATE no action;
+EXCEPTION
+ WHEN duplicate_object THEN null;
+END $$;
+--> statement-breakpoint
+DO $$ BEGIN
+ ALTER TABLE "users_to_rooms" ADD CONSTRAINT "users_to_rooms_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "users"("id") ON DELETE cascade ON UPDATE no action;
+EXCEPTION
+ WHEN duplicate_object THEN null;
+END $$;
+--> statement-breakpoint
+DO $$ BEGIN
+ ALTER TABLE "votes" ADD CONSTRAINT "votes_user_id_users_id_fk" FOREIGN KEY ("user_id") REFERENCES "users"("id") ON DELETE cascade ON UPDATE no action;
+EXCEPTION
+ WHEN duplicate_object THEN null;
+END $$;