From 2e8f5a982f2e925bfa3b716f04e82d7f056aa5be Mon Sep 17 00:00:00 2001
From: Abhinav Jha <abhinav@appsmith.com>
Date: Tue, 14 Jan 2020 09:47:45 +0000
Subject: [PATCH] Fix - Invite Users

---
 .../editorComponents/form/FormFooter.tsx      |  4 +--
 app/client/src/constants/orgConstants.ts      |  1 +
 app/client/src/index.tsx                      |  5 ++++
 app/client/src/pages/Editor/index.tsx         |  1 -
 app/client/src/pages/common/PageWrapper.tsx   |  2 --
 .../pages/organization/InviteUsersForm.tsx    |  6 ++---
 .../src/selectors/organizationSelectors.tsx   | 26 ++++++++++++-------
 7 files changed, 26 insertions(+), 19 deletions(-)

diff --git a/app/client/src/components/editorComponents/form/FormFooter.tsx b/app/client/src/components/editorComponents/form/FormFooter.tsx
index e0db1c2265..b33e22284e 100644
--- a/app/client/src/components/editorComponents/form/FormFooter.tsx
+++ b/app/client/src/components/editorComponents/form/FormFooter.tsx
@@ -11,7 +11,7 @@ type FormFooterProps = {
   submitText?: string;
   cancelText?: string;
   submitOnEnter?: boolean;
-  canSubmit: boolean;
+  canSubmit?: boolean;
 };
 
 const FooterActions = styled.div`
@@ -47,7 +47,7 @@ export const FormFooter = (props: FormFooterProps) => {
             type={props.submitOnEnter ? "submit" : "button"}
             intent="primary"
             onClick={props.onSubmit}
-            disabled={!props.canSubmit}
+            disabled={props.canSubmit === false}
             loading={props.submitting}
             large
           />
diff --git a/app/client/src/constants/orgConstants.ts b/app/client/src/constants/orgConstants.ts
index 2bdfb493fc..b818a7c871 100644
--- a/app/client/src/constants/orgConstants.ts
+++ b/app/client/src/constants/orgConstants.ts
@@ -1,6 +1,7 @@
 export type OrgRole = {
   id: string;
   name: string;
+  displayName?: string;
   isDefault?: boolean;
 };
 
diff --git a/app/client/src/index.tsx b/app/client/src/index.tsx
index bd77a60b47..22e911d622 100755
--- a/app/client/src/index.tsx
+++ b/app/client/src/index.tsx
@@ -1,4 +1,5 @@
 import React, { lazy, Suspense } from "react";
+import { Helmet } from "react-helmet";
 import ReactDOM from "react-dom";
 import { Provider } from "react-redux";
 import Loader from "pages/common/Loader";
@@ -36,6 +37,10 @@ ReactDOM.render(
   <DndProvider backend={HTML5Backend}>
     <Provider store={store}>
       <ThemeProvider theme={theme}>
+        <Helmet>
+          <meta charSet="utf-8" />
+          <link rel="shortcut icon" href="/favicon-orange.ico" />
+        </Helmet>
         <Router history={history}>
           <Suspense fallback={loadingIndicator}>
             <Switch>
diff --git a/app/client/src/pages/Editor/index.tsx b/app/client/src/pages/Editor/index.tsx
index 67e418b2d1..39a43df537 100644
--- a/app/client/src/pages/Editor/index.tsx
+++ b/app/client/src/pages/Editor/index.tsx
@@ -103,7 +103,6 @@ class Editor extends Component<EditorProps> {
         <Helmet>
           <meta charSet="utf-8" />
           <title>Editor | Appsmith</title>
-          <link rel="shortcut icon" href="/favicon-orange.ico" />
         </Helmet>
         <EditorHeader
           isSaving={this.props.isSaving}
diff --git a/app/client/src/pages/common/PageWrapper.tsx b/app/client/src/pages/common/PageWrapper.tsx
index 02fb092fc8..90e17f0dee 100644
--- a/app/client/src/pages/common/PageWrapper.tsx
+++ b/app/client/src/pages/common/PageWrapper.tsx
@@ -49,9 +49,7 @@ type PageWrapperProps = {
 export const PageWrapper = (props: PageWrapperProps) => (
   <Wrapper>
     <Helmet>
-      <meta charSet="utf-8" />
       <title>{`${props.displayName} | Appsmith`}</title>
-      <link rel="shortcut icon" href="/favicon-black.ico" />
     </Helmet>
     <PageHeader />
     <PageBody>{props.children}</PageBody>
diff --git a/app/client/src/pages/organization/InviteUsersForm.tsx b/app/client/src/pages/organization/InviteUsersForm.tsx
index 8b170ab8d2..402e2d183f 100644
--- a/app/client/src/pages/organization/InviteUsersForm.tsx
+++ b/app/client/src/pages/organization/InviteUsersForm.tsx
@@ -187,10 +187,9 @@ export const InviteUsersForm = (props: InviteUsersFormProps) => {
     roles,
     initialize,
     defaultRole,
-    pristine,
+    anyTouched,
   } = props;
   const history = useHistory();
-
   useEffect(() => {
     if (!roles) {
       fetchRoles();
@@ -232,8 +231,7 @@ export const InviteUsersForm = (props: InviteUsersFormProps) => {
       <FormFooter
         divider
         onSubmit={handleSubmit(inviteUsersToOrgSubmitHandler)}
-        canSubmit={!pristine}
-        submitting={submitting && !submitFailed}
+        submitting={submitting && !(submitFailed && !anyTouched)}
         onCancel={() => history.goBack()}
         submitOnEnter={false}
         submitText={INVITE_USERS_SUBMIT_BUTTON_TEXT}
diff --git a/app/client/src/selectors/organizationSelectors.tsx b/app/client/src/selectors/organizationSelectors.tsx
index 11cbd74094..70f5f3303f 100644
--- a/app/client/src/selectors/organizationSelectors.tsx
+++ b/app/client/src/selectors/organizationSelectors.tsx
@@ -1,26 +1,32 @@
 import { createSelector } from "reselect";
 import { AppState } from "reducers";
 import { OrgRole, Org } from "constants/orgConstants";
-import _ from "lodash";
 
+export const getRolesFromState = (state: AppState) => state.ui.orgs.roles;
 export const getOrgs = (state: AppState) => state.ui.orgs.list;
 export const getCurrentUserOrgId = (state: AppState) =>
   state.ui.users.current?.currentOrganizationId;
+
 export const getCurrentOrg = createSelector(
   getOrgs,
   getCurrentUserOrgId,
   (orgs?: Org[], id?: string) => {
-    if (orgs && id) {
-      return _.find(orgs, { id: id });
+    if (id) {
+      return orgs?.find(org => org.id === id);
     }
-    return undefined;
   },
 );
 
-export const getRoles = (state: AppState): OrgRole[] | undefined => {
-  return state.ui.orgs.roles;
-};
+export const getRoles = createSelector(getRolesFromState, (roles?: OrgRole[]):
+  | OrgRole[]
+  | undefined => {
+  return roles?.map(role => ({
+    id: role.id,
+    name: role.displayName || role.name,
+    isDefault: role.isDefault,
+  }));
+});
 
-export const getDefaultRole = (state: AppState): OrgRole | undefined => {
-  return state.ui.orgs.roles?.find(role => role.isDefault);
-};
+export const getDefaultRole = createSelector(getRoles, (roles?: OrgRole[]) => {
+  return roles?.find(role => role.isDefault);
+});