Merge pull request Expensify#49588 from callstack-internal/fix/persis…

…t-network-queue-on-clear

fix: persist pending actions when clearing Onyx state

src/libs/API/index.ts

@@ -116,10 +116,10 @@ function processRequest(request: OnyxRequest, type: ApiRequestType): Promise<voi
  * @param [onyxData.failureData] - Onyx instructions that will be passed to Onyx.update() when the response has jsonCode !== 200.
  * @param [onyxData.finallyData] - Onyx instructions that will be passed to Onyx.update() when the response has jsonCode === 200 or jsonCode !== 200.
  */
-function write<TCommand extends WriteCommand>(command: TCommand, apiCommandParameters: ApiRequestCommandParameters[TCommand], onyxData: OnyxData = {}): void {
+function write<TCommand extends WriteCommand>(command: TCommand, apiCommandParameters: ApiRequestCommandParameters[TCommand], onyxData: OnyxData = {}): Promise<void | Response> {
     Log.info('[API] Called API write', false, {command, ...apiCommandParameters});
     const request = prepareRequest(command, CONST.API_REQUEST_TYPE.WRITE, apiCommandParameters, onyxData);
-    processRequest(request, CONST.API_REQUEST_TYPE.WRITE);
+    return processRequest(request, CONST.API_REQUEST_TYPE.WRITE);
 }
 
 /**

src/libs/actions/App.ts

@@ -243,10 +243,9 @@ function getOnyxDataForOpenOrReconnect(isOpenApp = false): OnyxData {
  * Fetches data needed for app initialization
  */
 function openApp() {
-    getPolicyParamsForOpenOrReconnect().then((policyParams: PolicyParamsForOpenOrReconnect) => {
+    return getPolicyParamsForOpenOrReconnect().then((policyParams: PolicyParamsForOpenOrReconnect) => {
         const params: OpenAppParams = {enablePriorityModeFilter: true, ...policyParams};
-
-        API.write(WRITE_COMMANDS.OPEN_APP, params, getOnyxDataForOpenOrReconnect(true));
+        return API.write(WRITE_COMMANDS.OPEN_APP, params, getOnyxDataForOpenOrReconnect(true));
     });
 }
 

src/pages/settings/Troubleshoot/TroubleshootPage.tsx

@@ -23,6 +23,7 @@ import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWaitForNavigation from '@hooks/useWaitForNavigation';
 import {setShouldMaskOnyxState} from '@libs/actions/MaskOnyx';
+import * as PersistedRequests from '@libs/actions/PersistedRequests';
 import ExportOnyxState from '@libs/ExportOnyxState';
 import Navigation from '@libs/Navigation/Navigation';
 import * as App from '@userActions/App';
@@ -153,8 +154,20 @@ function TroubleshootPage() {
                                 isVisible={isConfirmationModalVisible}
                                 onConfirm={() => {
                                     setIsConfirmationModalVisible(false);
+                                    // Requests in a sequential queue should be called even if the Onyx state is reset, so we do not lose any pending data.
+                                    // However, the OpenApp request must be called before any other request in a queue to ensure data consistency.
+                                    // To do that, sequential queue is cleared together with other keys, and then it's restored once the OpenApp request is resolved.
+                                    const sequentialQueue = PersistedRequests.getAll();
                                     Onyx.clear(App.KEYS_TO_PRESERVE).then(() => {
-                                        App.openApp();
+                                        App.openApp().then(() => {
+                                            if (!sequentialQueue) {
+                                                return;
+                                            }
+
+                                            sequentialQueue.forEach((request) => {
+                                                PersistedRequests.save(request);
+                                            });
+                                        });
                                     });
                                 }}
                                 onCancel={() => setIsConfirmationModalVisible(false)}