feat: add deleteUser endpoint.

Author: missionmike

jest.setup.ts

@@ -1 +1,18 @@
 import "@testing-library/jest-dom";
+import React from "react";
+
+// Polyfill fetch for tests
+if (!global.fetch) {
+  global.fetch = jest.fn();
+}
+
+// Mock @iconify/react Icon component
+jest.mock("@iconify/react", () => ({
+  Icon: ({ icon, ...props }: any) => {
+    return React.createElement("span", {
+      "data-testid": "icon",
+      "data-icon": icon,
+      ...props,
+    });
+  },
+}));

prisma/migrations/20250713220124_fix_cascade_delete_constraints/migration.sql

@@ -0,0 +1,11 @@
+-- DropForeignKey
+ALTER TABLE "ampdresume"."Position" DROP CONSTRAINT "Position_companyId_fkey";
+
+-- DropForeignKey
+ALTER TABLE "ampdresume"."Project" DROP CONSTRAINT "Project_positionId_fkey";
+
+-- AddForeignKey
+ALTER TABLE "ampdresume"."Project" ADD CONSTRAINT "Project_positionId_fkey" FOREIGN KEY ("positionId") REFERENCES "ampdresume"."Position"("id") ON DELETE CASCADE ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "ampdresume"."Position" ADD CONSTRAINT "Position_companyId_fkey" FOREIGN KEY ("companyId") REFERENCES "ampdresume"."Company"("id") ON DELETE CASCADE ON UPDATE CASCADE;

prisma/migrations/migration_lock.toml

@@ -1,3 +1,3 @@
 # Please do not edit this file manually
 # It should be added in your version-control system (e.g., Git)
-provider = "postgresql"
+provider = "postgresql"

prisma/schema.prisma

