add offline check

Signed-off-by: Tsaqif <tsaiinkwa@yahoo.com>

Author: tsa321

src/components/ReportSearchHeader/index.tsx

@@ -10,8 +10,8 @@ function ReportSearchHeader({report, style, transactions, avatarBorderColor}: Re
     const {isLargeScreenWidth} = useResponsiveLayout();
 
     const statusContainerStyle = useMemo(() => {
-        return [isLargeScreenWidth ? styles.mt1 : styles.mt0Half, report?.isReportStatePending && styles.offlineFeedbackPending];
-    }, [isLargeScreenWidth, styles.mt1, styles.mt0Half, report?.isReportStatePending, styles.offlineFeedbackPending]);
+        return [isLargeScreenWidth ? styles.mt1 : styles.mt0Half, report?.shouldShowStatusAsPending && styles.offlineFeedbackPending];
+    }, [isLargeScreenWidth, styles.mt1, styles.mt0Half, report?.shouldShowStatusAsPending, styles.offlineFeedbackPending]);
 
     const middleContent = useMemo(() => {
         return (

src/components/Search/index.tsx

@@ -420,11 +420,13 @@ function Search({
             queryJSON,
             isActionLoadingSet,
             cardFeeds,
+            isOffline,
             allTransactionViolations: violations,
         });
         return [filteredData1, filteredData1.length, allLength];
     }, [
         searchKey,
+        isOffline,
         exportReportActions,
         validGroupBy,
         isDataLoaded,

src/components/SelectionListWithSections/Search/ExpenseReportListItemRow.tsx

@@ -113,7 +113,7 @@ function ExpenseReportListItemRow({
                 <StatusCell
                     stateNum={item.stateNum}
                     statusNum={item.statusNum}
-                    isPending={item.isReportStatePending}
+                    isPending={item.shouldShowStatusAsPending}
                 />
             </View>
         ),

src/components/SelectionListWithSections/types.ts

@@ -448,8 +448,8 @@ type TransactionReportGroupListItemType = TransactionGroupListItemType & {groupe
         /** The date the report was exported */
         exported?: string;
 
-        /** Whether the report's state/status is pending */
-        isReportStatePending?: boolean;
+        /** Whether the status field should be shown in a pending state */
+        shouldShowStatusAsPending?: boolean;
 
         /**
          * Whether we should show the report year.

src/libs/SearchUIUtils.ts

@@ -165,6 +165,7 @@ type GetReportSectionsParams = {
     translate: LocalizedTranslate;
     formatPhoneNumber: LocaleContextProps['formatPhoneNumber'];
     isActionLoadingSet: ReadonlySet<string> | undefined;
+    isOffline: boolean | undefined;
     allTransactionViolations: OnyxCollection<OnyxTypes.TransactionViolation[]>;
     bankAccountList: OnyxEntry<OnyxTypes.BankAccountList>;
     reportActions?: Record<string, OnyxTypes.ReportAction[]>;
@@ -405,6 +406,7 @@ type GetSectionsParams = {
     archivedReportsIDList?: ArchivedReportsIDSet;
     queryJSON?: SearchQueryJSON;
     isActionLoadingSet?: ReadonlySet<string>;
+    isOffline?: boolean;
     cardFeeds?: OnyxCollection<OnyxTypes.CardFeeds>;
     allTransactionViolations?: OnyxCollection<OnyxTypes.TransactionViolation[]>;
 };
@@ -1820,6 +1822,7 @@ function getReportSections({
     currentAccountID,
     currentUserEmail,
     translate,
+    isOffline,
     formatPhoneNumber,
     isActionLoadingSet,
     allTransactionViolations,
@@ -1911,7 +1914,7 @@ function getReportSections({
                 const policyFromKey = getPolicyFromKey(data, reportItem);
                 const policy = policies?.[`${ONYXKEYS.COLLECTION.POLICY}${reportItem?.policyID ?? String(CONST.DEFAULT_NUMBER_ID)}`] ?? policyFromKey;
 
-                const isReportStatePending = reportItem?.pendingFields?.nextStep === CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE;
+                const shouldShowStatusAsPending = isOffline && reportItem?.pendingFields?.nextStep === CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE;
 
                 const hasAnyViolationsForReport = hasAnyViolations(
                     reportItem.reportID,
@@ -1945,8 +1948,8 @@ function getReportSections({
                     formattedFrom,
                     formattedTo,
                     formattedStatus,
-                    isReportStatePending,
                     transactions,
+                    shouldShowStatusAsPending,
                     ...(reportPendingAction ? {pendingAction: reportPendingAction} : {}),
                     shouldShowYear: shouldShowYearCreatedReport,
                     shouldShowYearSubmitted: shouldShowYearSubmittedReport,
@@ -2355,6 +2358,7 @@ function getSections({
     archivedReportsIDList,
     queryJSON,
     isActionLoadingSet,
+    isOffline,
     cardFeeds,
     allTransactionViolations,
 }: GetSectionsParams) {
@@ -2373,6 +2377,7 @@ function getSections({
             currentAccountID,
             currentUserEmail,
             translate,
+            isOffline,
             formatPhoneNumber,
             isActionLoadingSet,
             allTransactionViolations,

tests/unit/Search/SearchUIUtilsTest.ts

@@ -1069,7 +1069,7 @@ const transactionReportGroupListItems = [
         },
         hasVisibleViolations: false,
         isOneTransactionReport: true,
-        isReportStatePending: false,
+        shouldShowStatusAsPending: false,
         isWaitingOnBankAccount: false,
         keyForList: '123456789',
         managerID: 18439984,
@@ -1171,7 +1171,7 @@ const transactionReportGroupListItems = [
         },
         hasVisibleViolations: true,
         isOneTransactionReport: true,
-        isReportStatePending: false,
+        shouldShowStatusAsPending: false,
         isWaitingOnBankAccount: false,
         keyForList: '11111',
         managerID: 18439984,
@@ -1280,7 +1280,7 @@ const transactionReportGroupListItems = [
         formattedTo: 'Approver',
         hasVisibleViolations: false,
         isOneTransactionReport: false,
-        isReportStatePending: false,
+        shouldShowStatusAsPending: false,
         isOwnPolicyExpenseChat: false,
         isWaitingOnBankAccount: false,
         managerID: 1111111,
@@ -1461,7 +1461,7 @@ const transactionReportGroupListItems = [
         },
         hasVisibleViolations: false,
         isOneTransactionReport: true,
-        isReportStatePending: false,
+        shouldShowStatusAsPending: false,
         isWaitingOnBankAccount: false,
         keyForList: reportID5,
         managerID: 18439984,