From 6e2bd0ce11697cdfd59500d506e68ac22ed38273 Mon Sep 17 00:00:00 2001
From: Thomas Camlong <thomas.camlong@datadoghq.com>
Date: Fri, 10 May 2024 15:24:40 +0200
Subject: [PATCH] fix: Handle existing user when editing profile

---
 .../_components/profile.accordion.tsx         | 35 ++++++++++++++++---
 packages/api/src/router/user.ts               |  9 +++++
 2 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/apps/nextjs/src/app/[locale]/manage/users/[userId]/_components/profile.accordion.tsx b/apps/nextjs/src/app/[locale]/manage/users/[userId]/_components/profile.accordion.tsx
index b851631df..cc1051138 100644
--- a/apps/nextjs/src/app/[locale]/manage/users/[userId]/_components/profile.accordion.tsx
+++ b/apps/nextjs/src/app/[locale]/manage/users/[userId]/_components/profile.accordion.tsx
@@ -5,10 +5,15 @@ import { Button, Stack, TextInput } from "@mantine/core";
 import type { RouterOutputs } from "@homarr/api";
 import { clientApi } from "@homarr/api/client";
 import { useForm, zodResolver } from "@homarr/form";
+import {
+  showErrorNotification,
+  showSuccessNotification,
+} from "@homarr/notifications";
 import { useI18n } from "@homarr/translation/client";
 import { validation } from "@homarr/validation";
 
 import { revalidatePathAction } from "~/app/revalidatePathAction";
+import { ErrorDisplay } from "~/components/utils";
 
 interface ProfileAccordionProps {
   user: NonNullable<RouterOutputs["user"]["getById"]>;
@@ -16,11 +21,30 @@ interface ProfileAccordionProps {
 
 export const ProfileAccordion = ({ user }: ProfileAccordionProps) => {
   const t = useI18n();
-  const { mutate, isPending } = clientApi.user.editProfile.useMutation({
-    onSettled: async () => {
-      await revalidatePathAction("/manage/users");
-    },
-  });
+  const { mutate, isPending, isError, error } =
+    clientApi.user.editProfile.useMutation({
+      onError(error) {
+        showErrorNotification({
+          title: t(
+            "management.page.user.edit.section.profile.editProfile.title",
+          ),
+          message: error.message,
+        });
+      },
+      onSuccess: () => {
+        showSuccessNotification({
+          title: t(
+            "management.page.user.edit.section.profile.editProfile.title",
+          ),
+          message: t(
+            "management.page.user.edit.section.profile.editProfile.message.profileUpdated",
+          ),
+        });
+      },
+      onSettled: async () => {
+        await revalidatePathAction("/manage/users");
+      },
+    });
   const form = useForm({
     initialValues: {
       name: user.name ?? "",
@@ -41,6 +65,7 @@ export const ProfileAccordion = ({ user }: ProfileAccordionProps) => {
   return (
     <form onSubmit={form.onSubmit(handleSubmit)}>
       <Stack>
+        <ErrorDisplay hidden={!isError} message={error?.message} />
         <TextInput
           label={t("user.field.username.label")}
           withAsterisk
diff --git a/packages/api/src/router/user.ts b/packages/api/src/router/user.ts
index 58a26aaae..3c533c7da 100644
--- a/packages/api/src/router/user.ts
+++ b/packages/api/src/router/user.ts
@@ -90,7 +90,16 @@ export const userRouter = createTRPCRouter({
         .from(users)
         .where(eq(users.id, input.userId))
         .limit(1);
+      const existingUser = await ctx.db.query.users.findFirst({
+        where: eq(users.name, input.form.name),
+      });
 
+      if (existingUser !== undefined) {
+        throw new TRPCError({
+          code: "FORBIDDEN",
+          message: `User ${input.form.name} already exists`,
+        });
+      }
       const emailDirty =
         input.form.email && user[0]?.email !== input.form.email;
       await ctx.db