@@ -166,7 +166,7 @@ model Project {
   positionId       String
   /// Used for sorting projects
   sortIndex        Int               @default(0)
-  position         Position          @relation(fields: [positionId], references: [id])
+  position         Position          @relation(fields: [positionId], references: [id], onDelete: Cascade)
   skillsForProject SkillForProject[]
 
   @@schema("ampdresume")
@@ -180,7 +180,7 @@ model Position {
   startDate DateTime
   endDate   DateTime?
   companyId String
-  company   Company   @relation(fields: [companyId], references: [id])
+  company   Company   @relation(fields: [companyId], references: [id], onDelete: Cascade)
   projects  Project[]
 
   @@schema("ampdresume")

src/app/edit/profile/__snapshots__/page.test.tsx.snap

@@ -799,6 +799,45 @@ exports[`Page renders correctly for authenticated users 1`] = `
             Save
           </button>
         </div>
+        <div
+          class="MuiBox-root css-1txpdkw"
+        >
+          <h6
+            class="MuiTypography-root MuiTypography-h6 css-1hd3wng-MuiTypography-root"
+          >
+            Danger Zone
+          </h6>
+          <div
+            class="MuiBox-root css-0"
+          >
+            <button
+              class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedSecondary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorSecondary MuiButton-root MuiButton-outlined MuiButton-outlinedSecondary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorSecondary css-1xpw6mv-MuiButtonBase-root-MuiButton-root"
+              tabindex="0"
+              type="button"
+            >
+              Delete Account
+            </button>
+            <button
+              aria-label="Permanently delete your account and all data"
+              class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall css-lk7kvc-MuiButtonBase-root-MuiIconButton-root"
+              data-mui-internal-clone-element="true"
+              tabindex="0"
+              type="button"
+            >
+              <svg
+                aria-hidden="true"
+                class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall css-120dh41-MuiSvgIcon-root"
+                data-testid="InfoOutlinedIcon"
+                focusable="false"
+                viewBox="0 0 24 24"
+              >
+                <path
+                  d="M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8"
+                />
+              </svg>
+            </button>
+          </div>
+        </div>
       </form>
     </div>
   </div>

src/app/edit/profile/components/AccountForm.test.tsx

@@ -4,6 +4,7 @@ import { fireEvent, render, waitFor } from "@testing-library/react";
 
 import { AccountForm } from "./AccountForm";
 import React from "react";
+import { SessionProvider } from "next-auth/react";
 import { useIsDesktop } from "@/hooks/useIsDesktop";
 
 jest.mock("@/hooks/useIsDesktop", () => ({
@@ -19,6 +20,30 @@ jest.mock("./SocialsForm", () => ({
   SocialsForm: () => <div>SocialsForm</div>,
 }));
 
+jest.mock("@/graphql/deleteUser", () => ({
+  deleteUser: jest.fn(),
+}));
+
+jest.mock("next-auth/react", () => ({
+  ...jest.requireActual("next-auth/react"),
+  useSession: () => ({
+    data: {
+      user: {
+        id: "test-user-id",
+        email: "[email protected]",
+      },
+    },
+    status: "authenticated",
+  }),
+  signOut: jest.fn(),
+}));
+
+jest.mock("next/navigation", () => ({
+  useRouter: () => ({
+    push: jest.fn(),
+  }),
+}));
+
 const mockProps = {
   name: "John Doe",
   slug: "john-doe",
@@ -30,14 +55,18 @@ const mockProps = {
   siteImage: "https://example.com/image.png",
 };
 
+const renderWithSession = (component: React.ReactElement) => {
+  return render(<SessionProvider>{component}</SessionProvider>);
+};
+
 describe("AccountForm", () => {
   beforeEach(() => {
     jest.clearAllMocks();
     (useIsDesktop as jest.Mock).mockReturnValue(true);
   });
 
   it("renders correctly", () => {
-    const { container, getByLabelText } = render(<AccountForm {...mockProps} />);
+    const { container, getByLabelText } = renderWithSession(<AccountForm {...mockProps} />);
 
     expect(getByLabelText("Full Name")).toBeInTheDocument();
     expect(getByLabelText("URL Name")).toBeInTheDocument();
@@ -49,7 +78,7 @@ describe("AccountForm", () => {
   });
 
   it("handles input changes and validation", async () => {
-    const { getByLabelText, getByText } = render(<AccountForm {...mockProps} />);
+    const { getByLabelText, getByText } = renderWithSession(<AccountForm {...mockProps} />);
 
     const slugInput = getByLabelText("URL Name");
     fireEvent.change(slugInput, { target: { value: "invalid slug" } });
@@ -69,7 +98,7 @@ describe("AccountForm", () => {
       }),
     ) as jest.Mock;
 
-    const { getByLabelText, getByText } = render(<AccountForm {...mockProps} />);
+    const { getByLabelText, getByText } = renderWithSession(<AccountForm {...mockProps} />);
 
     fireEvent.change(getByLabelText("Full Name"), { target: { value: "Jane Doe" } });
     fireEvent.change(getByLabelText("URL Name"), { target: { value: "jane-doe" } });
@@ -90,7 +119,7 @@ describe("AccountForm", () => {
       }),
     ) as jest.Mock;
 
-    const { getByLabelText, getByText } = render(<AccountForm {...mockProps} />);
+    const { getByLabelText, getByText } = renderWithSession(<AccountForm {...mockProps} />);
 
     fireEvent.change(getByLabelText("Full Name"), { target: { value: "Jane Doe" } });
     fireEvent.change(getByLabelText("URL Name"), { target: { value: "jane-doe" } });
@@ -104,7 +133,7 @@ describe("AccountForm", () => {
   });
 
   it("displays error message on form submission failure for invalid name", async () => {
-    const { getByLabelText, getByText } = render(<AccountForm {...mockProps} />);
+    const { getByLabelText, getByText } = renderWithSession(<AccountForm {...mockProps} />);
 
     fireEvent.change(getByLabelText("Full Name"), { target: { value: "   " } });
     fireEvent.click(getByText("Save"));
@@ -115,7 +144,7 @@ describe("AccountForm", () => {
   });
 
   it("displays error message on form submission failure for invalid slug", async () => {
-    const { getByLabelText, getByText } = render(<AccountForm {...mockProps} />);
+    const { getByLabelText, getByText } = renderWithSession(<AccountForm {...mockProps} />);
 
     fireEvent.change(getByLabelText("URL Name"), { target: { value: "   " } });
     fireEvent.click(getByText("Save"));
@@ -126,7 +155,7 @@ describe("AccountForm", () => {
   });
 
   it("displays error message on form submission failure for invalid email", async () => {
-    const { getByLabelText, getByText } = render(<AccountForm {...mockProps} />);
+    const { getByLabelText, getByText } = renderWithSession(<AccountForm {...mockProps} />);
 
     const emailInput = getByLabelText("Display Email");
     fireEvent.change(emailInput, { target: { value: "invalid-email" } });

src/app/edit/profile/components/AccountForm.tsx

@@ -6,6 +6,7 @@ import React, { useEffect, useState } from "react";
 
 import AccountBoxIcon from "@mui/icons-material/AccountBox";
 import BadgeIcon from "@mui/icons-material/Badge";
+import { DeleteWithConfirmation } from "../../components/DeleteWithConfirmation";
 import LanguageIcon from "@mui/icons-material/Language";
 import LinkIcon from "@mui/icons-material/Link";
 import { LoadingOverlay } from "@/components/LoadingOverlay";
@@ -15,7 +16,11 @@ import { MessageDialog } from "@/components/MessageDialog";
 import { SocialsForm } from "./SocialsForm";
 import TocIcon from "@mui/icons-material/Toc";
 import { UserAssetInput } from "../../components/UserAssetInput";
+import { deleteUser } from "@/graphql/deleteUser";
+import { signOut } from "next-auth/react";
 import { useIsDesktop } from "@/hooks/useIsDesktop";
+import { useRouter } from "next/navigation";
+import { useSession } from "next-auth/react";
 
 const AccountForm = ({
   name,
@@ -50,8 +55,11 @@ const AccountForm = ({
   const [loading, setLoading] = useState(false);
   const [message, setMessage] = useState("");
   const [showSlugPopup, setShowSlugPopup] = useState(slug.length === 0);
+  const [isDeletingAccount, setIsDeletingAccount] = useState(false);
   const isDesktop = useIsDesktop();
   const slugInputRef = React.useRef<HTMLInputElement>(null);
+  const { data: session } = useSession();
+  const router = useRouter();
 
   const [siteImageUrl, setSiteImageUrl] = useState(siteImage);
 
@@ -161,14 +169,39 @@ const AccountForm = ({
     setTimeout(() => slugInputRef.current?.focus(), 100);
   };
 
+  const handleDeleteAccount = async () => {
+    if (!session?.user?.id) {
+      setMessage("You need to be signed in to delete your account.");
+      return;
+    }
+
+    setIsDeletingAccount(true);
+    setLoading(true);
+
+    try {
+      await deleteUser({ userId: session.user.id });
+
+      // Clear auth and redirect to homepage
+      await signOut({ callbackUrl: "/" });
+      router.push("/");
+    } catch {
+      setMessage("Failed to delete account. Please try again.");
+      setIsDeletingAccount(false);
+      setLoading(false);
+    }
+  };
+
   return (
     <Box
       sx={{
         display: "flex",
         flexDirection: "column",
       }}
     >
-      <LoadingOverlay open={loading} message="Saving..." />
+      <LoadingOverlay
+        open={loading}
+        message={isDeletingAccount ? "Deleting account..." : "Saving..."}
+      />
       <MessageDialog
         open={message?.length > 0}
         message={message}
@@ -401,6 +434,40 @@ const AccountForm = ({
             Save
           </Button>
         </Box>
+        <Box
+          sx={{
+            display: "flex",
+            justifyContent: "center",
+            alignItems: "center",
+            flexDirection: "column",
+            padding: "32px 0",
+            borderTop: "1px solid",
+            borderColor: "divider",
+          }}
+        >
+          <Typography variant="h6" sx={{ mb: 2 }}>
+            Danger Zone
+          </Typography>
+          <DeleteWithConfirmation
+            onConfirmDelete={handleDeleteAccount}
+            buttonLabel="Delete Account"
+            tooltip="Permanently delete your account and all data"
+            dialogTitle="Delete Account"
+            dialogMessage={
+              <Typography>
+                Are you sure you want to delete your account? This action cannot be undone and will
+                permanently remove:
+                <br />• Your profile and all personal information
+                <br />• All your skills, projects, work experience, and education
+                <br />• Your authentication history
+                <br />• All associated data
+              </Typography>
+            }
+            confirmLabel="Yes, Delete My Account"
+            cancelLabel="Cancel"
+            disabled={isDeletingAccount}
+          />
+        </Box>
       </Box>
     </Box>
   );

src/app/edit/profile/components/__snapshots__/AccountForm.test.tsx.snap

@@ -630,6 +630,45 @@ exports[`AccountForm renders correctly 1`] = `
           Save
         </button>
       </div>
+      <div
+        class="MuiBox-root css-1txpdkw"
+      >
+        <h6
+          class="MuiTypography-root MuiTypography-h6 css-1hd3wng-MuiTypography-root"
+        >
+          Danger Zone
+        </h6>
+        <div
+          class="MuiBox-root css-0"
+        >
+          <button
+            class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedSecondary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorSecondary MuiButton-root MuiButton-outlined MuiButton-outlinedSecondary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorSecondary css-1xpw6mv-MuiButtonBase-root-MuiButton-root"
+            tabindex="0"
+            type="button"
+          >
+            Delete Account
+          </button>
+          <button
+            aria-label="Permanently delete your account and all data"
+            class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall css-lk7kvc-MuiButtonBase-root-MuiIconButton-root"
+            data-mui-internal-clone-element="true"
+            tabindex="0"
+            type="button"
+          >
+            <svg
+              aria-hidden="true"
+              class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall css-120dh41-MuiSvgIcon-root"
+              data-testid="InfoOutlinedIcon"
+              focusable="false"
+              viewBox="0 0 24 24"
+            >
+              <path
+                d="M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8"
+              />
+            </svg>
+          </button>
+        </div>
+      </div>
     </form>
   </div>
 </div>

src/app/edit/profile/page.test.tsx

@@ -7,11 +7,16 @@ import Page from "./page";
 import { getSession } from "@/lib/auth";
 import { prisma } from "@/lib/prisma";
 import { useSession } from "next-auth/react";
+import { useRouter } from "next/navigation";
 
 jest.mock("next-auth/react", () => ({
   useSession: jest.fn(),
 }));
 
+jest.mock("next/navigation", () => ({
+  useRouter: jest.fn(),
+}));
+
 jest.mock("@tanstack/react-query", () => ({
   useQueryClient: jest.fn(),
   useQuery: jest.fn(),
@@ -50,6 +55,7 @@ describe("Page", () => {
     (useQuery as jest.Mock).mockReturnValue({ isPending: false, data: [] });
     (useMutation as jest.Mock).mockReturnValue({ mutate: jest.fn() });
     (useQueryClient as jest.Mock).mockReturnValue({ invalidateQueries: jest.fn() });
+    (useRouter as jest.Mock).mockReturnValue({ push: jest.fn() });
 
     (getSession as jest.Mock).mockResolvedValue({
       user: { id: "user-id" },