Show toast after succesful signup

Vizzuality · Nov 18, 2024 · 418f001 · 418f001
1 parent 3158e8c
commit 418f001
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 2 deletions.
diff --git a/client/src/containers/auth/signup/form/index.tsx b/client/src/containers/auth/signup/form/index.tsx
@@ -23,6 +23,7 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
+import { useToast } from "@/components/ui/toast/use-toast";
 
 import { signUpAction } from "./action";
 import { signUpSchemaForm } from "./schema";
@@ -33,6 +34,7 @@ const TokenSignUpForm: FC = () => {
     ok: undefined,
     message: "",
   });
+  const { toast } = useToast();
 
   const formRef = useRef<HTMLFormElement>(null);
   const form = useForm<z.infer<typeof signUpSchemaForm>>({
@@ -47,9 +49,13 @@ const TokenSignUpForm: FC = () => {
 
   useEffect(() => {
     if (status.ok) {
+      toast({
+        description:
+          "Sign up successful! Please check your email to verify your account.",
+      });
       push("/auth/signin");
     }
-  }, [status, push]);
+  }, [status, push, toast]);
 
   return (
     <>

diff --git a/e2e/tests/auth/sign-up.spec.ts b/e2e/tests/auth/sign-up.spec.ts
@@ -42,8 +42,18 @@ test.describe("Auth - Sign Up", () => {
 
     await page.getByRole("button", { name: /Create account/i }).click();
 
+    await expect(
+      // Has to be a more specific selector targeting the notification list item
+      page.getByRole("list").getByRole("status").filter({
+        hasText:
+          "Sign up successful! Please check your email to verify your account.",
+      }),
+    ).toBeVisible();
+
     await page.waitForURL("/auth/signin");
-    await expect(page.getByText("Welcome to Blue Carbon Cost")).toBeVisible();
+    await expect(
+      page.getByText("Welcome to Blue Carbon Cost", { exact: true }),
+    ).toBeVisible();
 
     const registeredUser = await testManager
       .getDataSource()