Align default IDs in ReportScreen file

.eslintrc.changed.js

@@ -24,7 +24,6 @@ module.exports = {
             files: [
                 'src/libs/actions/IOU.ts',
                 'src/libs/actions/Report.ts',
-                'src/pages/home/ReportScreen.tsx',
                 'src/pages/workspace/WorkspaceInitialPage.tsx',
                 'src/pages/home/report/PureReportActionItem.tsx',
                 'src/libs/SidebarUtils.ts',

src/ROUTES.ts

@@ -297,7 +297,10 @@ const ROUTES = {
     REPORT: 'r',
     REPORT_WITH_ID: {
         route: 'r/:reportID?/:reportActionID?',
-        getRoute: (reportID: string, reportActionID?: string, referrer?: string) => {
+        getRoute: (reportID: string | undefined, reportActionID?: string, referrer?: string) => {
+            if (!reportID) {
+                Log.warn('Invalid reportID is used to build the REPORT_WITH_ID route');
+            }
             const baseRoute = reportActionID ? (`r/${reportID}/${reportActionID}` as const) : (`r/${reportID}` as const);
             const referrerParam = referrer ? `?referrer=${encodeURIComponent(referrer)}` : '';
             return `${baseRoute}${referrerParam}` as const;
@@ -363,7 +366,12 @@ const ROUTES = {
     },
     REPORT_WITH_ID_DETAILS: {
         route: 'r/:reportID/details',
-        getRoute: (reportID: string | undefined, backTo?: string) => getUrlWithBackToParam(`r/${reportID}/details`, backTo),
+        getRoute: (reportID: string | undefined, backTo?: string) => {
+            if (!reportID) {
+                Log.warn('Invalid reportID is used to build the REPORT_WITH_ID_DETAILS route');
+            }
+            return getUrlWithBackToParam(`r/${reportID}/details`, backTo);
+        },
     },
     REPORT_WITH_ID_DETAILS_EXPORT: {
         route: 'r/:reportID/details/export/:connectionName',
@@ -399,7 +407,12 @@ const ROUTES = {
     },
     REPORT_DESCRIPTION: {
         route: 'r/:reportID/description',
-        getRoute: (reportID: string | undefined, backTo?: string) => getUrlWithBackToParam(`r/${reportID}/description` as const, backTo),
+        getRoute: (reportID: string | undefined, backTo?: string) => {
+            if (!reportID) {
+                Log.warn('Invalid reportID is used to build the REPORT_DESCRIPTION route');
+            }
+            return getUrlWithBackToParam(`r/${reportID}/description` as const, backTo);
+        },
     },
     TASK_ASSIGNEE: {
         route: 'r/:reportID/assignee',
@@ -896,7 +909,12 @@ const ROUTES = {
     },
     WORKSPACE_PROFILE_DESCRIPTION: {
         route: 'settings/workspaces/:policyID/profile/description',
-        getRoute: (policyID: string | undefined) => `settings/workspaces/${policyID}/profile/description` as const,
+        getRoute: (policyID: string | undefined) => {
+            if (!policyID) {
+                Log.warn('Invalid policyID is used to build the WORKSPACE_PROFILE_DESCRIPTION route');
+            }
+            return `settings/workspaces/${policyID}/profile/description` as const;
+        },
     },
     WORKSPACE_PROFILE_SHARE: {
         route: 'settings/workspaces/:policyID/profile/share',

src/hooks/usePaginatedReportActions.ts

@@ -1,25 +1,24 @@
 import {useMemo} from 'react';
 import {useOnyx} from 'react-native-onyx';
+import getNonEmptyStringOnyxID from '@libs/getNonEmptyStringOnyxID';
 import PaginationUtils from '@libs/PaginationUtils';
 import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import ONYXKEYS from '@src/ONYXKEYS';
 
 /**
  * Get the longest continuous chunk of reportActions including the linked reportAction. If not linking to a specific action, returns the continuous chunk of newest reportActions.
  */
-function usePaginatedReportActions(reportID?: string, reportActionID?: string) {
-    // Use `||` instead of `??` to handle empty string.
-    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-    const reportIDWithDefault = reportID || '-1';
-    const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportIDWithDefault}`);
+function usePaginatedReportActions(reportID: string | undefined, reportActionID?: string) {
+    const nonEmptyStringReportID = getNonEmptyStringOnyxID(reportID);
+    const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${nonEmptyStringReportID}`);
     const canUserPerformWriteAction = ReportUtils.canUserPerformWriteAction(report);
 
-    const [sortedAllReportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportIDWithDefault}`, {
+    const [sortedAllReportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${nonEmptyStringReportID}`, {
         canEvict: false,
         selector: (allReportActions) => ReportActionsUtils.getSortedReportActionsForDisplay(allReportActions, canUserPerformWriteAction, true),
     });
-    const [reportActionPages] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_PAGES}${reportIDWithDefault}`);
+    const [reportActionPages] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_PAGES}${nonEmptyStringReportID}`);
 
     const {
         data: reportActions,
@@ -33,7 +32,7 @@
     }, [reportActionID, reportActionPages, sortedAllReportActions]);
 
     const linkedAction = useMemo(
-        () => sortedAllReportActions?.find((reportAction) => String(reportAction.reportActionID) === String(reportActionID)),
+        () => (reportActionID ? sortedAllReportActions?.find((reportAction) => String(reportAction.reportActionID) === String(reportActionID)) : undefined),
         [reportActionID, sortedAllReportActions],
     );
 

src/libs/Notification/LocalNotification/index.desktop.ts

@@ -14,7 +14,10 @@ function showModifiedExpenseNotification(report: Report, reportAction: ReportAct
     BrowserNotifications.pushModifiedExpenseNotification(report, reportAction, onClick);
 }
 
-function clearReportNotifications(reportID: string) {
+function clearReportNotifications(reportID: string | undefined) {
+    if (!reportID) {
+        return;
+    }
     BrowserNotifications.clearNotifications((notificationData) => notificationData.reportID === reportID);
 }
 

src/libs/Notification/LocalNotification/index.ts

@@ -14,7 +14,10 @@ function showModifiedExpenseNotification(report: Report, reportAction: ReportAct
     BrowserNotifications.pushModifiedExpenseNotification(report, reportAction, onClick, true);
 }
 
-function clearReportNotifications(reportID: string) {
+function clearReportNotifications(reportID: string | undefined) {
+    if (!reportID) {
+        return;
+    }
     BrowserNotifications.clearNotifications((notificationData) => notificationData.reportID === reportID);
 }
 

src/libs/Notification/clearReportNotifications/index.native.ts

@@ -13,9 +13,13 @@ const parseNotificationAndReportIDs = (pushPayload: PushPayload) => {
     };
 };
 
-const clearReportNotifications: ClearReportNotifications = (reportID: string) => {
+const clearReportNotifications: ClearReportNotifications = (reportID: string | undefined) => {
     Log.info('[PushNotification] clearing report notifications', false, {reportID});
 
+    if (!reportID) {
+        return;
+    }
+
     Airship.push
         .getActiveNotifications()
         .then((pushPayloads) => {

src/libs/Notification/clearReportNotifications/types.ts

@@ -1,3 +1,3 @@
-type ClearReportNotifications = (reportID: string) => void;
+type ClearReportNotifications = (reportID: string | undefined) => void;
 
 export default ClearReportNotifications;

src/libs/ReportUtils.ts

@@ -7487,8 +7487,8 @@ function isReportDataReady(): boolean {
 /**
  * Return true if reportID from path is valid
  */
-function isValidReportIDFromPath(reportIDFromPath: string): boolean {
-    return !['', 'null', '0', '-1'].includes(reportIDFromPath);
+function isValidReportIDFromPath(reportIDFromPath: string | undefined): boolean {
+    return !!reportIDFromPath && !['', 'null', 'undefined', '0', '-1'].includes(reportIDFromPath);
 }
 
 /**

src/libs/actions/Report.ts

@@ -454,7 +454,7 @@ function subscribeToReportTypingEvents(reportID: string) {
 }
 
 /** Initialize our pusher subscriptions to listen for someone leaving a room. */
-function subscribeToReportLeavingEvents(reportID: string) {
+function subscribeToReportLeavingEvents(reportID: string | undefined) {
     if (!reportID) {
         return;
     }

src/libs/getNonEmptyStringOnyxID.ts

@@ -0,0 +1,6 @@
+/** Make sure the id is not an empty string as it can break an onyx key */
+export default function getNonEmptyStringOnyxID(onyxID: string | undefined): string | undefined {
+    // The onyx ID is used inside the onyx key. If it's an empty string, onyx will return
+    // a collection instead of an individual item, which is not an expected behaviour.
+    return onyxID !== '' ? onyxID : undefined;
+}

src/pages/home/HeaderView.tsx

@@ -24,6 +24,7 @@ import usePolicy from '@hooks/usePolicy';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
+import getNonEmptyStringOnyxID from '@libs/getNonEmptyStringOnyxID';
 import Navigation from '@libs/Navigation/Navigation';
 import {getPersonalDetailsForAccountIDs} from '@libs/OptionsListUtils';
 import Parser from '@libs/Parser';
@@ -76,7 +77,7 @@ type HeaderViewProps = {
     parentReportAction: OnyxEntry<ReportAction> | null;
 
     /** The reportID of the current report */
-    reportID: string;
+    reportID: string | undefined;
 
     /** Whether we should display the header as in narrow layout */
     shouldUseNarrowLayout?: boolean;
@@ -94,11 +95,9 @@ function HeaderView({report, parentReportAction, onNavigationMenuButtonClicked,
     const {isSmallScreenWidth} = useResponsiveLayout();
     const route = useRoute();
     const [isDeleteTaskConfirmModalVisible, setIsDeleteTaskConfirmModalVisible] = React.useState(false);
-    const [invoiceReceiverPolicy] = useOnyx(
-        `${ONYXKEYS.COLLECTION.POLICY}${report?.invoiceReceiver && 'policyID' in report.invoiceReceiver ? report.invoiceReceiver.policyID : CONST.DEFAULT_NUMBER_ID}`,
-    );
-    // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
-    const [parentReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${report?.parentReportID || report?.reportID || CONST.DEFAULT_NUMBER_ID}`);
+    const invoiceReceiverPolicyID = report?.invoiceReceiver && 'policyID' in report.invoiceReceiver ? report.invoiceReceiver.policyID : undefined;
+    const [invoiceReceiverPolicy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${invoiceReceiverPolicyID}`);
+    const [parentReport] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${getNonEmptyStringOnyxID(report?.parentReportID) ?? getNonEmptyStringOnyxID(report?.reportID)}`);
     const policy = usePolicy(report?.policyID);
     const [personalDetails] = useOnyx(ONYXKEYS.PERSONAL_DETAILS_LIST);