Protect: Hide Scan Report When No Data (#40619)

projects/plugins/protect/src/js/routes/home/index.jsx

@@ -1,6 +1,7 @@
 import { AdminSection, Container, Col, ScanReport } from '@automattic/jetpack-components';
 import { useMemo } from 'react';
 import AdminPage from '../../components/admin-page';
+import { SCAN_IN_PROGRESS_STATUSES } from '../../constants';
 import useScanStatusQuery from '../../data/scan/use-scan-status-query';
 import HomeAdminSectionHero from './home-admin-section-hero';
 import styles from './styles.module.scss';
@@ -33,20 +34,24 @@ const HomePage = () => {
 		[ status ]
 	);
 
+	const showReport = !! status.lastChecked || SCAN_IN_PROGRESS_STATUSES.indexOf( status?.status ) >= 0;
+
 	return (
 		<AdminPage>
 			<HomeAdminSectionHero />
-			<AdminSection>
-				<Container
-					className={ styles[ 'scan-report-container' ] }
-					horizontalSpacing={ 5 }
-					horizontalGap={ 4 }
-				>
-					<Col>
-						<ScanReport dataSource={ status.dataSource } data={ data } />
-					</Col>
-				</Container>
-			</AdminSection>
+			{ showReport && (
+				<AdminSection>
+					<Container
+						className={ styles[ 'scan-report-container' ] }
+						horizontalSpacing={ 5 }
+						horizontalGap={ 4 }
+					>
+						<Col>
+							<ScanReport dataSource={ status.dataSource } data={ data } />
+						</Col>
+					</Container>
+				</AdminSection>
+			) }
 		</AdminPage>
 	);
 };