From f38742608363aef34362959c327f3c85893a8ae8 Mon Sep 17 00:00:00 2001
From: dkmyta <43220201+dkmyta@users.noreply.github.com>
Date: Wed, 26 Jun 2024 14:11:31 -0700
Subject: [PATCH] Protect: Fix in-progress fixer indicator (#38051)

* Add logging to detect fixer status

* changelog

* Disable eslint for testing

* Remove logging

* Fix redux setup for threatsAreFixing, add disables for ignore and fix button when true

* Update variable names

* Update changelog type and update versions
---
 .../fix-protect-in-progress-fixer-indicator       |  4 ++++
 .../src/js/components/threats-list/paid-list.jsx  | 15 +++++++++++----
 projects/plugins/protect/src/js/state/reducers.js |  4 ++--
 3 files changed, 17 insertions(+), 6 deletions(-)
 create mode 100644 projects/plugins/protect/changelog/fix-protect-in-progress-fixer-indicator

diff --git a/projects/plugins/protect/changelog/fix-protect-in-progress-fixer-indicator b/projects/plugins/protect/changelog/fix-protect-in-progress-fixer-indicator
new file mode 100644
index 0000000000000..d11b277d6cf0b
--- /dev/null
+++ b/projects/plugins/protect/changelog/fix-protect-in-progress-fixer-indicator
@@ -0,0 +1,4 @@
+Significance: patch
+Type: changed
+
+Ensure in-progress fixer indicator is functional
diff --git a/projects/plugins/protect/src/js/components/threats-list/paid-list.jsx b/projects/plugins/protect/src/js/components/threats-list/paid-list.jsx
index dc512e5e6db32..2a5a732b127fd 100644
--- a/projects/plugins/protect/src/js/components/threats-list/paid-list.jsx
+++ b/projects/plugins/protect/src/js/components/threats-list/paid-list.jsx
@@ -1,5 +1,5 @@
 import { Text, Button, useBreakpointMatch } from '@automattic/jetpack-components';
-import { useDispatch } from '@wordpress/data';
+import { useSelect, useDispatch } from '@wordpress/data';
 import { createInterpolateElement } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
 import React, { useCallback } from 'react';
@@ -26,10 +26,12 @@ const ThreatAccordionItem = ( {
 	type,
 	severity,
 } ) => {
+	const threatsAreFixing = useSelect( select => select( STORE_ID ).getThreatsAreFixing() );
 	const { setModal } = useDispatch( STORE_ID );
-
 	const { recordEvent } = useAnalyticsTracks();
 
+	const fixerInProgress = threatsAreFixing.indexOf( id ) >= 0;
+
 	const learnMoreButton = source ? (
 		<Button variant="link" isExternalLink={ true } weight="regular" href={ source }>
 			{ __( 'See more technical details of this threat', 'jetpack-protect' ) }
@@ -113,11 +115,16 @@ const ThreatAccordionItem = ( {
 			) }
 			{ ! description && <div className={ styles[ 'threat-section' ] }>{ learnMoreButton }</div> }
 			<div className={ styles[ 'threat-footer' ] }>
-				<Button isDestructive={ true } variant="secondary" onClick={ handleIgnoreThreatClick() }>
+				<Button
+					isDestructive={ true }
+					variant="secondary"
+					disabled={ fixerInProgress }
+					onClick={ handleIgnoreThreatClick() }
+				>
 					{ __( 'Ignore threat', 'jetpack-protect' ) }
 				</Button>
 				{ fixable && (
-					<Button onClick={ handleFixThreatClick() }>
+					<Button disabled={ fixerInProgress } onClick={ handleFixThreatClick() }>
 						{ __( 'Fix threat', 'jetpack-protect' ) }
 					</Button>
 				) }
diff --git a/projects/plugins/protect/src/js/state/reducers.js b/projects/plugins/protect/src/js/state/reducers.js
index dcce0a200d22f..eb92069b85d0b 100644
--- a/projects/plugins/protect/src/js/state/reducers.js
+++ b/projects/plugins/protect/src/js/state/reducers.js
@@ -120,7 +120,7 @@ const threatsUpdating = ( state = {}, action ) => {
 	return state;
 };
 
-const setThreatsFixing = ( state = [], action ) => {
+const threatsAreFixing = ( state = [], action ) => {
 	switch ( action.type ) {
 		case SET_THREATS_ARE_FIXING:
 			return action.threatIds;
@@ -207,7 +207,7 @@ const reducers = combineReducers( {
 	threatsUpdating,
 	modal,
 	notice,
-	setThreatsFixing,
+	threatsAreFixing,
 	hasRequiredPlan,
 	onboardingProgress,
 	waf,