From 84210ca26a9ecea7cb7c056bdb8834e0df804e87 Mon Sep 17 00:00:00 2001
From: Nate Weller <nate.weller@automattic.com>
Date: Wed, 18 Dec 2024 13:15:27 -0700
Subject: [PATCH] Protect Meets Core: Home Page Scan Report Data Adjustments
 (#40616)

---
 .../components/scan-report/index.tsx          |  5 +++-
 .../protect/src/js/routes/home/index.jsx      | 27 ++++++++++++-------
 2 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/projects/js-packages/components/components/scan-report/index.tsx b/projects/js-packages/components/components/scan-report/index.tsx
index 23810c1754832..a471e82994b17 100644
--- a/projects/js-packages/components/components/scan-report/index.tsx
+++ b/projects/js-packages/components/components/scan-report/index.tsx
@@ -216,7 +216,10 @@ export default function ScanReport( { dataSource, data, onChangeSelection } ): J
 	 *
 	 * @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-dataviews/#getitemid-function
 	 */
-	const getItemId = useCallback( ( item: ScanReportExtension ) => item.id.toString(), [] );
+	const getItemId = useCallback(
+		( item: ScanReportExtension ) => `${ item.type }_${ item.slug }_${ item.version }`,
+		[]
+	);
 
 	return (
 		<DataViews
diff --git a/projects/plugins/protect/src/js/routes/home/index.jsx b/projects/plugins/protect/src/js/routes/home/index.jsx
index cc188fa134e6e..d659d4eaf0f41 100644
--- a/projects/plugins/protect/src/js/routes/home/index.jsx
+++ b/projects/plugins/protect/src/js/routes/home/index.jsx
@@ -1,4 +1,5 @@
 import { AdminSection, Container, Col, ScanReport } from '@automattic/jetpack-components';
+import { useMemo } from 'react';
 import AdminPage from '../../components/admin-page';
 import useScanStatusQuery from '../../data/scan/use-scan-status-query';
 import HomeAdminSectionHero from './home-admin-section-hero';
@@ -13,16 +14,24 @@ import styles from './styles.module.scss';
  */
 const HomePage = () => {
 	const { data: status } = useScanStatusQuery( { usePolling: true } );
-	const { core, plugins, themes, files } = status;
 
-	const data = [
-		core,
-		...plugins,
-		...themes,
-		{ checked: true, threats: files, type: 'files' },
-	].map( ( item, index ) => {
-		return { id: index + 1, ...item };
-	} );
+	const data = useMemo(
+		() => [
+			...( Object.keys( status.core ).length ? [ status.core ] : [] ),
+			...status.plugins,
+			...status.themes,
+			...( status.dataSource === 'scan_api'
+				? [
+						{
+							checked: !! status.lastChecked,
+							threats: status.files,
+							type: 'files',
+						},
+				  ]
+				: [] ),
+		],
+		[ status ]
+	);
 
 	return (
 		<AdminPage>