diff --git a/projects/packages/forms/changelog/fix-forms-disable-integrations-api-call b/projects/packages/forms/changelog/fix-forms-disable-integrations-api-call new file mode 100644 index 0000000000000..9d212f9dbd92b --- /dev/null +++ b/projects/packages/forms/changelog/fix-forms-disable-integrations-api-call @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Forms: avoid integrations api call if disabled. diff --git a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integration-controls.js b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integration-controls.js index 96200a301ca65..03cf0718cfb66 100644 --- a/projects/packages/forms/src/blocks/contact-form/components/jetpack-integration-controls.js +++ b/projects/packages/forms/src/blocks/contact-form/components/jetpack-integration-controls.js @@ -5,6 +5,7 @@ import { useSelect, useDispatch } from '@wordpress/data'; import { useState } from '@wordpress/element'; import { __ } from '@wordpress/i18n'; import { plugins } from '@wordpress/icons'; +import useConfigValue from '../../../hooks/use-config-value'; import { INTEGRATIONS_STORE } from '../../../store/integrations'; import IntegrationsModal from './jetpack-integrations-modal'; import ActiveIntegrations from './jetpack-integrations-modal/active-integrations'; @@ -19,11 +20,20 @@ import ActiveIntegrations from './jetpack-integrations-modal/active-integrations */ export default function IntegrationControls( { attributes, setAttributes } ) { const [ isModalOpen, setIsModalOpen ] = useState( false ); - const integrations = useSelect( select => { - const store = select( INTEGRATIONS_STORE ); - return store.getIntegrations() || []; - }, [] ); - const isLoading = useSelect( select => select( INTEGRATIONS_STORE ).isIntegrationsLoading(), [] ); + const isIntegrationsEnabled = useConfigValue( 'isIntegrationsEnabled' ); + const { integrations, isLoading } = useSelect( + select => { + if ( isIntegrationsEnabled === false ) { + return { integrations: [], isLoading: false }; + } + const store = select( INTEGRATIONS_STORE ); + return { + integrations: store.getIntegrations() || [], + isLoading: store.isIntegrationsLoading(), + }; + }, + [ isIntegrationsEnabled ] + ); const { refreshIntegrations } = useDispatch( INTEGRATIONS_STORE ); const { tracks } = useAnalytics(); diff --git a/projects/packages/forms/src/blocks/contact-form/shared/hooks/use-form-block-defaults.js b/projects/packages/forms/src/blocks/contact-form/shared/hooks/use-form-block-defaults.js index a44c8fc867d4a..07332616f6e9f 100644 --- a/projects/packages/forms/src/blocks/contact-form/shared/hooks/use-form-block-defaults.js +++ b/projects/packages/forms/src/blocks/contact-form/shared/hooks/use-form-block-defaults.js @@ -1,5 +1,6 @@ import { useSelect } from '@wordpress/data'; import { useEffect } from '@wordpress/element'; +import useConfigValue from '../../../../hooks/use-config-value'; import { INTEGRATIONS_STORE } from '../../../../store/integrations'; /** @@ -13,11 +14,20 @@ import { INTEGRATIONS_STORE } from '../../../../store/integrations'; * @param {Function} params.setAttributes - Setter for block attributes */ export default function useFormBlockDefaults( { attributes, setAttributes } ) { - const integrations = useSelect( select => { - const store = select( INTEGRATIONS_STORE ); - return store.getIntegrations() || []; - }, [] ); - const isLoading = useSelect( select => select( INTEGRATIONS_STORE ).isIntegrationsLoading(), [] ); + const isIntegrationsEnabled = useConfigValue( 'isIntegrationsEnabled' ); + const { integrations, isLoading } = useSelect( + select => { + if ( isIntegrationsEnabled === false ) { + return { integrations: [], isLoading: false }; + } + const store = select( INTEGRATIONS_STORE ); + return { + integrations: store.getIntegrations() || [], + isLoading: store.isIntegrationsLoading(), + }; + }, + [ isIntegrationsEnabled ] + ); useEffect( () => { if ( isLoading || ! Array.isArray( integrations ) ) { diff --git a/projects/packages/forms/src/dashboard/class-dashboard.php b/projects/packages/forms/src/dashboard/class-dashboard.php index f526f29b9ef85..44d57036f5ab4 100644 --- a/projects/packages/forms/src/dashboard/class-dashboard.php +++ b/projects/packages/forms/src/dashboard/class-dashboard.php @@ -11,6 +11,7 @@ use Automattic\Jetpack\Assets; use Automattic\Jetpack\Connection\Initial_State as Connection_Initial_State; use Automattic\Jetpack\Forms\ContactForm\Contact_Form_Plugin; +use Automattic\Jetpack\Forms\Jetpack_Forms; use Automattic\Jetpack\Tracking; if ( ! defined( 'ABSPATH' ) ) { @@ -103,14 +104,16 @@ public function load_admin_scripts() { $preload_paths = array( '/wp/v2/types?context=view', '/wp/v2/feedback/config', - '/wp/v2/feedback/integrations-metadata', '/wp/v2/feedback/counts', $filters_path, $filters_locale_path, $initial_responses_path, $initial_responses_locale_path, ); - $preload_data_raw = array_reduce( $preload_paths, 'rest_preload_api_request', array() ); + if ( Jetpack_Forms::is_integrations_enabled() ) { + $preload_paths[] = '/wp/v2/feedback/integrations-metadata'; + } + $preload_data_raw = array_reduce( $preload_paths, 'rest_preload_api_request', array() ); // Normalize keys to match what apiFetch will request (without domain). $preload_data = array(); diff --git a/projects/packages/forms/src/dashboard/components/layout/index.tsx b/projects/packages/forms/src/dashboard/components/layout/index.tsx index fee5ae2a5a38e..7e9d34d8abc1d 100644 --- a/projects/packages/forms/src/dashboard/components/layout/index.tsx +++ b/projects/packages/forms/src/dashboard/components/layout/index.tsx @@ -30,7 +30,6 @@ const Layout = () => { const enableIntegrationsTab = useConfigValue( 'isIntegrationsEnabled' ); const isLoadingConfig = enableIntegrationsTab === undefined; - const { currentStatus } = useSelect( select => ( { currentStatus: select( dashboardStore ).getCurrentStatus(), diff --git a/projects/packages/forms/src/dashboard/integrations/index.tsx b/projects/packages/forms/src/dashboard/integrations/index.tsx index 0b5e672bad217..322709024b982 100644 --- a/projects/packages/forms/src/dashboard/integrations/index.tsx +++ b/projects/packages/forms/src/dashboard/integrations/index.tsx @@ -8,6 +8,7 @@ import { useState, useCallback } from 'react'; /** * Internal dependencies */ +import useConfigValue from '../../hooks/use-config-value'; import { INTEGRATIONS_STORE } from '../../store/integrations'; import AkismetDashboardCard from './akismet-card'; import GoogleSheetsDashboardCard from './google-sheets-card'; @@ -25,12 +26,19 @@ import type { Integration } from '../../types'; const EMPTY_ARRAY: Integration[] = []; const Integrations = () => { - const { integrations } = useSelect( ( select: SelectIntegrations ) => { - const store = select( INTEGRATIONS_STORE ); - return { - integrations: store.getIntegrations() ?? EMPTY_ARRAY, - }; - }, [] ) as { integrations: Integration[] }; + const isIntegrationsEnabled = useConfigValue( 'isIntegrationsEnabled' ); + const { integrations } = useSelect( + ( select: SelectIntegrations ) => { + if ( isIntegrationsEnabled === false ) { + return { integrations: EMPTY_ARRAY }; + } + const store = select( INTEGRATIONS_STORE ); + return { + integrations: store.getIntegrations() ?? EMPTY_ARRAY, + }; + }, + [ isIntegrationsEnabled ] + ) as { integrations: Integration[] }; const { refreshIntegrations } = useDispatch( INTEGRATIONS_STORE ) as IntegrationsDispatch; const [ expandedCards, setExpandedCards ] = useState( { akismet: false,