Merge pull request #12117 from Expensify/justice-refactor-create-work…

…space Show errors after workspace creation failure
Expensify · Nov 1, 2022 · 5ebbde0 · 5ebbde0
2 parents 00f2766 + d0408fb
commit 5ebbde0
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 8 deletions.
diff --git a/src/libs/PolicyUtils.js b/src/libs/PolicyUtils.js
@@ -48,7 +48,7 @@ function hasCustomUnitsError(policy) {
  */
 function getPolicyBrickRoadIndicatorStatus(policy, policyMembers) {
     const policyMemberList = lodashGet(policyMembers, `${ONYXKEYS.COLLECTION.POLICY_MEMBER_LIST}${policy.id}`, {});
-    if (hasPolicyMemberError(policyMemberList) || hasCustomUnitsError(policy)) {
+    if (hasPolicyMemberError(policyMemberList) || hasCustomUnitsError(policy) || hasPolicyError(policy)) {
         return CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR;
     }
     return '';

diff --git a/src/libs/actions/Policy.js b/src/libs/actions/Policy.js
@@ -665,6 +665,15 @@ function clearDeleteWorkspaceError(policyID) {
     });
 }
 
+/**
+ * Removes the workspace after failure to create.
+ *
+ * @param {String} policyID
+ */
+function removeWorkspace(policyID) {
+    Onyx.set(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, null);
+}
+
 /**
  * Generate a policy name based on an email and policy list.
  * @param {String} [email] the email to base the workspace name on. If not passed, will use the logged in user's email instead
@@ -845,11 +854,6 @@ function createWorkspace(ownerEmail = '', makeMeAdmin = false) {
             },
         }],
         failureData: [{
-            onyxMethod: CONST.ONYX.METHOD.SET,
-            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
-            value: null,
-        },
-        {
             onyxMethod: CONST.ONYX.METHOD.SET,
             key: `${ONYXKEYS.COLLECTION.POLICY_MEMBER_LIST}${policyID}`,
             value: null,
@@ -952,4 +956,5 @@ export {
     createWorkspace,
     openWorkspaceMembersPage,
     openWorkspaceInvitePage,
+    removeWorkspace,
 };
diff --git a/src/pages/workspace/WorkspaceInitialPage.js b/src/pages/workspace/WorkspaceInitialPage.js
@@ -49,6 +49,8 @@ class WorkspaceInitialPage extends React.Component {
         this.openEditor = this.openEditor.bind(this);
         this.toggleDeleteModal = this.toggleDeleteModal.bind(this);
         this.confirmDeleteAndHideModal = this.confirmDeleteAndHideModal.bind(this);
+        this.hasPolicyCreationError = this.hasPolicyCreationError.bind(this);
+        this.dismissError = this.dismissError.bind(this);
 
         this.state = {
             isDeleteModalOpen: false,
@@ -80,6 +82,18 @@ class WorkspaceInitialPage extends React.Component {
         Navigation.navigate(ROUTES.SETTINGS);
     }
 
+    /**
+     * @returns {Boolean}
+     */
+    hasPolicyCreationError() {
+        return Boolean(this.props.policy.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD && this.props.policy.errors);
+    }
+
+    dismissError() {
+        Navigation.navigate(ROUTES.SETTINGS_WORKSPACES);
+        Policy.removeWorkspace(this.props.policy.id);
+    }
+
     render() {
         const policy = this.props.policy;
         const hasMembersError = PolicyUtils.hasPolicyMemberError(this.props.policyMemberList);
@@ -159,11 +173,17 @@ class WorkspaceInitialPage extends React.Component {
                             styles.justifyContentBetween,
                         ]}
                     >
-                        <OfflineWithFeedback pendingAction={this.props.policy.pendingAction}>
+                        <OfflineWithFeedback
+                            pendingAction={this.props.policy.pendingAction}
+                            onClose={this.dismissError}
+                            errors={this.props.policy.errors}
+                            errorRowStyles={[styles.ph6, styles.pv2]}
+                        >
                             <View style={[styles.flex1]}>
                                 <View style={styles.pageWrapper}>
                                     <View style={[styles.settingsPageBody, styles.alignItemsCenter]}>
                                         <Pressable
+                                            disabled={this.hasPolicyCreationError()}
                                             style={[styles.pRelative, styles.avatarLarge]}
                                             onPress={this.openEditor}
                                         >
@@ -188,6 +208,7 @@ class WorkspaceInitialPage extends React.Component {
                                         </Pressable>
                                         {!_.isEmpty(this.props.policy.name) && (
                                             <Pressable
+                                                disabled={this.hasPolicyCreationError()}
                                                 style={[
                                                     styles.alignSelfCenter,
                                                     styles.mt4,
@@ -214,6 +235,8 @@ class WorkspaceInitialPage extends React.Component {
                                 {_.map(menuItems, item => (
                                     <MenuItem
                                         key={item.translationKey}
+                                        disabled={this.hasPolicyCreationError()}
+                                        interactive={!this.hasPolicyCreationError()}
                                         title={this.props.translate(item.translationKey)}
                                         icon={item.icon}
                                         iconRight={item.iconRight}

diff --git a/src/pages/workspace/WorkspacesListPage.js b/src/pages/workspace/WorkspacesListPage.js
@@ -80,6 +80,11 @@ function dismissWorkspaceError(policyID, pendingAction) {
         Policy.clearDeleteWorkspaceError(policyID);
         return;
     }
+
+    if (pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD) {
+        Policy.removeWorkspace(policyID);
+        return;
+    }
     throw new Error('Not implemented');
 }
 
@@ -122,7 +127,6 @@ class WorkspacesListPage extends Component {
                 brickRoadIndicator: PolicyUtils.getPolicyBrickRoadIndicatorStatus(policy, this.props.policyMembers),
                 pendingAction: policy.pendingAction,
                 isPolicy: true,
-                errors: policy.errors,
                 dismissError: () => dismissWorkspaceError(policy.id, policy.pendingAction),
                 disabled: policy.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
             }))