From 65d720debf35610b510e5f450cde10ea7359605e Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Tue, 7 Nov 2023 17:19:39 +0100
Subject: [PATCH] change(ui): handle signup error to show the notificaiton
 message

---
 frontend/app/Router.tsx                                  | 2 --
 frontend/app/components/Signup/SignupForm/SignupForm.tsx | 5 +++++
 frontend/app/initialize.tsx                              | 2 ++
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/frontend/app/Router.tsx b/frontend/app/Router.tsx
index 3b52a0e0f..6fdf6c586 100644
--- a/frontend/app/Router.tsx
+++ b/frontend/app/Router.tsx
@@ -1,7 +1,6 @@
 import React, { useEffect, useRef } from 'react';
 import { withRouter, RouteComponentProps } from 'react-router-dom';
 import { connect, ConnectedProps } from 'react-redux';
-import { Notification } from 'UI';
 import { Loader } from 'UI';
 import { fetchUserInfo, setJwt } from 'Duck/user';
 import { fetchList as fetchSiteList } from 'Duck/site';
@@ -140,7 +139,6 @@ const Router: React.FC<RouterProps> = (props) => {
     <ModalProvider>
       <Loader loading={loading || !siteId} className='flex-1'>
         <Layout hideHeader={hideHeader} siteId={siteId}>
-          <Notification />
           <PrivateRoutes />
         </Layout>
       </Loader>
diff --git a/frontend/app/components/Signup/SignupForm/SignupForm.tsx b/frontend/app/components/Signup/SignupForm/SignupForm.tsx
index 091400647..ebc2ffe40 100644
--- a/frontend/app/components/Signup/SignupForm/SignupForm.tsx
+++ b/frontend/app/components/Signup/SignupForm/SignupForm.tsx
@@ -9,6 +9,7 @@ import { SITE_ID_STORAGE_KEY } from 'App/constants/storageKeys';
 import { validatePassword } from 'App/validate';
 import { PASSWORD_POLICY } from 'App/constants';
 import { Alert, Space } from 'antd';
+import { toast } from 'react-toastify';
 
 const LOGIN_ROUTE = login();
 
@@ -55,6 +56,10 @@ const SignupForm: React.FC<SignupFormProps> = ({ tenants, errors, loading, signu
       organizationName,
       auth,
       'g-recaptcha-response': token
+    }).then((resp: any) => {
+      if (resp && resp.errors && Array.isArray(resp.errors) && resp.errors.length > 0) {
+        resp.errors[0] ? toast.error(resp.errors[0]) : toast.error('Something went wrong');
+      }
     });
     setState({ ...state, reload: true });
   };
diff --git a/frontend/app/initialize.tsx b/frontend/app/initialize.tsx
index 0157f48de..deae81c17 100644
--- a/frontend/app/initialize.tsx
+++ b/frontend/app/initialize.tsx
@@ -11,6 +11,7 @@ import { DndProvider } from 'react-dnd';
 import { ConfigProvider, theme, ThemeConfig } from 'antd';
 import colors from 'App/theme/colors';
 import { BrowserRouter } from 'react-router-dom';
+import { Notification } from 'UI';
 
 // @ts-ignore
 window.getCommitHash = () => console.log(window.env.COMMIT_HASH);
@@ -74,6 +75,7 @@ document.addEventListener('DOMContentLoaded', () => {
         <StoreProvider store={new RootStore()}>
           <DndProvider backend={HTML5Backend}>
             <BrowserRouter>
+              <Notification />
               <Router />
             </BrowserRouter>
           </DndProvider>