From 0cfd18ad2697d0fb3d09a549e2b549c47a36e5cf Mon Sep 17 00:00:00 2001
From: Aniket Katkar <aniketkatkar97@gmail.com>
Date: Mon, 1 Aug 2022 13:13:36 +0530
Subject: [PATCH 1/3] Fixed the error display on signup page by removing
 unnecessary teams API call.

---
 .../resources/ui/src/pages/signup/index.tsx   | 44 +------------------
 1 file changed, 1 insertion(+), 43 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
index 7708163a1f77..f0be3387a3e7 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
@@ -14,11 +14,10 @@
 import { AxiosError, AxiosResponse } from 'axios';
 import { CookieStorage } from 'cookie-storage';
 import { UserProfile } from 'Models';
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import { useHistory } from 'react-router-dom';
 import appState from '../../AppState';
 import { getLoggedInUserPermissions } from '../../axiosAPIs/miscAPI';
-import { getTeams } from '../../axiosAPIs/teamsAPI';
 import { createUser } from '../../axiosAPIs/userAPI';
 import { Button } from '../../components/buttons/Button/Button';
 import PageContainer from '../../components/containers/PageContainer';
@@ -43,14 +42,9 @@ const Signup = () => {
     name: getNameFromEmail(appState.newUser.email),
     email: appState.newUser.email || '',
   });
-  const [countTeams, setCountTeams] = useState<number>(0);
 
   const history = useHistory();
 
