Skip to content

Commit

Permalink
Protect: React Query
Browse files Browse the repository at this point in the history
  • Loading branch information
nateweller committed Aug 28, 2024
1 parent 1b98f4d commit d5a02c8
Show file tree
Hide file tree
Showing 76 changed files with 1,477 additions and 1,970 deletions.
26 changes: 23 additions & 3 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions projects/plugins/protect/changelog/add-protect-tanstack-query
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
Significance: patch
Type: added
Comment: Added react query, no user-facing impact.


3 changes: 2 additions & 1 deletion projects/plugins/protect/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,10 @@
"@automattic/jetpack-base-styles": "workspace:*",
"@automattic/jetpack-components": "workspace:*",
"@automattic/jetpack-connection": "workspace:*",
"@tanstack/react-query": "5.20.5",
"@tanstack/react-query-devtools": "5.20.5",
"@wordpress/api-fetch": "7.5.0",
"@wordpress/components": "28.5.0",
"@wordpress/data": "10.5.0",
"@wordpress/date": "5.5.0",
"@wordpress/element": "6.5.0",
"@wordpress/i18n": "5.5.0",
Expand Down
6 changes: 3 additions & 3 deletions projects/plugins/protect/src/class-jetpack-protect.php
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
use Automattic\Jetpack\My_Jetpack\Initializer as My_Jetpack_Initializer;
use Automattic\Jetpack\My_Jetpack\Products as My_Jetpack_Products;
use Automattic\Jetpack\Plugins_Installer;
use Automattic\Jetpack\Protect\Credentials;
use Automattic\Jetpack\Protect\Onboarding;
use Automattic\Jetpack\Protect\REST_Controller;
use Automattic\Jetpack\Protect\Scan_History;
Expand Down Expand Up @@ -214,6 +215,7 @@ public function initial_state() {
'apiRoot' => esc_url_raw( rest_url() ),
'apiNonce' => wp_create_nonce( 'wp_rest' ),
'registrationNonce' => wp_create_nonce( 'jetpack-registration-nonce' ),
'credentials' => Credentials::get_credential_array(),
'status' => Status::get_status( $refresh_status_from_wpcom ),
'scanHistory' => Scan_History::get_scan_history( $refresh_status_from_wpcom ),
'installedPlugins' => Plugins_Installer::get_plugins(),
Expand All @@ -223,7 +225,7 @@ public function initial_state() {
'siteSuffix' => ( new Jetpack_Status() )->get_site_suffix(),
'blogID' => Connection_Manager::get_site_id( true ),
'jetpackScan' => My_Jetpack_Products::get_product( 'scan' ),
'hasRequiredPlan' => Plan::has_required_plan(),
'hasPlan' => Plan::has_required_plan(),
'onboardingProgress' => Onboarding::get_current_user_progress(),
'waf' => array(
'wafSupported' => Waf_Runner::is_supported_environment(),
Expand All @@ -232,8 +234,6 @@ public function initial_state() {
'upgradeIsSeen' => self::get_waf_upgrade_seen_status(),
'displayUpgradeBadge' => self::get_waf_upgrade_badge_display_status(),
'isEnabled' => Waf_Runner::is_enabled(),
'isToggling' => false,
'isUpdating' => false,
'config' => Waf_Runner::get_config(),
'stats' => self::get_waf_stats(),
'globalStats' => Waf_Stats::get_global_stats(),
Expand Down
15 changes: 11 additions & 4 deletions projects/plugins/protect/src/class-rest-controller.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,10 @@
namespace Automattic\Jetpack\Protect;

use Automattic\Jetpack\Connection\Rest_Authentication as Connection_Rest_Authentication;
use Automattic\Jetpack\IP\Utils as IP_Utils;
use Automattic\Jetpack\Protect_Status\REST_Controller as Protect_Status_REST_Controller;
use Automattic\Jetpack\Waf\Waf_Runner;
use Automattic\Jetpack\Waf\Waf_Stats;
use Jetpack_Protect;
use WP_Error;
use WP_REST_Request;
Expand Down Expand Up @@ -380,10 +382,15 @@ public static function api_get_waf() {

return new WP_REST_Response(
array(
'is_seen' => Jetpack_Protect::get_waf_seen_status(),
'is_enabled' => Waf_Runner::is_enabled(),
'config' => Waf_Runner::get_config(),
'stats' => Jetpack_Protect::get_waf_stats(),
'wafSupported' => Waf_Runner::is_supported_environment(),
'currentIp' => IP_Utils::get_ip(),
'isSeen' => Jetpack_Protect::get_waf_seen_status(),
'upgradeIsSeen' => Jetpack_Protect::get_waf_upgrade_seen_status(),
'displayUpgradeBadge' => Jetpack_Protect::get_waf_upgrade_badge_display_status(),
'isEnabled' => Waf_Runner::is_enabled(),
'config' => Waf_Runner::get_config(),
'stats' => Jetpack_Protect::get_waf_stats(),
'globalStats' => Waf_Stats::get_global_stats(),
)
);
}
Expand Down
68 changes: 64 additions & 4 deletions projects/plugins/protect/src/js/api.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import apiFetch from '@wordpress/api-fetch';
import camelize from 'camelize';

const API = {
fetchWaf: () =>
getWaf: () =>
apiFetch( {
path: 'jetpack-protect/v1/waf',
method: 'GET',
Expand All @@ -19,7 +19,7 @@ const API = {
method: 'POST',
path: 'jetpack/v4/waf',
data,
} ),
} ).then( camelize ),

wafSeen: () =>
apiFetch( {
Expand All @@ -33,7 +33,7 @@ const API = {
method: 'POST',
} ),

fetchOnboardingProgress: () =>
getOnboardingProgress: () =>
apiFetch( {
path: 'jetpack-protect/v1/onboarding-progress',
method: 'GET',
Expand All @@ -46,11 +46,71 @@ const API = {
data: { step_ids: stepIds },
} ),

fetchScanHistory: () =>
getScanHistory: () =>
apiFetch( {
path: 'jetpack-protect/v1/scan-history',
method: 'GET',
} ).then( camelize ),

scan: () =>
apiFetch( {
path: `jetpack-protect/v1/scan`,
method: 'POST',
} ),

getScanStatus: () =>
apiFetch( {
path: 'jetpack-protect/v1/status?hard_refresh=true',
method: 'GET',
} ).then( camelize ),

fixThreats: threatIds =>
apiFetch( {
path: `jetpack-protect/v1/fix-threats`,
method: 'POST',
data: { threat_ids: threatIds },
} ),

getFixersStatus: threatIds => {
const path = threatIds.reduce( ( carryPath, threatId ) => {
return `${ carryPath }threat_ids[]=${ threatId }&`;
}, 'jetpack-protect/v1/fix-threats-status?' );

return apiFetch( {
path,
method: 'GET',
} );
},

ignoreThreat: threatId =>
apiFetch( {
path: `jetpack-protect/v1/ignore-threat?threat_id=${ threatId }`,
method: 'POST',
} ),

unIgnoreThreat: threatId =>
apiFetch( {
path: `jetpack-protect/v1/unignore-threat?threat_id=${ threatId }`,
method: 'POST',
} ),

checkCredentials: () =>
apiFetch( {
path: 'jetpack-protect/v1/check-credentials',
method: 'POST',
} ),

checkPlan: () =>
apiFetch( {
path: 'jetpack-protect/v1/check-plan',
method: 'GET',
} ),

getProductData: () =>
apiFetch( {
path: '/my-jetpack/v1/site/products/scan',
method: 'GET',
} ).then( camelize ),
};

export default API;
50 changes: 8 additions & 42 deletions projects/plugins/protect/src/js/components/admin-page/index.jsx
Original file line number Diff line number Diff line change
@@ -1,62 +1,28 @@
import { AdminPage as JetpackAdminPage, Container } from '@automattic/jetpack-components';
import { useProductCheckoutWorkflow } from '@automattic/jetpack-connection';
import apiFetch from '@wordpress/api-fetch';
import { useDispatch, useSelect } from '@wordpress/data';
import { useConnection } from '@automattic/jetpack-connection';
import { __ } from '@wordpress/i18n';
import { addQueryArgs, getQueryArg } from '@wordpress/url';
import React, { useEffect } from 'react';
import { JETPACK_SCAN_SLUG } from '../../constants';
import useNotices from '../../hooks/use-notices';
import { useCheckoutContext } from '../../hooks/use-plan';
import useWafData from '../../hooks/use-waf-data';
import { STORE_ID } from '../../state/store';
import InterstitialPage from '../interstitial-page';
import Logo from '../logo';
import Notice from '../notice';
import Tabs, { Tab } from '../tabs';
import styles from './styles.module.scss';
import useRegistrationWatcher from './use-registration-watcher';

const AdminPage = ( { children } ) => {
useRegistrationWatcher();

const { notice } = useNotices();
const { hasCheckoutStarted } = useCheckoutContext();
const { isRegistered } = useConnection();
const { isSeen: wafSeen } = useWafData();
const notice = useSelect( select => select( STORE_ID ).getNotice() );
const { refreshPlan, startScanOptimistically, refreshStatus, refreshScanHistory } =
useDispatch( STORE_ID );
const { adminUrl } = window.jetpackProtectInitialState || {};
const { run, isRegistered, hasCheckoutStarted } = useProductCheckoutWorkflow( {
productSlug: JETPACK_SCAN_SLUG,
redirectUrl: addQueryArgs( adminUrl, { checkPlan: true } ),
siteProductAvailabilityHandler: async () =>
apiFetch( {
path: 'jetpack-protect/v1/check-plan',
method: 'GET',
} ).then( hasRequiredPlan => hasRequiredPlan ),
useBlogIdSuffix: true,
} );

useEffect( () => {
if ( getQueryArg( window.location.search, 'checkPlan' ) ) {
startScanOptimistically();
setTimeout( () => {
refreshPlan();
refreshStatus( true );
refreshScanHistory();
}, 5000 );
}
}, [ refreshPlan, refreshStatus, refreshScanHistory, startScanOptimistically ] );

/*
* Show interstital page when
* - Site is not registered
* - Checkout workflow has started
*/
if ( ! isRegistered || hasCheckoutStarted ) {
return <InterstitialPage onScanAdd={ run } />;
return <InterstitialPage />;
}

return (
<JetpackAdminPage moduleName={ __( 'Jetpack Protect', 'jetpack-protect' ) } header={ <Logo /> }>
{ notice.message && <Notice floating={ true } dismissable={ true } { ...notice } /> }
{ notice && <Notice floating={ true } dismissable={ true } { ...notice } /> }
<Container horizontalSpacing={ 0 }>
<Tabs className={ styles.navigation }>
<Tab link="/scan" label={ __( 'Scan', 'jetpack-protect' ) } />
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,23 +1,13 @@
import { Spinner } from '@automattic/jetpack-components';
import { useDispatch, useSelect } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
import { STORE_ID } from '../../state/store';
import useCredentialsQuery from '../../data/use-credentials-query';
import CredentialsNeededModal from '../credentials-needed-modal';
import styles from './styles.module.scss';

const CredentialsGate = ( { children } ) => {
const { checkCredentials } = useDispatch( STORE_ID );
const { data: credentials, isLoading: credentialsIsFetching } = useCredentialsQuery();

const { credentials, credentialsIsFetching } = useSelect( select => ( {
credentials: select( STORE_ID ).getCredentials(),
credentialsIsFetching: select( STORE_ID ).getCredentialsIsFetching(),
} ) );

if ( ! credentials && ! credentialsIsFetching ) {
checkCredentials();
}

if ( ! credentials ) {
if ( credentialsIsFetching ) {
return (
<div className={ styles.loading }>
<Spinner
Expand All @@ -35,7 +25,7 @@ const CredentialsGate = ( { children } ) => {
);
}

if ( credentials.length === 0 ) {
if ( ! credentials || credentials.length === 0 ) {
return <CredentialsNeededModal />;
}

Expand Down
Loading

0 comments on commit d5a02c8

Please sign in to comment.