diff --git a/projects/plugins/protect/src/js/components/free-accordion/index.jsx b/projects/plugins/protect/src/js/components/free-accordion/index.jsx
deleted file mode 100644
index e801d9374fd33..0000000000000
--- a/projects/plugins/protect/src/js/components/free-accordion/index.jsx
+++ /dev/null
@@ -1,64 +0,0 @@
-import { Text } from '@automattic/jetpack-components';
-import { Icon, chevronDown, chevronUp } from '@wordpress/icons';
-import clsx from 'clsx';
-import React, { useState, useCallback, useContext } from 'react';
-import styles from './styles.module.scss';
-
-const FreeAccordionContext = React.createContext();
-
-export const FreeAccordionItem = ( { id, title, label, icon, children, onOpen } ) => {
- const accordionData = useContext( FreeAccordionContext );
- const open = accordionData?.open === id;
- const setOpen = accordionData?.setOpen;
-
- const bodyClassNames = clsx( styles[ 'accordion-body' ], {
- [ styles[ 'accordion-body-open' ] ]: open,
- [ styles[ 'accordion-body-close' ] ]: ! open,
- } );
-
- const handleClick = useCallback( () => {
- if ( ! open ) {
- onOpen?.();
- }
- setOpen( current => {
- return current === id ? null : id;
- } );
- }, [ open, onOpen, setOpen, id ] );
-
- return (
-
-
-
- { children }
-
-
- );
-};
-
-const FreeAccordion = ( { children } ) => {
- const [ open, setOpen ] = useState();
-
- return (
-
- { children }
-
- );
-};
-
-export default FreeAccordion;
diff --git a/projects/plugins/protect/src/js/components/free-accordion/stories/index.stories.jsx b/projects/plugins/protect/src/js/components/free-accordion/stories/index.stories.jsx
deleted file mode 100644
index 43ad41e2501eb..0000000000000
--- a/projects/plugins/protect/src/js/components/free-accordion/stories/index.stories.jsx
+++ /dev/null
@@ -1,120 +0,0 @@
-import { Text } from '@automattic/jetpack-components';
-import { wordpress, plugins } from '@wordpress/icons';
-import React from 'react';
-import FreeAccordion, { FreeAccordionItem } from '..';
-
-export default {
- title: 'Plugins/Protect/Free Accordion',
- component: FreeAccordion,
- parameters: {
- layout: 'centered',
- },
- decorators: [
- Story => (
-
-
-
- ),
- ],
-};
-
-// eslint-disable-next-line no-unused-vars
-export const Default = args => (
-
-
-
- What is the problem?
-
-
- Post authors are able to bypass KSES restrictions in WordPress { '>' }= 5.9 (and or
- Gutenberg { '>' }= 9.8.0) due to the order filters are executed, which could allow them to
- perform to Stored Cross-Site Scripting attacks
-
-
- How to fix it?
-
- Update to WordPress 5.9.2
-
-
-
- What is the problem?
-
-
- Post authors are able to bypass KSES restrictions in WordPress { '>' }= 5.9 (and or
- Gutenberg { '>' }= 9.8.0) due to the order filters are executed, which could allow them to
- perform to Stored Cross-Site Scripting attacks
-
-
- How to fix it?
-
- Update to WordPress 5.9.2
-
-
-
- What is the problem?
-
-
- Post authors are able to bypass KSES restrictions in WordPress { '>' }= 5.9 (and or
- Gutenberg { '>' }= 9.8.0) due to the order filters are executed, which could allow them to
- perform to Stored Cross-Site Scripting attacks
-
-
- How to fix it?
-
- Update to WordPress 5.9.2
-
-
-
- What is the problem?
-
-
- Post authors are able to bypass KSES restrictions in WordPress { '>' }= 5.9 (and or
- Gutenberg { '>' }= 9.8.0) due to the order filters are executed, which could allow them to
- perform to Stored Cross-Site Scripting attacks
-
-
- How to fix it?
-
- Update to WordPress 5.9.2
-
-
-
- What is the problem?
-
-
- Post authors are able to bypass KSES restrictions in WordPress { '>' }= 5.9 (and or
- Gutenberg { '>' }= 9.8.0) due to the order filters are executed, which could allow them to
- perform to Stored Cross-Site Scripting attacks
-
-
- How to fix it?
-
- Update to WordPress 5.9.2
-
-
-);
diff --git a/projects/plugins/protect/src/js/components/free-accordion/styles.module.scss b/projects/plugins/protect/src/js/components/free-accordion/styles.module.scss
deleted file mode 100644
index 5278f6eff39f4..0000000000000
--- a/projects/plugins/protect/src/js/components/free-accordion/styles.module.scss
+++ /dev/null
@@ -1,79 +0,0 @@
-.accordion {
- border-radius: var( --jp-border-radius );
- border: 1px solid var( --jp-gray );
-
- & > *:not(:last-child) {
- border-bottom: 1px solid var( --jp-gray );
- }
-}
-
-.accordion-item {
- background-color: var( --jp-white );
-}
-
-.accordion-header {
- margin: 0;
- display: grid;
- grid-template-columns: repeat(9, 1fr);
- cursor: pointer;
- box-sizing: border-box;
- background: none;
- border: none;
- width: 100%;
- align-items: center;
- outline-color: var( --jp-black );
- padding: calc( var( --spacing-base ) * 2) calc( var( --spacing-base ) * 3); // 16px | 24px
- text-align: start;
-
- >:first-of-type {
- grid-column: 1/8;
- }
-
- >:last-of-type {
- grid-column: 9;
- }
-
- &:hover {
- background: var( --jp-gray-0 );
- }
-}
-
-.accordion-header-label {
- display: flex;
- align-items: center;
- font-size: var( --font-body-small );
- font-weight: normal;
-}
-
-.accordion-header-label-icon {
- margin-right: var( --spacing-base ); // 8px
-}
-
-.accordion-header-description {
- font-weight: 600;
- margin-left: calc( var( --spacing-base ) * 4 ); // 32px
- margin-bottom: var( --spacing-base ); // 8px
-}
-
-.accordion-header-button {
- align-items: center;
-}
-
-.accordion-body {
- transform-origin: top center;
- overflow: hidden;
-
- &-close {
- transition: all .1s;
- max-height: 0;
- padding: 0;
- transform: scaleY(0);
- }
-
- &-open {
- transition: max-height .3s, transform .2s;
- padding: calc( var( --spacing-base ) * 4 ) calc( var( --spacing-base ) * 7 ); // 32 px | 56px
- max-height: 1000px;
- transform: scaleY(1);
- }
-}
diff --git a/projects/plugins/protect/src/js/components/ignore-threat-modal/index.jsx b/projects/plugins/protect/src/js/components/ignore-threat-modal/index.jsx
index 7e8113b6f38ab..591e90c6146b6 100644
--- a/projects/plugins/protect/src/js/components/ignore-threat-modal/index.jsx
+++ b/projects/plugins/protect/src/js/components/ignore-threat-modal/index.jsx
@@ -1,4 +1,5 @@
import { Button, getRedirectUrl, Text, ThreatSeverityBadge } from '@automattic/jetpack-components';
+import { getThreatIcon, getThreatSubtitle } from '@automattic/jetpack-scan';
import { createInterpolateElement, useState } from '@wordpress/element';
import { __ } from '@wordpress/i18n';
import { Icon } from '@wordpress/icons';
@@ -7,10 +8,11 @@ import useModal from '../../hooks/use-modal';
import UserConnectionGate from '../user-connection-gate';
import styles from './styles.module.scss';
-const IgnoreThreatModal = ( { id, title, label, icon, severity } ) => {
+const IgnoreThreatModal = ( { threat } ) => {
const { setModal } = useModal();
const ignoreThreatMutation = useIgnoreThreatMutation();
const codeableURL = getRedirectUrl( 'jetpack-protect-codeable-referral' );
+ const icon = getThreatIcon( threat );
const [ isIgnoring, setIsIgnoring ] = useState( false );
@@ -25,7 +27,7 @@ const IgnoreThreatModal = ( { id, title, label, icon, severity } ) => {
return async event => {
event.preventDefault();
setIsIgnoring( true );
- await ignoreThreatMutation.mutateAsync( id );
+ await ignoreThreatMutation.mutateAsync( threat.id );
setModal( { type: null } );
setIsIgnoring( false );
};
@@ -42,12 +44,12 @@ const IgnoreThreatModal = ( { id, title, label, icon, severity } ) => {
- { label }
+ { getThreatSubtitle( threat ) }
- { title }
+ { threat.title }
-
+
diff --git a/projects/plugins/protect/src/js/components/paid-accordion/index.jsx b/projects/plugins/protect/src/js/components/paid-accordion/index.jsx
deleted file mode 100644
index d4a6fa5d3f0ba..0000000000000
--- a/projects/plugins/protect/src/js/components/paid-accordion/index.jsx
+++ /dev/null
@@ -1,187 +0,0 @@
-import {
- Spinner,
- Text,
- ThreatSeverityBadge,
- useBreakpointMatch,
-} from '@automattic/jetpack-components';
-import { ExternalLink } from '@wordpress/components';
-import { dateI18n } from '@wordpress/date';
-import { createInterpolateElement } from '@wordpress/element';
-import { sprintf, __ } from '@wordpress/i18n';
-import { Icon, check, chevronDown, chevronUp, info } from '@wordpress/icons';
-import clsx from 'clsx';
-import React, { useState, useCallback, useContext, useMemo } from 'react';
-import { PAID_PLUGIN_SUPPORT_URL } from '../../constants';
-import useFixers from '../../hooks/use-fixers';
-import IconTooltip from '../icon-tooltip';
-import styles from './styles.module.scss';
-
-// Extract context provider for clarity and reusability
-const PaidAccordionContext = React.createContext();
-
-// Component for displaying threat dates
-const ScanHistoryDetails = ( { firstDetected, fixedOn, status } ) => {
- const statusText = useMemo( () => {
- if ( status === 'fixed' ) {
- return sprintf(
- /* translators: %s: Fixed on date */
- __( 'Threat fixed %s', 'jetpack-protect' ),
- dateI18n( 'M j, Y', fixedOn )
- );
- }
- if ( status === 'ignored' ) {
- return __( 'Threat ignored', 'jetpack-protect' );
- }
- return null;
- }, [ status, fixedOn ] );
-
- return (
- firstDetected && (
- <>
-
- { status === 'fixed'
- ? __( 'Fixed', 'jetpack-protect' )
- : __( 'Ignored', 'jetpack-protect', /* dummy arg to avoid bad minification */ 0 ) }
-
-);
-
-const renderFixerStatus = ( isActiveFixInProgress, isStaleFixInProgress ) => {
- if ( isStaleFixInProgress ) {
- return (
-