-  const setTeamCount = (count = 0) => {
-    setCountTeams(count);
-  };
-
   const getUserPermissions = () => {
     getLoggedInUserPermissions()
       .then((res: AxiosResponse) => {
@@ -118,24 +112,6 @@ const Signup = () => {
     }
   };
 
-  useEffect(() => {
-    getTeams('', 0)
-      .then((res) => {
-        if (res.data) {
-          setTeamCount(res.data.paging?.total || 0);
-        } else {
-          throw jsonData['api-error-messages']['unexpected-server-response'];
-        }
-      })
-      .catch((err: AxiosError) => {
-        showErrorToast(
-          err,
-          jsonData['api-error-messages']['unexpected-server-response']
-        );
-        setTeamCount(0);
-      });
-  }, []);
-
   return (
     <>
       {!loading && (
@@ -224,24 +200,6 @@ const Signup = () => {
                       filterJoinable
                       onSelectionChange={setSelectedTeams}
                     />
-
-                    {countTeams === 0 ? (
-                      <div
-                        className="tw-notification tw-bg-info tw-mt-2 tw-justify-start tw-w-full tw-p-2"
-                        data-testid="toast">
-                        <div className="tw-font-semibold tw-flex-shrink-0">
-                          <SVGIcons
-                            alt="info"
-                            icon="info"
-                            title="Info"
-                            width="16px"
-                          />
-                        </div>
-                        <div className="tw-font-semibold tw-px-1">
-                          There is no team available.
-                        </div>
-                      </div>
-                    ) : null}
                   </div>
                   <div className="tw-flex tw-my-7 tw-justify-end">
                     <Button

From 2074c3030356421d729f0ff5b2b6a778bc5820ae Mon Sep 17 00:00:00 2001
From: Aniket Katkar <aniketkatkar97@gmail.com>
Date: Mon, 1 Aug 2022 16:51:23 +0530
Subject: [PATCH 2/3] Reverting the removal of no teams alert badge.

---
 .../TeamsSelectable/TeamsSelectable.tsx       | 62 +++++++++++++------
 .../resources/ui/src/pages/signup/index.tsx   |  7 +++
 2 files changed, 49 insertions(+), 20 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx b/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx
index 468f3e5223c7..9aafe42af438 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx
@@ -20,6 +20,7 @@ import { Team } from '../../generated/entity/teams/team';
 import { EntityReference } from '../../generated/type/entityReference';
 import { formatTeamsResponse } from '../../utils/APIUtils';
 import { getEntityName } from '../../utils/CommonUtils';
+import SVGIcons from '../../utils/SvgUtils';
 import { reactSingleSelectCustomStyle } from '../common/react-select-component/reactSelectCustomStyle';
 
 interface CustomOption extends SelectableOption {
@@ -27,12 +28,16 @@ interface CustomOption extends SelectableOption {
 }
 
 interface Props {
+  showTeamsAlert?: boolean;
+  handleShowTeamsAlert?: (value: boolean) => void;
   onSelectionChange: (teams: string[]) => void;
   filterJoinable?: boolean;
   placeholder?: string;
 }
 
 const TeamsSelectable = ({
+  showTeamsAlert,
+  handleShowTeamsAlert,
   onSelectionChange,
   filterJoinable,
   placeholder = 'Search for teams',
@@ -72,6 +77,9 @@ const TeamsSelectable = ({
         }).then((res) => {
           const teams: Team[] =
             res.hits.hits.map((t: { _source: Team }) => t._source) || [];
+          if (handleShowTeamsAlert && teams.length === 0) {
+            handleShowTeamsAlert(true);
+          }
           resolve(getOptions(teams));
         });
       }
@@ -79,26 +87,40 @@ const TeamsSelectable = ({
   };
 
   return (
-    <AsyncSelect
-      cacheOptions
-      defaultOptions
-      isClearable
-      isMulti
-      aria-label="Select teams"
-      components={{
-        DropdownIndicator: null,
-      }}
-      inputValue={teamSearchText}
-      isOptionDisabled={(option) => !!(option as CustomOption).isDisabled}
-      loadOptions={loadOptions}
-      maxMenuHeight={200}
-      placeholder={placeholder}
-      styles={reactSingleSelectCustomStyle}
-      onChange={(value) => handleSelectionChange(value as SelectableOption[])}
-      onInputChange={(newText) => {
-        setTeamSearchText(newText);
-      }}
-    />
+    <>
+      <AsyncSelect
+        cacheOptions
+        defaultOptions
+        isClearable
+        isMulti
+        aria-label="Select teams"
+        components={{
+          DropdownIndicator: null,
+        }}
+        inputValue={teamSearchText}
+        isOptionDisabled={(option) => !!(option as CustomOption).isDisabled}
+        loadOptions={loadOptions}
+        maxMenuHeight={200}
+        placeholder={placeholder}
+        styles={reactSingleSelectCustomStyle}
+        onChange={(value) => handleSelectionChange(value as SelectableOption[])}
+        onInputChange={(newText) => {
+          setTeamSearchText(newText);
+        }}
+      />
+      {showTeamsAlert && (
+        <div
+          className="tw-notification tw-bg-info tw-mt-2 tw-justify-start tw-w-full tw-p-2"
+          data-testid="toast">
+          <div className="tw-font-semibold tw-flex-shrink-0">
+            <SVGIcons alt="info" icon="info" title="Info" width="16px" />
+          </div>
+          <div className="tw-font-semibold tw-px-1">
+            There is no team available.
+          </div>
+        </div>
+      )}
+    </>
   );
 };
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
index f0be3387a3e7..427078a0e064 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
@@ -42,6 +42,7 @@ const Signup = () => {
     name: getNameFromEmail(appState.newUser.email),
     email: appState.newUser.email || '',
   });
+  const [showTeamsAlert, setShowTeamsAlert] = useState<boolean>(false);
 
   const history = useHistory();
 
@@ -112,6 +113,10 @@ const Signup = () => {
     }
   };
 
+  const handleShowAlert = (value: boolean) => {
+    setShowTeamsAlert(value);
+  };
+
   return (
     <>
       {!loading && (
@@ -198,6 +203,8 @@ const Signup = () => {
                     </label>
                     <TeamsSelectable
                       filterJoinable
+                      handleShowTeamsAlert={handleShowAlert}
+                      showTeamsAlert={showTeamsAlert}
                       onSelectionChange={setSelectedTeams}
                     />
                   </div>

From a2eb35a948e8728fb92836d9bcf18b006089b7e0 Mon Sep 17 00:00:00 2001
From: Aniket Katkar <aniketkatkar97@gmail.com>
Date: Mon, 1 Aug 2022 18:31:55 +0530
Subject: [PATCH 3/3] Removed unnecessary handlers.

---
 .../src/components/TeamsSelectable/TeamsSelectable.tsx   | 9 +++------
 .../src/main/resources/ui/src/pages/signup/index.tsx     | 8 +-------
 2 files changed, 4 insertions(+), 13 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx b/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx
index 9aafe42af438..de1cbfa452d3 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/TeamsSelectable/TeamsSelectable.tsx
@@ -29,7 +29,6 @@ interface CustomOption extends SelectableOption {
 
 interface Props {
   showTeamsAlert?: boolean;
-  handleShowTeamsAlert?: (value: boolean) => void;
   onSelectionChange: (teams: string[]) => void;
   filterJoinable?: boolean;
   placeholder?: string;
@@ -37,12 +36,12 @@ interface Props {
 
 const TeamsSelectable = ({
   showTeamsAlert,
-  handleShowTeamsAlert,
   onSelectionChange,
   filterJoinable,
   placeholder = 'Search for teams',
 }: Props) => {
   const [teamSearchText, setTeamSearchText] = useState<string>('');
+  const [noTeam, setNoTeam] = useState<boolean>(false);
 
   const handleSelectionChange = (selectedOptions: SelectableOption[]) => {
     onSelectionChange(selectedOptions.map((option) => option.value));
@@ -77,9 +76,7 @@ const TeamsSelectable = ({
         }).then((res) => {
           const teams: Team[] =
             res.hits.hits.map((t: { _source: Team }) => t._source) || [];
-          if (handleShowTeamsAlert && teams.length === 0) {
-            handleShowTeamsAlert(true);
-          }
+          showTeamsAlert && setNoTeam(teams.length === 0);
           resolve(getOptions(teams));
         });
       }
@@ -108,7 +105,7 @@ const TeamsSelectable = ({
           setTeamSearchText(newText);
         }}
       />
-      {showTeamsAlert && (
+      {noTeam && (
         <div
           className="tw-notification tw-bg-info tw-mt-2 tw-justify-start tw-w-full tw-p-2"
           data-testid="toast">
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
index 427078a0e064..1b4035d05c4b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/signup/index.tsx
@@ -42,7 +42,6 @@ const Signup = () => {
     name: getNameFromEmail(appState.newUser.email),
     email: appState.newUser.email || '',
   });
-  const [showTeamsAlert, setShowTeamsAlert] = useState<boolean>(false);
 
   const history = useHistory();
 
@@ -113,10 +112,6 @@ const Signup = () => {
     }
   };
 
-  const handleShowAlert = (value: boolean) => {
-    setShowTeamsAlert(value);
-  };
-
   return (
     <>
       {!loading && (
@@ -203,8 +198,7 @@ const Signup = () => {
                     </label>
                     <TeamsSelectable
                       filterJoinable
-                      handleShowTeamsAlert={handleShowAlert}
-                      showTeamsAlert={showTeamsAlert}
+                      showTeamsAlert
                       onSelectionChange={setSelectedTeams}
                     />
                   </div>