API Refactor - DeleteWorkspace - Offline pattern 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) || hasPolicyError(policy) || hasCustomUnitsError(policy)) {
+    if (hasPolicyMemberError(policyMemberList) || hasCustomUnitsError(policy)) {
         return CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR;
     }
     return '';

src/libs/actions/Policy.js

@@ -26,7 +26,7 @@ Onyx.connect({
             return;
         }
 
-        allPolicies[key] = {...allPolicies[key], ...val};
+        allPolicies[key] = val;
     },
 });
 let sessionEmail = '';
@@ -108,32 +108,27 @@ function updateAllPolicies(policyCollection) {
 }
 
 /**
- * Delete the policy
+ * Delete the workspace
  *
- * @param {String} [policyID]
- * @returns {Promise}
+ * @param {String} policyID
  */
-function deletePolicy(policyID) {
-    return DeprecatedAPI.Policy_Delete({policyID})
-        .then((response) => {
-            if (response.jsonCode !== 200) {
-                // Show the user feedback
-                const errorMessage = Localize.translateLocal('workspace.common.growlMessageOnDeleteError');
-                Growl.error(errorMessage, 5000);
-                return;
-            }
-
-            Growl.show(Localize.translateLocal('workspace.common.growlMessageOnDelete'), CONST.GROWL.SUCCESS, 3000);
+function deleteWorkspace(policyID) {
+    const optimisticData = [
+        {
+            onyxMethod: CONST.ONYX.METHOD.MERGE,
+            key: `${ONYXKEYS.COLLECTION.POLICY}${policyID}`,
+            value: {
+                pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
+                errors: null,
+            },
+        },
+    ];
 
-            // Removing the workspace data from Onyx and local array as well
-            delete allPolicies[`${ONYXKEYS.COLLECTION.POLICY}${policyID}`];
-            return Onyx.set(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, null);
-        })
-        .then(() => Report.fetchAllReports(false))
-        .then(() => {
-            Navigation.goBack();
-            return Promise.resolve();
-        });
+    // We don't need success data since the push notification will update
+    // the onyxData for all connected clients.
+    const failureData = [];
+    const successData = [];
+    API.write('DeleteWorkspace', {policyID}, {optimisticData, successData, failureData});
 }
 
 /**
@@ -741,6 +736,18 @@ function clearAddMemberError(policyID, memberEmail) {
     });
 }
 
+/**
+ * Removes an error after trying to delete a workspace
+ *
+ * @param {String} policyID
+ */
+function clearDeleteWorkspaceError(policyID) {
+    Onyx.merge(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {
+        pendingAction: null,
+        errors: null,
+    });
+}
+
 /**
  * Generate a policy name based on an email and policy list.
  * @returns {String}
@@ -991,13 +998,14 @@ export {
     setWorkspaceErrors,
     clearCustomUnitErrors,
     hideWorkspaceAlertMessage,
-    deletePolicy,
+    deleteWorkspace,
     updateWorkspaceCustomUnit,
     updateCustomUnitRate,
     updateLastAccessedWorkspace,
     subscribeToPolicyEvents,
     clearDeleteMemberError,
     clearAddMemberError,
+    clearDeleteWorkspaceError,
     openWorkspaceReimburseView,
     generateDefaultWorkspaceName,
     updateGeneralSettings,

src/pages/settings/InitialSettingsPage.js

@@ -8,6 +8,7 @@ import styles from '../../styles/styles';
 import themeColors from '../../styles/themes/default';
 import Text from '../../components/Text';
 import * as Session from '../../libs/actions/Session';
+import * as Policy from '../../libs/actions/Policy';
 import ONYXKEYS from '../../ONYXKEYS';
 import Tooltip from '../../components/Tooltip';
 import Avatar from '../../components/Avatar';
@@ -96,6 +97,20 @@ const defaultProps = {
     ...withCurrentUserPersonalDetailsDefaultProps,
 };
 
+/**
+ * Dismisses the errors on one item
+ *
+ * @param {string} policyID
+ * @param {string} pendingAction
+ */
+function dismissWorkspaceError(policyID, pendingAction) {
+    if (pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE) {
+        Policy.clearDeleteWorkspaceError(policyID);
+        return;
+    }
+    throw new Error('Not implemented');
+}
+
 class InitialSettingsPage extends React.Component {
     constructor(props) {
         super(props);
@@ -181,6 +196,9 @@ class InitialSettingsPage extends React.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,
             }))
             .value();
         menuItems.push(...this.getDefaultMenuItems());
@@ -194,7 +212,13 @@ class InitialSettingsPage extends React.Component {
 
         if (item.isPolicy) {
             return (
-                <OfflineWithFeedback key={`${keyTitle}_${index}`} pendingAction={item.pendingAction}>
+                <OfflineWithFeedback
+                    key={`${keyTitle}_${index}`}
+                    pendingAction={item.pendingAction}
+                    errorRowStyles={styles.offlineFeedback.menuItemErrorPadding}
+                    onClose={item.dismissError}
+                    errors={item.errors}
+                >
                     <MenuItem
                         title={keyTitle}
                         icon={item.icon}
@@ -206,6 +230,7 @@ class InitialSettingsPage extends React.Component {
                         badgeText={this.getWalletBalance(isPaymentItem)}
                         fallbackIcon={item.fallbackIcon}
                         brickRoadIndicator={item.brickRoadIndicator}
+                        disabled={item.disabled}
                     />
                 </OfflineWithFeedback>
             );

src/pages/workspace/WorkspaceInitialPage.js

@@ -74,8 +74,9 @@ class WorkspaceInitialPage extends React.Component {
      * Call the delete policy and hide the modal
      */
     confirmDeleteAndHideModal() {
-        Policy.deletePolicy(this.props.policy.id);
+        Policy.deleteWorkspace(this.props.policy.id);
         this.toggleDeleteModal(false);
+        Navigation.navigate(ROUTES.SETTINGS);
     }
 
     render() {

src/styles/styles.js

@@ -2410,6 +2410,10 @@ const styles = {
         errorDot: {
             marginRight: 12,
         },
+        menuItemErrorPadding: {
+            paddingLeft: 44,
+            paddingRight: 20,
+        },
     },
 
     dotIndicatorMessage: {