From 05ad9cfc483731ca70a710ef4917b9147db1b73b Mon Sep 17 00:00:00 2001 From: Philipp Stracker Date: Thu, 6 Feb 2025 14:25:38 +0100 Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20Payment=20method=20store:?= =?UTF-8?q?=20Refactor=20to=20thunks?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../resources/js/data/payment/action-types.js | 3 -- .../resources/js/data/payment/actions.js | 26 ++++++++---- .../resources/js/data/payment/controls.js | 23 ----------- .../resources/js/data/payment/index.js | 5 +-- .../resources/js/data/payment/resolvers.js | 40 ++++++++++--------- 5 files changed, 40 insertions(+), 57 deletions(-) delete mode 100644 modules/ppcp-settings/resources/js/data/payment/controls.js diff --git a/modules/ppcp-settings/resources/js/data/payment/action-types.js b/modules/ppcp-settings/resources/js/data/payment/action-types.js index ebb89c7f4..ac59d5161 100644 --- a/modules/ppcp-settings/resources/js/data/payment/action-types.js +++ b/modules/ppcp-settings/resources/js/data/payment/action-types.js @@ -13,7 +13,4 @@ export default { RESET: 'PAYMENT:RESET', HYDRATE: 'PAYMENT:HYDRATE', CHANGE_PAYMENT_SETTING: 'PAYMENT:CHANGE_PAYMENT_SETTING', - - // Controls - always start with "DO_". - DO_PERSIST_DATA: 'PAYMENT:DO_PERSIST_DATA', }; diff --git a/modules/ppcp-settings/resources/js/data/payment/actions.js b/modules/ppcp-settings/resources/js/data/payment/actions.js index 36faa1f28..c412119d8 100644 --- a/modules/ppcp-settings/resources/js/data/payment/actions.js +++ b/modules/ppcp-settings/resources/js/data/payment/actions.js @@ -7,10 +7,10 @@ * @file */ -import { select } from '@wordpress/data'; +import apiFetch from '@wordpress/api-fetch'; import ACTION_TYPES from './action-types'; -import { STORE_NAME } from './constants'; +import { REST_PERSIST_PATH } from './constants'; /** * @typedef {Object} Action An action object that is handled by a reducer or control. @@ -81,12 +81,22 @@ export const changePaymentSettings = ( id, props ) => ( { } ); /** - * Side effect. Triggers the persistence of store data to the server. + * Thunk action creator. Triggers the persistence of store data to the server. * - * @return {Action} The action. + * @return {Function} The thunk function. */ -export const persist = function* () { - const data = yield select( STORE_NAME ).persistentData(); +export function persist() { + return async ( { select } ) => { + const data = select.persistentData(); - yield { type: ACTION_TYPES.DO_PERSIST_DATA, data }; -}; + try { + await apiFetch( { + path: REST_PERSIST_PATH, + method: 'POST', + data, + } ); + } catch ( e ) { + console.error( 'Error saving progress.', e ); + } + }; +} diff --git a/modules/ppcp-settings/resources/js/data/payment/controls.js b/modules/ppcp-settings/resources/js/data/payment/controls.js deleted file mode 100644 index 9295b62bc..000000000 --- a/modules/ppcp-settings/resources/js/data/payment/controls.js +++ /dev/null @@ -1,23 +0,0 @@ -/** - * Controls: Implement side effects, typically asynchronous operations. - * - * Controls use ACTION_TYPES keys as identifiers. - * They are triggered by corresponding actions and handle external interactions. - * - * @file - */ - -import apiFetch from '@wordpress/api-fetch'; - -import { REST_PERSIST_PATH } from './constants'; -import ACTION_TYPES from './action-types'; - -export const controls = { - async [ ACTION_TYPES.DO_PERSIST_DATA ]( { data } ) { - return await apiFetch( { - path: REST_PERSIST_PATH, - method: 'POST', - data, - } ); - }, -}; diff --git a/modules/ppcp-settings/resources/js/data/payment/index.js b/modules/ppcp-settings/resources/js/data/payment/index.js index ca86eef0c..66d4deb79 100644 --- a/modules/ppcp-settings/resources/js/data/payment/index.js +++ b/modules/ppcp-settings/resources/js/data/payment/index.js @@ -1,13 +1,11 @@ import { createReduxStore, register } from '@wordpress/data'; -import { controls as wpControls } from '@wordpress/data-controls'; import { STORE_NAME } from './constants'; import reducer from './reducer'; import * as selectors from './selectors'; import * as actions from './actions'; import * as hooks from './hooks'; -import { resolvers } from './resolvers'; -import { controls } from './controls'; +import * as resolvers from './resolvers'; import { initTodoSync } from '../sync/todo-state-sync'; /** @@ -19,7 +17,6 @@ import { initTodoSync } from '../sync/todo-state-sync'; export const initStore = () => { const store = createReduxStore( STORE_NAME, { reducer, - controls: { ...wpControls, ...controls }, actions, selectors, resolvers, diff --git a/modules/ppcp-settings/resources/js/data/payment/resolvers.js b/modules/ppcp-settings/resources/js/data/payment/resolvers.js index ebc6832bb..b9313bab4 100644 --- a/modules/ppcp-settings/resources/js/data/payment/resolvers.js +++ b/modules/ppcp-settings/resources/js/data/payment/resolvers.js @@ -8,29 +8,31 @@ * @file */ -import { dispatch } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; -import { apiFetch } from '@wordpress/data-controls'; +import apiFetch from '@wordpress/api-fetch'; -import { STORE_NAME, REST_HYDRATE_PATH } from './constants'; +import { REST_HYDRATE_PATH } from './constants'; -export const resolvers = { - /** - * Retrieve settings from the site's REST API. - */ - *persistentData() { +/** + * Retrieve settings from the site's REST API. + */ +export function persistentData() { + return async ( { dispatch, registry } ) => { try { - const result = yield apiFetch( { path: REST_HYDRATE_PATH } ); + const result = await apiFetch( { path: REST_HYDRATE_PATH } ); - yield dispatch( STORE_NAME ).hydrate( result ); - yield dispatch( STORE_NAME ).setIsReady( true ); + await dispatch.hydrate( result ); + await dispatch.setIsReady( true ); } catch ( e ) { - yield dispatch( 'core/notices' ).createErrorNotice( - __( - 'Error retrieving payment details.', - 'woocommerce-paypal-payments' - ) - ); + // TODO: Add the module name to the error message. + await registry + .dispatch( 'core/notices' ) + .createErrorNotice( + __( + 'Error retrieving payment details.', + 'woocommerce-paypal-payments' + ) + ); } - }, -}; + }; +}