From 7a14b0dfbc12e3d8ec7ad7a550cafafb303481f5 Mon Sep 17 00:00:00 2001 From: Amruth Pillai Date: Mon, 17 Aug 2026 22:32:32 +0200 Subject: [PATCH] refactor(settings): rename the danger zone page to account The page now holds account-level actions rather than only destructive ones, so it is reachable at /dashboard/settings/account and presented with a neutral icon in the sidebar and command palette. --- .../command-palette/pages/navigation.tsx | 12 ++--- .../pages/{danger-zone.tsx => account.tsx} | 30 +++++++------ apps/web/src/routeTree.gen.ts | 44 +++++++++---------- .../routes/dashboard/-components/sidebar.tsx | 8 ++-- .../settings/{danger-zone.tsx => account.tsx} | 10 ++--- 5 files changed, 53 insertions(+), 51 deletions(-) rename apps/web/src/features/settings/pages/{danger-zone.tsx => account.tsx} (86%) rename apps/web/src/routes/dashboard/settings/{danger-zone.tsx => account.tsx} (54%) diff --git a/apps/web/src/features/command-palette/pages/navigation.tsx b/apps/web/src/features/command-palette/pages/navigation.tsx index 763ea42ac..84fb91fef 100644 --- a/apps/web/src/features/command-palette/pages/navigation.tsx +++ b/apps/web/src/features/command-palette/pages/navigation.tsx @@ -11,7 +11,7 @@ import { ReadCvLogoIcon, ShieldCheckIcon, UserCircleIcon, - WarningIcon, + UserGearIcon, } from "@phosphor-icons/react"; import { useNavigate, useRouteContext } from "@tanstack/react-router"; import { CommandItem } from "@reactive-resume/ui/components/command"; @@ -148,12 +148,12 @@ export function NavigationCommandGroup() { onNavigate("/dashboard/settings/danger-zone")} + keywords={[t`Account`, t`Export Data`, t`Delete Account`]} + value="navigation.settings.account" + onSelect={() => onNavigate("/dashboard/settings/account")} > - - Danger Zone + + Account diff --git a/apps/web/src/features/settings/pages/danger-zone.tsx b/apps/web/src/features/settings/pages/account.tsx similarity index 86% rename from apps/web/src/features/settings/pages/danger-zone.tsx rename to apps/web/src/features/settings/pages/account.tsx index 8ba2d1bb9..384ca7fc2 100644 --- a/apps/web/src/features/settings/pages/danger-zone.tsx +++ b/apps/web/src/features/settings/pages/account.tsx @@ -5,9 +5,9 @@ import { useMutation } from "@tanstack/react-query"; import { useNavigate } from "@tanstack/react-router"; import { m } from "motion/react"; import { useState } from "react"; -import { toast } from "sonner"; import { Button } from "@reactive-resume/ui/components/button"; import { Input } from "@reactive-resume/ui/components/input"; +import { toast } from "@reactive-resume/ui/components/toast"; import { downloadWithAnchor, generateFilename } from "@reactive-resume/utils/file"; import { useConfirm } from "@/hooks/use-confirm"; import { authClient } from "@/libs/auth/client"; @@ -16,7 +16,7 @@ import { orpc } from "@/libs/orpc/client"; const CONFIRMATION_TEXT = "delete"; -export function DangerZoneSettingsPage() { +export function AccountSettingsPage() { const confirm = useConfirm(); const navigate = useNavigate(); const [confirmationText, setConfirmationText] = useState(""); @@ -29,18 +29,19 @@ export function DangerZoneSettingsPage() { onSuccess: (data) => { const blob = new Blob([JSON.stringify(data, null, 2)], { type: "application/json" }); downloadWithAnchor(blob, generateFilename("reactive-resume-export", "json")); - toast.success(t`Your data has been exported successfully.`); + toast.add({ type: "success", description: t`Your data has been exported successfully.` }); }, onError: (error) => { - toast.error( - getReadableErrorMessage( + toast.add({ + type: "error", + description: getReadableErrorMessage( error, t({ comment: "Fallback toast when data export fails", message: "Failed to export your data. Please try again.", }), ), - ); + }); }, }), ); @@ -49,36 +50,37 @@ export function DangerZoneSettingsPage() { const confirmed = await confirm(t`Are you sure you want to delete your account?`, { description: t`This action cannot be undone. All your data will be permanently deleted.`, confirmText: t({ - comment: "Account deletion confirmation dialog confirm action in danger zone", + comment: "Account deletion confirmation dialog confirm action in account settings", message: "Confirm", }), cancelText: t({ - comment: "Account deletion confirmation dialog cancel action in danger zone", + comment: "Account deletion confirmation dialog cancel action in account settings", message: "Cancel", }), }); if (!confirmed) return; - const toastId = toast.loading(t`Deleting your account...`); + const toastId = toast.add({ type: "loading", description: t`Deleting your account...` }); deleteAccount(undefined, { onSuccess: async () => { - toast.success(t`Your account has been deleted successfully.`, { id: toastId }); + toast.add({ type: "success", description: t`Your account has been deleted successfully.`, id: toastId }); await authClient.signOut(); void navigate({ to: "/" }); }, onError: (error) => { - toast.error( - getReadableErrorMessage( + toast.add({ + type: "error", + description: getReadableErrorMessage( error, t({ comment: "Fallback toast when account deletion fails", message: "Failed to delete your account. Please try again.", }), ), - { id: toastId }, - ); + id: toastId, + }); }, }); }; diff --git a/apps/web/src/routeTree.gen.ts b/apps/web/src/routeTree.gen.ts index 7fba651fc..199133267 100644 --- a/apps/web/src/routeTree.gen.ts +++ b/apps/web/src/routeTree.gen.ts @@ -32,8 +32,8 @@ import { Route as TemplatesSplatRouteImport } from "./routes/templates/$"; import { Route as BuilderResumeIdIndexRouteImport } from "./routes/builder/$resumeId/index"; import { Route as DashboardApplicationsIndexRouteImport } from "./routes/dashboard/applications/index"; import { Route as DashboardResumesIndexRouteImport } from "./routes/dashboard/resumes/index"; +import { Route as DashboardSettingsAccountRouteImport } from "./routes/dashboard/settings/account"; import { Route as DashboardSettingsApiKeysRouteImport } from "./routes/dashboard/settings/api-keys"; -import { Route as DashboardSettingsDangerZoneRouteImport } from "./routes/dashboard/settings/danger-zone"; import { Route as DashboardSettingsIntegrationsRouteRouteImport } from "./routes/dashboard/settings/integrations/route"; import { Route as DashboardSettingsJobSearchRouteImport } from "./routes/dashboard/settings/job-search"; import { Route as DashboardSettingsPreferencesRouteImport } from "./routes/dashboard/settings/preferences"; @@ -155,18 +155,18 @@ const DashboardResumesIndexRoute = DashboardResumesIndexRouteImport.update({ path: "/resumes/", getParentRoute: () => DashboardRouteRoute, } as any); +const DashboardSettingsAccountRoute = + DashboardSettingsAccountRouteImport.update({ + id: "/settings/account", + path: "/settings/account", + getParentRoute: () => DashboardRouteRoute, + } as any); const DashboardSettingsApiKeysRoute = DashboardSettingsApiKeysRouteImport.update({ id: "/settings/api-keys", path: "/settings/api-keys", getParentRoute: () => DashboardRouteRoute, } as any); -const DashboardSettingsDangerZoneRoute = - DashboardSettingsDangerZoneRouteImport.update({ - id: "/settings/danger-zone", - path: "/settings/danger-zone", - getParentRoute: () => DashboardRouteRoute, - } as any); const DashboardSettingsIntegrationsRouteRoute = DashboardSettingsIntegrationsRouteRouteImport.update({ id: "/settings/integrations", @@ -219,8 +219,8 @@ export interface FileRoutesByFullPath { "/auth/": typeof AuthIndexRoute; "/dashboard/": typeof DashboardIndexRoute; "/dashboard/settings/integrations": typeof DashboardSettingsIntegrationsRouteRoute; + "/dashboard/settings/account": typeof DashboardSettingsAccountRoute; "/dashboard/settings/api-keys": typeof DashboardSettingsApiKeysRoute; - "/dashboard/settings/danger-zone": typeof DashboardSettingsDangerZoneRoute; "/dashboard/settings/job-search": typeof DashboardSettingsJobSearchRoute; "/dashboard/settings/preferences": typeof DashboardSettingsPreferencesRoute; "/dashboard/settings/profile": typeof DashboardSettingsProfileRoute; @@ -246,8 +246,8 @@ export interface FileRoutesByTo { "/auth": typeof AuthIndexRoute; "/dashboard": typeof DashboardIndexRoute; "/dashboard/settings/integrations": typeof DashboardSettingsIntegrationsRouteRoute; + "/dashboard/settings/account": typeof DashboardSettingsAccountRoute; "/dashboard/settings/api-keys": typeof DashboardSettingsApiKeysRoute; - "/dashboard/settings/danger-zone": typeof DashboardSettingsDangerZoneRoute; "/dashboard/settings/job-search": typeof DashboardSettingsJobSearchRoute; "/dashboard/settings/preferences": typeof DashboardSettingsPreferencesRoute; "/dashboard/settings/profile": typeof DashboardSettingsProfileRoute; @@ -279,8 +279,8 @@ export interface FileRoutesById { "/auth/": typeof AuthIndexRoute; "/dashboard/": typeof DashboardIndexRoute; "/dashboard/settings/integrations": typeof DashboardSettingsIntegrationsRouteRoute; + "/dashboard/settings/account": typeof DashboardSettingsAccountRoute; "/dashboard/settings/api-keys": typeof DashboardSettingsApiKeysRoute; - "/dashboard/settings/danger-zone": typeof DashboardSettingsDangerZoneRoute; "/dashboard/settings/job-search": typeof DashboardSettingsJobSearchRoute; "/dashboard/settings/preferences": typeof DashboardSettingsPreferencesRoute; "/dashboard/settings/profile": typeof DashboardSettingsProfileRoute; @@ -312,8 +312,8 @@ export interface FileRouteTypes { | "/auth/" | "/dashboard/" | "/dashboard/settings/integrations" + | "/dashboard/settings/account" | "/dashboard/settings/api-keys" - | "/dashboard/settings/danger-zone" | "/dashboard/settings/job-search" | "/dashboard/settings/preferences" | "/dashboard/settings/profile" @@ -339,8 +339,8 @@ export interface FileRouteTypes { | "/auth" | "/dashboard" | "/dashboard/settings/integrations" + | "/dashboard/settings/account" | "/dashboard/settings/api-keys" - | "/dashboard/settings/danger-zone" | "/dashboard/settings/job-search" | "/dashboard/settings/preferences" | "/dashboard/settings/profile" @@ -371,8 +371,8 @@ export interface FileRouteTypes { | "/auth/" | "/dashboard/" | "/dashboard/settings/integrations" + | "/dashboard/settings/account" | "/dashboard/settings/api-keys" - | "/dashboard/settings/danger-zone" | "/dashboard/settings/job-search" | "/dashboard/settings/preferences" | "/dashboard/settings/profile" @@ -555,6 +555,13 @@ declare module "@tanstack/react-router" { preLoaderRoute: typeof DashboardResumesIndexRouteImport; parentRoute: typeof DashboardRouteRoute; }; + "/dashboard/settings/account": { + id: "/dashboard/settings/account"; + path: "/settings/account"; + fullPath: "/dashboard/settings/account"; + preLoaderRoute: typeof DashboardSettingsAccountRouteImport; + parentRoute: typeof DashboardRouteRoute; + }; "/dashboard/settings/api-keys": { id: "/dashboard/settings/api-keys"; path: "/settings/api-keys"; @@ -562,13 +569,6 @@ declare module "@tanstack/react-router" { preLoaderRoute: typeof DashboardSettingsApiKeysRouteImport; parentRoute: typeof DashboardRouteRoute; }; - "/dashboard/settings/danger-zone": { - id: "/dashboard/settings/danger-zone"; - path: "/settings/danger-zone"; - fullPath: "/dashboard/settings/danger-zone"; - preLoaderRoute: typeof DashboardSettingsDangerZoneRouteImport; - parentRoute: typeof DashboardRouteRoute; - }; "/dashboard/settings/integrations": { id: "/dashboard/settings/integrations"; path: "/settings/integrations"; @@ -664,8 +664,8 @@ const AuthRouteRouteWithChildren = AuthRouteRoute._addFileChildren( interface DashboardRouteRouteChildren { DashboardIndexRoute: typeof DashboardIndexRoute; DashboardSettingsIntegrationsRouteRoute: typeof DashboardSettingsIntegrationsRouteRoute; + DashboardSettingsAccountRoute: typeof DashboardSettingsAccountRoute; DashboardSettingsApiKeysRoute: typeof DashboardSettingsApiKeysRoute; - DashboardSettingsDangerZoneRoute: typeof DashboardSettingsDangerZoneRoute; DashboardSettingsJobSearchRoute: typeof DashboardSettingsJobSearchRoute; DashboardSettingsPreferencesRoute: typeof DashboardSettingsPreferencesRoute; DashboardSettingsProfileRoute: typeof DashboardSettingsProfileRoute; @@ -678,8 +678,8 @@ const DashboardRouteRouteChildren: DashboardRouteRouteChildren = { DashboardIndexRoute: DashboardIndexRoute, DashboardSettingsIntegrationsRouteRoute: DashboardSettingsIntegrationsRouteRoute, + DashboardSettingsAccountRoute: DashboardSettingsAccountRoute, DashboardSettingsApiKeysRoute: DashboardSettingsApiKeysRoute, - DashboardSettingsDangerZoneRoute: DashboardSettingsDangerZoneRoute, DashboardSettingsJobSearchRoute: DashboardSettingsJobSearchRoute, DashboardSettingsPreferencesRoute: DashboardSettingsPreferencesRoute, DashboardSettingsProfileRoute: DashboardSettingsProfileRoute, diff --git a/apps/web/src/routes/dashboard/-components/sidebar.tsx b/apps/web/src/routes/dashboard/-components/sidebar.tsx index 56eed9945..e646c815f 100644 --- a/apps/web/src/routes/dashboard/-components/sidebar.tsx +++ b/apps/web/src/routes/dashboard/-components/sidebar.tsx @@ -12,7 +12,7 @@ import { ReadCvLogoIcon, ShieldCheckIcon, UserCircleIcon, - WarningIcon, + UserGearIcon, } from "@phosphor-icons/react"; import { Link } from "@tanstack/react-router"; import { AnimatePresence, m } from "motion/react"; @@ -90,9 +90,9 @@ const settingsSidebarItems = [ href: "/dashboard/settings/integrations", }, { - icon: , - label: msg`Danger Zone`, - href: "/dashboard/settings/danger-zone", + icon: , + label: msg`Account`, + href: "/dashboard/settings/account", }, ] as const satisfies SidebarItem[]; diff --git a/apps/web/src/routes/dashboard/settings/danger-zone.tsx b/apps/web/src/routes/dashboard/settings/account.tsx similarity index 54% rename from apps/web/src/routes/dashboard/settings/danger-zone.tsx rename to apps/web/src/routes/dashboard/settings/account.tsx index 8eb93d724..e102890d6 100644 --- a/apps/web/src/routes/dashboard/settings/danger-zone.tsx +++ b/apps/web/src/routes/dashboard/settings/account.tsx @@ -1,22 +1,22 @@ import { t } from "@lingui/core/macro"; -import { WarningIcon } from "@phosphor-icons/react"; +import { UserGearIcon } from "@phosphor-icons/react"; import { createFileRoute } from "@tanstack/react-router"; import { Separator } from "@reactive-resume/ui/components/separator"; -import { DangerZoneSettingsPage } from "@/features/settings/pages/danger-zone"; +import { AccountSettingsPage } from "@/features/settings/pages/account"; import { DashboardHeader } from "../-components/header"; -export const Route = createFileRoute("/dashboard/settings/danger-zone")({ +export const Route = createFileRoute("/dashboard/settings/account")({ component: RouteComponent, }); function RouteComponent() { return (
- + - +
); }