Protect: update threats data format and integrate threatsdataviews

Remove database type handling

projects/js-packages/components/package.json

@@ -22,7 +22,7 @@
 		"@wordpress/components": "28.9.0",
 		"@wordpress/compose": "7.9.0",
 		"@wordpress/data": "10.9.0",
-		"@wordpress/dataviews": "4.6.0",
+		"@wordpress/dataviews": "4.5.0",
 		"@wordpress/date": "5.9.0",
 		"@wordpress/element": "6.9.0",
 		"@wordpress/i18n": "5.9.0",

projects/js-packages/scan/changelog/add-types-and-utils

@@ -0,0 +1,4 @@
+Significance: minor
+Type: added
+
+Add threat types and scan utility functions

projects/js-packages/scan/package.json

@@ -15,7 +15,7 @@
 	"license": "GPL-2.0-or-later",
 	"author": "Automattic",
 	"scripts": {
-		"build": "pnpm run clean && pnpm run compile-ts",
+		"build": "pnpm run clean && webpack",
 		"clean": "rm -rf build/",
 		"compile-ts": "tsc --pretty",
 		"test": "jest",
@@ -53,13 +53,17 @@
 	"dependencies": {
 		"@automattic/jetpack-api": "workspace:*",
 		"@automattic/jetpack-base-styles": "workspace:*",
+		"@automattic/jetpack-webpack-config": "workspace:*",
 		"@wordpress/api-fetch": "7.9.0",
 		"@wordpress/element": "6.9.0",
 		"@wordpress/i18n": "5.9.0",
+		"@wordpress/icons": "10.9.0",
 		"@wordpress/url": "4.9.0",
 		"debug": "4.3.4",
 		"react": "^18.2.0",
-		"react-dom": "^18.2.0"
+		"react-dom": "^18.2.0",
+		"webpack": "5.94.0",
+		"webpack-cli": "4.9.1"
 	},
 	"peerDependencies": {
 		"@wordpress/i18n": "5.9.0",

projects/js-packages/scan/src/types/fixers.ts

@@ -15,3 +15,26 @@ export type ThreatFixStatusSuccess = {
 };
 
 export type ThreatFixStatus = ThreatFixStatusError | ThreatFixStatusSuccess;
+
+/**
+ * Fixers Status
+ *
+ * Overall status of all fixers.
+ */
+type FixersStatusBase = {
+	ok: boolean; // Discriminator for overall success
+};
+
+export type FixersStatusError = FixersStatusBase & {
+	ok: false;
+	error: string;
+};
+
+export type FixersStatusSuccess = FixersStatusBase & {
+	ok: true;
+	threats: {
+		[ key: number ]: ThreatFixStatus;
+	};
+};
+
+export type FixersStatus = FixersStatusSuccess | FixersStatusError;

projects/plugins/protect/src/js/types/scans.ts → projects/js-packages/scan/src/types/status.ts

@@ -1,4 +1,4 @@
-import { Threat } from './threats';
+import { type Threat } from '..';
 
 export type ExtensionStatus = {
 	/** The name of the extension. */
@@ -39,14 +39,8 @@ export type ScanStatus = {
 	/** The time the last scan was checked, in YYYY-MM-DD HH:MM:SS format. */
 	lastChecked: string | null;
 
-	/** The number of plugin threats found in the latest status. */
-	numPluginsThreats: number;
-
-	/** The number of theme threats found in the latest status. */
-	numThemesThreats: number;
-
-	/** The total number of threats found in the latest status. */
-	numThreats: number;
+	/** The security threats identified in the latest scan. */
+	threats: Threat[];
 
 	/** Whether there was an error in the scan results. */
 	error: boolean | null;
@@ -56,26 +50,4 @@ export type ScanStatus = {
 
 	/** The error message. */
 	errorMessage: string | null;
-
-	/** WordPress Core Status */
-	core: {
-		checked: boolean;
-		name: string;
-		slug: string;
-		threats: Threat[];
-		type: 'core';
-		version: string;
-	} | null;
-
-	/** Plugins Status */
-	plugins: ExtensionStatus[];
-
-	/** Themes Status */
-	themes: ExtensionStatus[];
-
-	/** File Threats */
-	files: Threat[];
-
-	/** Database Threats */
-	database: Threat[];
 };

projects/js-packages/scan/src/utils/index.ts

@@ -1,4 +1,5 @@
-import { Threat, ThreatFixStatus, FIXER_IS_STALE_THRESHOLD } from '..';
+import { code, color, plugins, shield, wordpress } from '@wordpress/icons';
+import { type Threat, type ThreatFixStatus, FIXER_IS_STALE_THRESHOLD } from '..';
 
 export const getThreatType = ( threat: Threat ) => {
 	if ( threat.signature === 'Vulnerable.WP.Core' ) {
@@ -14,6 +15,43 @@ export const getThreatType = ( threat: Threat ) => {
 	return null;
 };
 
+export const getThreatSubtitle = ( threat: Threat ) => {
+	const type = getThreatType( threat );
+
+	switch ( type ) {
+		case 'plugin':
+		case 'theme':
+			return `${ threat.extension?.name } (${ threat.extension?.version })`;
+		case 'core':
+			return 'WordPress Core';
+		case 'file':
+			// Trim leading slash
+			if ( threat.filename.startsWith( '/' ) ) {
+				return threat.filename.slice( 1 );
+			}
+			return threat.filename;
+		default:
+			return '';
+	}
+};
+
+export const getThreatIcon = ( threat: Threat ) => {
+	const type = getThreatType( threat );
+
+	switch ( type ) {
+		case 'plugin':
+			return plugins;
+		case 'theme':
+			return color;
+		case 'core':
+			return wordpress;
+		case 'file':
+			return code;
+		default:
+			return shield;
+	}
+};
+
 export const fixerTimestampIsStale = ( lastUpdatedTimestamp: string ) => {
 	const now = new Date();
 	const lastUpdated = new Date( lastUpdatedTimestamp );

projects/js-packages/scan/webpack.config.cjs

@@ -0,0 +1,53 @@
+const path = require( 'path' );
+const jetpackWebpackConfig = require( '@automattic/jetpack-webpack-config/webpack' );
+
+module.exports = [
+	{
+		entry: {
+			index: './src/index.ts',
+		},
+		mode: jetpackWebpackConfig.mode,
+		devtool: jetpackWebpackConfig.devtool,
+		output: {
+			...jetpackWebpackConfig.output,
+			path: path.resolve( './build' ),
+		},
+		optimization: {
+			...jetpackWebpackConfig.optimization,
+		},
+		resolve: {
+			...jetpackWebpackConfig.resolve,
+		},
+		node: false,
+		plugins: [ ...jetpackWebpackConfig.StandardPlugins() ],
+		module: {
+			strictExportPresence: true,
+			rules: [
+				// Transpile JavaScript
+				jetpackWebpackConfig.TranspileRule( {
+					exclude: /node_modules\//,
+				} ),
+
+				// Transpile @automattic/jetpack-* in node_modules too.
+				jetpackWebpackConfig.TranspileRule( {
+					includeNodeModules: [ '@automattic/jetpack-' ],
+				} ),
+
+				// Handle CSS.
+				jetpackWebpackConfig.CssRule( {
+					extensions: [ 'css', 'sass', 'scss' ],
+					extraLoaders: [ 'sass-loader' ],
+				} ),
+
+				// Handle images.
+				jetpackWebpackConfig.FileRule(),
+			],
+		},
+		externals: {
+			...jetpackWebpackConfig.externals,
+			jetpackConfig: JSON.stringify( {
+				consumer_slug: 'my_jetpack',
+			} ),
+		},
+	},
+];

projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/scan-threats-status.tsx

@@ -24,28 +24,14 @@ export const ScanAndThreatStatus = () => {
 	const {
 		protect: { scanData },
 	} = getMyJetpackWindowInitialState();
-	const { plugins, themes, num_threats: numThreats = 0 } = scanData || {};
+	const numThreats = scanData.threats.length;
 
 	const criticalScanThreatCount = useMemo( () => {
-		const { core, database, files, num_plugins_threats, num_themes_threats } = scanData || {};
-		const pluginsThreats = num_plugins_threats
-			? plugins.reduce( ( accum, plugin ) => accum.concat( plugin.threats ), [] )
-			: [];
-		const themesThreats = num_themes_threats
-			? themes.reduce( ( accum, theme ) => accum.concat( theme.threats ), [] )
-			: [];
-		const allThreats = [
-			...pluginsThreats,
-			...themesThreats,
-			...( core?.threats ?? [] ),
-			...database,
-			...files,
-		];
-		return allThreats.reduce(
+		return scanData.threats.reduce(
 			( accum, threat ) => ( threat.severity >= 5 ? ( accum += 1 ) : accum ),
 			0
 		);
-	}, [ plugins, themes, scanData ] );
+	}, [ scanData.threats ] );
 
 	if ( isPluginActive && isSiteConnected ) {
 		if ( hasProtectPaidPlan ) {

projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/use-last-scan-text.ts

@@ -13,14 +13,10 @@ export const useLastScanText = () => {
 		themes,
 		protect: { scanData },
 	} = getMyJetpackWindowInitialState();
-	const {
-		plugins: fromScanPlugins,
-		themes: fromScanThemes,
-		last_checked: lastScanTime = null,
-	} = scanData || {};
+	const { last_checked: lastScanTime = null } = scanData || {};
 
-	const pluginsCount = fromScanPlugins.length || Object.keys( plugins ).length;
-	const themesCount = fromScanThemes.length || Object.keys( themes ).length;
+	const pluginsCount = Object.keys( plugins ).length;
+	const themesCount = Object.keys( themes ).length;
 
 	const timeSinceLastScan = lastScanTime ? timeSince( Date.parse( lastScanTime ) ) : false;
 

projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/use-protect-tooltip-copy.ts

@@ -35,19 +35,15 @@ export function useProtectTooltipCopy(): TooltipContent {
 		themes,
 		protect: { scanData, wafConfig: wafData },
 	} = getMyJetpackWindowInitialState();
-	const {
-		plugins: fromScanPlugins,
-		themes: fromScanThemes,
-		num_threats: numThreats = 0,
-	} = scanData || {};
+	const numThreats = scanData.threats.length;
 	const {
 		jetpack_waf_automatic_rules: isAutoFirewallEnabled,
 		blocked_logins: blockedLoginsCount,
 		brute_force_protection: hasBruteForceProtection,
 	} = wafData || {};
 
-	const pluginsCount = fromScanPlugins.length || Object.keys( plugins ).length;
-	const themesCount = fromScanThemes.length || Object.keys( themes ).length;
+	const pluginsCount = Object.keys( plugins ).length;
+	const themesCount = Object.keys( themes ).length;
 
 	const settingsLink = useMemo( () => {
 		if ( isProtectPluginActive ) {

projects/packages/my-jetpack/changelog/protect-status-compat

@@ -0,0 +1,5 @@
+Significance: patch
+Type: changed
+Comment: Package compatibility updates, no functional changes.
+
+

projects/packages/my-jetpack/global.d.ts

@@ -48,6 +48,12 @@ type ThreatItem = {
 	fixed_in: string;
 	description: string | null;
 	source: string | null;
+	extension: {
+		slug: string;
+		name: string;
+		version: string;
+		type: 'plugin' | 'theme' | 'core';
+	};
 	// Scan API properties (paid plan)
 	context: string | null;
 	filename: string | null;
@@ -58,15 +64,6 @@ type ThreatItem = {
 	status: number | null;
 };
 
-type ScanItem = {
-	checked: boolean;
-	name: string;
-	slug: string;
-	threats: ThreatItem[];
-	type: string;
-	version: string;
-};
-
 interface Window {
 	myJetpackInitialState?: {
 		siteSuffix: string;
@@ -212,22 +209,15 @@ interface Window {
 		};
 		protect: {
 			scanData: {
-				core: ScanItem;
+				threats: ThreatItem[];
 				current_progress?: string;
 				data_source: string;
-				database: string[];
 				error: boolean;
 				error_code?: string;
 				error_message?: string;
-				files: string[];
 				has_unchecked_items: boolean;
 				last_checked: string;
-				num_plugins_threats: number;
-				num_themes_threats: number;
-				num_threats: number;
-				plugins: ScanItem[];
 				status: string;
-				themes: ScanItem[];
 			};
 			wafConfig: {
 				automatic_rules_available: boolean;

projects/packages/protect-models/changelog/update-protect-threats-data

@@ -0,0 +1,4 @@
+Significance: major
+Type: changed
+
+Changed the formatting of threat data.