Protect: Convert useProtectData to TypeScript (#39778)

Automattic · Oct 15, 2024 · 98c584f · 98c584f
1 parent 3e271cf
commit 98c584f
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 9 deletions.
diff --git a/projects/plugins/protect/changelog/update-protect-use-protect-data-ts b/projects/plugins/protect/changelog/update-protect-use-protect-data-ts
@@ -0,0 +1,5 @@
+Significance: patch
+Type: fixed
+Comment: Fix expected types returned from API response
+
+
diff --git a/projects/plugins/protect/src/js/api.ts b/projects/plugins/protect/src/js/api.ts
@@ -49,11 +49,11 @@ const API = {
 			data: { step_ids: stepIds },
 		} ),
 
-	getScanHistory: (): Promise< ScanStatus > =>
+	getScanHistory: (): Promise< ScanStatus | false > =>
 		apiFetch( {
 			path: 'jetpack-protect/v1/scan-history',
 			method: 'GET',
-		} ).then( camelize ) as Promise< ScanStatus >,
+		} ).then( camelize ),
 
 	scan: () =>
 		apiFetch( {

diff --git a/projects/plugins/protect/src/js/data/scan/use-history-query.ts b/projects/plugins/protect/src/js/data/scan/use-history-query.ts
@@ -3,13 +3,14 @@ import { useQuery, UseQueryResult } from '@tanstack/react-query';
 import camelize from 'camelize';
 import API from '../../api';
 import { QUERY_HISTORY_KEY } from '../../constants';
+import { ScanStatus } from '../../types/scans';
 
 /**
  * Use History Query
  *
  * @return {UseQueryResult} useQuery result.
  */
-export default function useHistoryQuery(): UseQueryResult {
+export default function useHistoryQuery(): UseQueryResult< ScanStatus | false > {
 	const { isRegistered } = useConnection( {
 		autoTrigger: false,
 		from: 'protect',

diff --git a/...ct/src/js/hooks/use-protect-data/index.js → ...ct/src/js/hooks/use-protect-data/index.ts b/...ct/src/js/hooks/use-protect-data/index.js → ...ct/src/js/hooks/use-protect-data/index.ts
@@ -3,6 +3,12 @@ import { useMemo } from 'react';
 import useHistoryQuery from '../../data/scan/use-history-query';
 import useScanStatusQuery from '../../data/scan/use-scan-status-query';
 import useProductDataQuery from '../../data/use-product-data-query';
+import { ExtensionStatus } from '../../types/scans';
+import { Threat, ThreatStatus } from '../../types/threats';
+
+type ThreatFilterKey = 'all' | 'core' | 'files' | 'database' | string;
+
+type Filter = { key: ThreatFilterKey; status: ThreatStatus | 'all' };
 
 // Valid "key" values for filtering.
 const KEY_FILTERS = [ 'all', 'core', 'plugins', 'themes', 'files', 'database' ];
@@ -12,13 +18,13 @@ const KEY_FILTERS = [ 'all', 'core', 'plugins', 'themes', 'files', 'database' ];
  *
  * @param {Array}  threats       - The threats to filter.
  * @param {object} filter        - The filter to apply to the data.
- * @param {string} filter.status - The status to filter: 'all', 'fixed', or 'ignored'.
+ * @param {string} filter.status - The status to filter: 'all', 'current', 'fixed', or 'ignored'.
  * @param {string} filter.key    - The key to filter: 'all', 'core', 'files', 'database', or an extension name.
  * @param {string} key           - The threat's key: 'all', 'core', 'files', 'database', or an extension name.
  *
  * @return {Array} The filtered threats.
  */
-const filterThreats = ( threats, filter, key ) => {
+const filterThreats = ( threats: Threat[], filter: Filter, key: ThreatFilterKey ): Threat[] => {
 	if ( ! Array.isArray( threats ) ) {
 		return [];
 	}
@@ -92,7 +98,7 @@ export default function useProtectData(
 		};
 
 		// Loop through the provided extensions, and update the result object.
-		const processExtensions = ( extensions, key ) => {
+		const processExtensions = ( extensions: Array< ExtensionStatus >, key: ThreatFilterKey ) => {
 			if ( ! Array.isArray( extensions ) ) {
 				return [];
 			}
@@ -103,7 +109,7 @@ export default function useProtectData(
 
 				// Filter the extension's threats based on the current filters.
 				const filteredThreats = filterThreats(
-					extension?.threats,
+					extension?.threats || [],
 					filter,
 					KEY_FILTERS.includes( filter.key ) ? key : extension?.name
 				);
@@ -118,7 +124,7 @@ export default function useProtectData(
 		};
 
 		// Loop through the provided threats, and update the result object.
-		const processThreats = ( threatsToProcess, key ) => {
+		const processThreats = ( threatsToProcess: Threat[], key: ThreatFilterKey ) => {
 			if ( ! Array.isArray( threatsToProcess ) ) {
 				return [];
 			}
@@ -135,7 +141,7 @@ export default function useProtectData(
 
 		// Core data may be either a single object or an array of multiple objects.
 		let cores = Array.isArray( data.core ) ? data.core : [];
-		if ( data.core.threats ) {
+		if ( data?.core?.threats ) {
 			cores = [ data.core ];
 		}