fix(admin-next, utils, medusa): Handle db errors properly and fix form (#7416)

* fix(admin-next, utils, medusa): Handle db errors properly and fix form

* fix(admin-next, utils, medusa): Handle db errors properly and fix form

* fix(admin-next, utils, medusa): Handle db errors properly and fix form

* fix(admin-next, utils, medusa): Handle db errors properly and fix form

packages/admin-next/dashboard/src/lib/is-fetch-error.ts

@@ -0,0 +1,5 @@
+import { FetchError } from "@medusajs/js-sdk"
+
+export const isFetchError = (error: any): error is FetchError => {
+  return error instanceof FetchError
+}

packages/admin-next/dashboard/src/routes/users/user-invite/components/invite-user-form/invite-user-form.tsx

@@ -2,6 +2,7 @@ import { zodResolver } from "@hookform/resolvers/zod"
 import { ArrowPath, Trash } from "@medusajs/icons"
 import { InviteDTO } from "@medusajs/types"
 import {
+  Alert,
   Button,
   Container,
   Heading,
@@ -29,6 +30,7 @@ import {
 } from "../../../../../hooks/api/invites"
 import { DataTable } from "../../../../../components/table/data-table"
 import { useUserInviteTableQuery } from "../../../../../hooks/table/query/use-user-invite-table-query"
+import { isFetchError } from "../../../../../lib/is-fetch-error.ts"
 
 const InviteUserSchema = zod.object({
   email: zod.string().email(),
@@ -74,16 +76,18 @@ export const InviteUserForm = () => {
   const { mutateAsync, isPending } = useCreateInvite()
 
   const handleSubmit = form.handleSubmit(async (values) => {
-    await mutateAsync(
-      {
-        email: values.email,
-      },
-      {
-        onSuccess: () => {
-          form.reset()
-        },
+    try {
+      await mutateAsync({ email: values.email })
+      form.reset()
+    } catch (error) {
+      if (isFetchError(error) && error.status === 400) {
+        form.setError("root", {
+          type: "manual",
+          message: error.message,
+        })
+        return
       }
-    )
+    }
   })
 
   if (isError) {
@@ -106,6 +110,17 @@ export const InviteUserForm = () => {
                   {t("users.inviteUserHint")}
                 </Text>
               </div>
+
+              {form.formState.errors.root && (
+                <Alert
+                  variant="error"
+                  dismissible={false}
+                  className="text-balance"
+                >
+                  {form.formState.errors.root.message}
+                </Alert>
+              )}
+
               <div className="flex flex-col gap-y-4">
                 <div className="grid grid-cols-2 gap-4">
                   <Form.Field