From 3224c19aad91a959d5f04eb5e0613d6e46618443 Mon Sep 17 00:00:00 2001
From: dkmyta <43220201+dkmyta@users.noreply.github.com>
Date: Sun, 18 Aug 2024 10:16:37 -0700
Subject: [PATCH] Protect: Fix manual scans section link button loading state
 (#38897)

---
 ...-protect-manual-scans-button-loading-state |  4 ++++
 .../src/js/components/threats-list/index.jsx  | 19 ++++++++-----------
 .../threats-list/styles.module.scss           | 14 --------------
 3 files changed, 12 insertions(+), 25 deletions(-)
 create mode 100644 projects/plugins/protect/changelog/fix-protect-manual-scans-button-loading-state

diff --git a/projects/plugins/protect/changelog/fix-protect-manual-scans-button-loading-state b/projects/plugins/protect/changelog/fix-protect-manual-scans-button-loading-state
new file mode 100644
index 0000000000000..6682b9f0bf3f5
--- /dev/null
+++ b/projects/plugins/protect/changelog/fix-protect-manual-scans-button-loading-state
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fixed
+
+Improves the manual scan link button loading state
diff --git a/projects/plugins/protect/src/js/components/threats-list/index.jsx b/projects/plugins/protect/src/js/components/threats-list/index.jsx
index f86f77e463c06..6704d133d0e2c 100644
--- a/projects/plugins/protect/src/js/components/threats-list/index.jsx
+++ b/projects/plugins/protect/src/js/components/threats-list/index.jsx
@@ -7,7 +7,6 @@ import {
 	Text,
 } from '@automattic/jetpack-components';
 import { useDispatch } from '@wordpress/data';
-import { createInterpolateElement } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
 import React, { useCallback, useState } from 'react';
 import useProtectData from '../../hooks/use-protect-data';
@@ -145,17 +144,15 @@ const ThreatsList = () => {
 							<>
 								<div ref={ setUnderstandSeverityPopoverAnchor }>
 									<PaidList list={ list } />
-									<Text className={ styles[ 'manual-scan' ] } variant="body-small">
-										{ createInterpolateElement(
-											__(
-												'If you have manually fixed any of the threats listed above, <manualScanLink>you can run a manual scan now</manualScanLink> or wait for Jetpack to scan your site later today.',
+									<div className={ styles[ 'manual-scan' ] }>
+										<Text variant="body-small" mb={ 4 }>
+											{ __(
+												'If you have manually fixed any of the threats listed above, you can run a manual scan now or wait for Jetpack to scan your site later today.',
 												'jetpack-protect'
-											),
-											{
-												manualScanLink: <ScanButton variant="link" />,
-											}
-										) }
-									</Text>
+											) }
+										</Text>
+										<ScanButton />
+									</div>
 								</div>
 								<OnboardingPopover
 									id="paid-understand-severity"
diff --git a/projects/plugins/protect/src/js/components/threats-list/styles.module.scss b/projects/plugins/protect/src/js/components/threats-list/styles.module.scss
index 256c5838f61ac..6942d4ecf7dc7 100644
--- a/projects/plugins/protect/src/js/components/threats-list/styles.module.scss
+++ b/projects/plugins/protect/src/js/components/threats-list/styles.module.scss
@@ -79,20 +79,6 @@
 .manual-scan {
 	margin: calc( var( --spacing-base ) * 4 ) calc( var( --spacing-base ) * 8 ); // 32px | 64px
 	text-align: center;
-
-	> button span {
-		font-size: var( --font-body-small );
-		font-weight: normal;
-		color: var( --jp-gray-70 );
-	}
-
-	button:hover:not(:disabled) {
-		text-decoration-line: none;
-	}
-
-	button:focus:not(:disabled) {
-		box-shadow: none;
-	}
 }
 
 @media ( max-width: 599px ) {