Forms: avoid api call if integrations are disabled

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.

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();
 

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 ) ) {

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();

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(),

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,