From 507d697e1f01fd51eb6d822fd148d1dda817cb2b Mon Sep 17 00:00:00 2001 From: rory Date: Sat, 23 Mar 2024 02:13:10 -0700 Subject: [PATCH 1/4] Don't show 404 on ReportScreen if isLoading is true --- src/pages/home/ReportScreen.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx index aa03714394b1..2f9029e1e251 100644 --- a/src/pages/home/ReportScreen.tsx +++ b/src/pages/home/ReportScreen.tsx @@ -531,15 +531,15 @@ function ReportScreen({ // eslint-disable-next-line rulesdir/no-negated-variables const shouldShowNotFoundPage = useMemo( (): boolean => - (!wasReportAccessibleRef.current && + !isLoading && + ((!wasReportAccessibleRef.current && !firstRenderRef.current && !report.reportID && !isOptimisticDelete && !reportMetadata?.isLoadingInitialReportActions && - !isLoading && !userLeavingStatus) || - shouldHideReport || - (!!reportIDFromRoute && !ReportUtils.isValidReportIDFromPath(reportIDFromRoute)), + shouldHideReport || + (!!reportIDFromRoute && !ReportUtils.isValidReportIDFromPath(reportIDFromRoute))), [report, reportMetadata, isLoading, shouldHideReport, isOptimisticDelete, userLeavingStatus, reportIDFromRoute], ); From 9449e9f546ecf33d32e47e812faeb0ead152d743 Mon Sep 17 00:00:00 2001 From: rory Date: Sun, 24 Mar 2024 18:00:23 -0700 Subject: [PATCH 2/4] Check isValidReportIDFromPath in isLoading --- src/pages/home/ReportScreen.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx index 2f9029e1e251..fe475d8d2037 100644 --- a/src/pages/home/ReportScreen.tsx +++ b/src/pages/home/ReportScreen.tsx @@ -269,7 +269,6 @@ function ReportScreen({ const hasHelpfulErrors = Object.keys(report?.errorFields ?? {}).some((key) => key !== 'notFound'); const shouldHideReport = !hasHelpfulErrors && !ReportUtils.canAccessReport(report, policies, betas); - const isLoading = !reportIDFromRoute || !isSidebarLoaded || PersonalDetailsUtils.isPersonalDetailsEmpty(); const lastReportAction: OnyxEntry = useMemo( () => reportActions.length @@ -331,6 +330,7 @@ function ReportScreen({ return reportIDFromRoute !== '' && !!report.reportID && !isTransitioning; }, [report, reportIDFromRoute]); + const isLoading = !ReportUtils.isValidReportIDFromPath(reportIDFromRoute) || !isSidebarLoaded || PersonalDetailsUtils.isPersonalDetailsEmpty(); const shouldShowSkeleton = isLinkingToMessage || !isCurrentReportLoadedFromOnyx || From e55b82da5bb4afb042d8025b756909a710666f84 Mon Sep 17 00:00:00 2001 From: rory Date: Sun, 24 Mar 2024 18:01:20 -0700 Subject: [PATCH 3/4] Move shouldShowNotFoundPage --- src/pages/home/ReportScreen.tsx | 30 ++++++++++++++---------------- 1 file changed, 14 insertions(+), 16 deletions(-) diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx index fe475d8d2037..ccd32e0fe1f9 100644 --- a/src/pages/home/ReportScreen.tsx +++ b/src/pages/home/ReportScreen.tsx @@ -337,8 +337,21 @@ function ReportScreen({ (reportActions.length === 0 && !!reportMetadata?.isLoadingInitialReportActions) || isLoading || (!!reportActionIDFromRoute && reportMetadata?.isLoadingInitialReportActions); - const shouldShowReportActionList = isCurrentReportLoadedFromOnyx && !isLoading; + // eslint-disable-next-line rulesdir/no-negated-variables + const shouldShowNotFoundPage = useMemo( + (): boolean => + !isLoading && + ((!wasReportAccessibleRef.current && + !firstRenderRef.current && + !report.reportID && + !isOptimisticDelete && + !reportMetadata?.isLoadingInitialReportActions && + !userLeavingStatus) || + shouldHideReport || + (!!reportIDFromRoute && !ReportUtils.isValidReportIDFromPath(reportIDFromRoute))), + [report, reportMetadata, isLoading, shouldHideReport, isOptimisticDelete, userLeavingStatus, reportIDFromRoute], + ); const fetchReport = useCallback(() => { Report.openReport(reportIDFromRoute, reportActionIDFromRoute); @@ -528,21 +541,6 @@ function ReportScreen({ // eslint-disable-next-line react-hooks/exhaustive-deps }, []); - // eslint-disable-next-line rulesdir/no-negated-variables - const shouldShowNotFoundPage = useMemo( - (): boolean => - !isLoading && - ((!wasReportAccessibleRef.current && - !firstRenderRef.current && - !report.reportID && - !isOptimisticDelete && - !reportMetadata?.isLoadingInitialReportActions && - !userLeavingStatus) || - shouldHideReport || - (!!reportIDFromRoute && !ReportUtils.isValidReportIDFromPath(reportIDFromRoute))), - [report, reportMetadata, isLoading, shouldHideReport, isOptimisticDelete, userLeavingStatus, reportIDFromRoute], - ); - const actionListValue = useMemo((): ActionListContextType => ({flatListRef, scrollPosition, setScrollPosition}), [flatListRef, scrollPosition, setScrollPosition]); // This helps in tracking from the moment 'route' triggers useMemo until isLoadingInitialReportActions becomes true. It prevents blinking when loading reportActions from cache. From 6873f240a5d9e3dbe3f02c085958b9420dc7fb4a Mon Sep 17 00:00:00 2001 From: rory Date: Sun, 24 Mar 2024 18:06:02 -0700 Subject: [PATCH 4/4] Replace isLoading with shouldShowSkeleton in shouldShowNotFoundPage --- src/pages/home/ReportScreen.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/home/ReportScreen.tsx b/src/pages/home/ReportScreen.tsx index ccd32e0fe1f9..9bc0c4c3a4a8 100644 --- a/src/pages/home/ReportScreen.tsx +++ b/src/pages/home/ReportScreen.tsx @@ -341,7 +341,7 @@ function ReportScreen({ // eslint-disable-next-line rulesdir/no-negated-variables const shouldShowNotFoundPage = useMemo( (): boolean => - !isLoading && + !shouldShowSkeleton && ((!wasReportAccessibleRef.current && !firstRenderRef.current && !report.reportID && @@ -350,7 +350,7 @@ function ReportScreen({ !userLeavingStatus) || shouldHideReport || (!!reportIDFromRoute && !ReportUtils.isValidReportIDFromPath(reportIDFromRoute))), - [report, reportMetadata, isLoading, shouldHideReport, isOptimisticDelete, userLeavingStatus, reportIDFromRoute], + [shouldShowSkeleton, report.reportID, isOptimisticDelete, reportMetadata?.isLoadingInitialReportActions, userLeavingStatus, shouldHideReport, reportIDFromRoute], ); const fetchReport = useCallback(() => {