change(ui): handle signup error to show the notificaiton message

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>

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 });
   };

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>