fix: Handle existing user when editing profile

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

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