Merge pull request #89136 from abbasifaizan70/88500

88500: Unexpected error does not appear in created report after enabling Failing network

Author: chiragsalian

src/pages/inbox/ReportScreen.tsx

@@ -2,18 +2,23 @@ import {PortalHost} from '@gorhom/portal';
 import React from 'react';
 import type {ViewStyle} from 'react-native';
 import {View} from 'react-native';
+import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import ScreenWrapper from '@components/ScreenWrapper';
 import WideRHPOverlayWrapper from '@components/WideRHPOverlayWrapper';
 import useActionListContextValue from '@hooks/useActionListContextValue';
 import {useCurrentReportIDState} from '@hooks/useCurrentReportID';
+import useOnyx from '@hooks/useOnyx';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useSubmitToDestinationVisible from '@hooks/useSubmitToDestinationVisible';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useViewportOffsetTop from '@hooks/useViewportOffsetTop';
+import {removeFailedReport} from '@libs/actions/Report';
 import getNonEmptyStringOnyxID from '@libs/getNonEmptyStringOnyxID';
+import Navigation from '@libs/Navigation/Navigation';
 import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
 import type {ReportsSplitNavigatorParamList, RightModalNavigatorParamList} from '@navigation/types';
 import CONST from '@src/CONST';
+import ONYXKEYS from '@src/ONYXKEYS';
 import SCREENS from '@src/SCREENS';
 import AccountManagerBanner from './AccountManagerBanner';
 import {AgentZeroStatusProvider} from './AgentZeroStatusContext';
@@ -63,6 +68,20 @@ function ReportScreen({route, navigation}: ReportScreenProps) {
 
     const actionListValue = useActionListContextValue();
 
+    const [reportPendingActionAndErrors] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportIDFromRoute}`, {
+        selector: (r) => ({
+            reportPendingAction: r?.pendingFields?.addWorkspaceRoom ?? r?.pendingFields?.createChat ?? r?.pendingFields?.createReport ?? r?.pendingFields?.reportName,
+            reportErrors: r?.errorFields?.addWorkspaceRoom ?? r?.errorFields?.createChat ?? r?.errorFields?.createReport,
+        }),
+    });
+    const {reportPendingAction, reportErrors} = reportPendingActionAndErrors ?? {};
+
+    const dismissReportCreationError = () => {
+        Navigation.goBack(undefined, {
+            afterTransition: () => removeFailedReport(reportIDFromRoute),
+        });
+    };
+
     return (
         <WideRHPOverlayWrapper shouldWrap={route.name === SCREENS.RIGHT_MODAL.SEARCH_REPORT}>
             <ActionListContext.Provider value={actionListValue}>
@@ -87,20 +106,30 @@ function ReportScreen({route, navigation}: ReportScreenProps) {
                                     {!shouldDeferNonEssentials && <ReportLifecycleHandler reportID={reportIDFromRoute} />}
                                     <ReportHeader />
                                     {!shouldDeferNonEssentials && <AccountManagerBanner reportID={reportIDFromRoute} />}
-                                    <View style={[styles.flex1, styles.flexRow]}>
-                                        {!shouldDeferNonEssentials && <WideRHPReceiptPanel />}
-                                        <AgentZeroStatusProvider reportID={reportIDFromRoute}>
-                                            <ConciergeDraftProvider reportID={reportIDFromRoute}>
-                                                <View
-                                                    style={[styles.flex1, styles.justifyContentEnd, styles.overflowHidden]}
-                                                    testID="report-actions-view-wrapper"
-                                                >
-                                                    <ReportActionsList />
-                                                    {shouldDeferNonEssentials ? <ReportActionComposePlaceholder /> : <ReportFooter />}
-                                                </View>
-                                            </ConciergeDraftProvider>
-                                        </AgentZeroStatusProvider>
-                                    </View>
+                                    <OfflineWithFeedback
+                                        pendingAction={reportPendingAction}
+                                        errors={reportErrors}
+                                        onClose={dismissReportCreationError}
+                                        needsOffscreenAlphaCompositing
+                                        style={styles.flex1}
+                                        contentContainerStyle={styles.flex1}
+                                        errorRowStyles={[styles.ph5, styles.mv2]}
+                                    >
+                                        <View style={[styles.flex1, styles.flexRow]}>
+                                            {!shouldDeferNonEssentials && <WideRHPReceiptPanel />}
+                                            <AgentZeroStatusProvider reportID={reportIDFromRoute}>
+                                                <ConciergeDraftProvider reportID={reportIDFromRoute}>
+                                                    <View
+                                                        style={[styles.flex1, styles.justifyContentEnd, styles.overflowHidden]}
+                                                        testID="report-actions-view-wrapper"
+                                                    >
+                                                        <ReportActionsList />
+                                                        {shouldDeferNonEssentials ? <ReportActionComposePlaceholder /> : <ReportFooter />}
+                                                    </View>
+                                                </ConciergeDraftProvider>
+                                            </AgentZeroStatusProvider>
+                                        </View>
+                                    </OfflineWithFeedback>
                                     <PortalHost name="suggestions" />
                                 </ReportDragAndDropProvider>
                             </LinkedActionNotFoundGuard>