woocommerce-paypal-payments/modules/ppcp-settings/resources/js/hooks/usePaymentGatewayRefresh.js

import { useState, useEffect, useCallback } from '@wordpress/element';
import { useDispatch } from '@wordpress/data';
import apiFetch from '@wordpress/api-fetch';
import { STORE_NAME as PAYMENT_STORE_NAME } from '../data/payment';
import { OnboardingHooks } from '../data';
import { STORE_NAME as ONBOARDING_STORE_NAME } from '../data/onboarding';
/**
 * Custom hook for refreshing payment gateway data
 *
 * @return {Object} Refresh API including the refresh function and state
 */
export const usePaymentGatewayRefresh = () => {
	const paymentDispatch = useDispatch( PAYMENT_STORE_NAME );
	const { gatewaysRefreshed } = OnboardingHooks.useGatewayRefresh();
	const { gatewaysSynced } = OnboardingHooks.useGatewaySync();
	const { refreshGateways } = useDispatch( ONBOARDING_STORE_NAME );
	const { hydrate, refresh, reset } = paymentDispatch;
	const [ refreshCompleted, setRefreshCompleted ] = useState( false );
	const [ isRefreshing, setIsRefreshing ] = useState( false );
	const [ refreshError, setRefreshError ] = useState( null );
	// Only refresh if gateways are synced (post-onboarding payment method toggling happened & Redux data loaded correctly).
	const isReadyToRefresh = gatewaysSynced;

	/**
	 * Refreshes payment gateway data
	 *
	 * @return {Promise<boolean|Object>} True when completed successfully, or object with error details
	 */
	const refreshPaymentGateways = useCallback( async () => {
		if ( isRefreshing ) {
			return {
				success: false,
				skipped: true,
				reason: 'already-refreshing',
			};
		}
		if ( ! isReadyToRefresh ) {
			return { success: false, skipped: true, reason: 'not-ready' };
		}
		setIsRefreshing( true );
		setRefreshError( null );
		try {
			// Reset payment store if available.
			if ( typeof reset === 'function' ) {
				await reset();
			}
			// Fetch payment data.
			const response = await apiFetch( {
				path: `/wc/v3/wc_paypal/payment`,
				method: 'GET',
			} );
			// Update store with fetched data.
			hydrate( response );
			// Refresh payment store if available.
			if ( typeof refresh === 'function' ) {
				await refresh();
			}
			// Update gateways_refreshed flag in database.
			await apiFetch( {
				path: '/wc/v3/wc_paypal/onboarding/refresh-gateways',
				method: 'POST',
			} );
			// Update Redux state to mark gateways as refreshed.
			await refreshGateways();
			setRefreshCompleted( true );
			return { success: true };
		} catch ( error ) {
			setRefreshError( error );
			return { success: false, error };
		} finally {
			setIsRefreshing( false );
		}
	}, [
		isRefreshing,
		isReadyToRefresh,
		reset,
		hydrate,
		refresh,
		refreshGateways,
	] );

	// Auto-trigger refresh when conditions are met.
	useEffect( () => {
		if (
			isReadyToRefresh &&
			! gatewaysRefreshed &&
			! isRefreshing &&
			! refreshCompleted
		) {
			refreshPaymentGateways().catch( ( error ) => {
				// Error handling is managed through state.
			} );
		}
	}, [
		isReadyToRefresh,
		gatewaysRefreshed,
		isRefreshing,
		refreshCompleted,
		refreshPaymentGateways,
	] );

	return {
		refreshPaymentGateways,
		refreshCompleted,
		isRefreshing,
		refreshError,
		gatewaysRefreshed: gatewaysRefreshed || refreshCompleted,
	};
};

export default usePaymentGatewayRefresh;