woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-06 09:08:09 +08:00
Code Issues Projects Packages Wiki Activity Actions 7

♻️ Refactor Styles store

Browse source
This commit is contained in:
Philipp Stracker 2025-02-05 18:51:41 +01:00
parent de24a30fac
commit d84ab9f5ea
No known key found for this signature in database
5 changed files with 43 additions and 61 deletions
Download patch file Download diff file Expand all files Collapse all files

11
modules/ppcp-settings/resources/js/data/styling/action-types.js
View file

@ -6,13 +6,10 @@
export default {
// Transient data.
SET_TRANSIENT: 'STYLE:SET_TRANSIENT',
SET_TRANSIENT: 'ppcp/style/SET_TRANSIENT',
// Persistent data.
SET_PERSISTENT: 'STYLE:SET_PERSISTENT',
RESET: 'STYLE:RESET',
HYDRATE: 'STYLE:HYDRATE',
// Controls - always start with "DO_".
DO_PERSIST_DATA: 'STYLE:DO_PERSIST_DATA',
SET_PERSISTENT: 'ppcp/style/SET_PERSISTENT',
RESET: 'ppcp/style/RESET',
HYDRATE: 'ppcp/style/HYDRATE',
};

26
modules/ppcp-settings/resources/js/data/styling/actions.js
View file

@ -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.
@ -69,12 +69,22 @@ export const setPersistent = ( prop, value ) => ( {
export const setIsReady = ( state ) => setTransient( 'isReady', state );
/**
* 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 );
}
};
}

23
modules/ppcp-settings/resources/js/data/styling/controls.js vendored
View file

@ -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,
} );
},
};

5
modules/ppcp-settings/resources/js/data/styling/index.js
View file

@ -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';
/**
* Initializes and registers the settings store with WordPress data layer.
@ -18,7 +16,6 @@ import { controls } from './controls';
export const initStore = () => {
const store = createReduxStore( STORE_NAME, {
reducer,
controls: { ...wpControls, ...controls },
actions,
selectors,
resolvers,

39
modules/ppcp-settings/resources/js/data/styling/resolvers.js
View file

@ -8,29 +8,30 @@
* @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 style-details.',
'woocommerce-paypal-payments'
)
);
await registry
.dispatch( 'core/notices' )
.createErrorNotice(
__(
'Error retrieving Styling details.',
'woocommerce-paypal-payments'
)
);
}
},
};
};
}