♻️ Apply new code style to onboarding store

This commit is contained in:
Philipp Stracker 2025-01-17 19:25:44 +01:00
parent 10129d49b5
commit 4d38c15b29
No known key found for this signature in database
2 changed files with 59 additions and 64 deletions

View file

@ -36,16 +36,37 @@ export const hydrate = ( payload ) => ( {
payload,
} );
/**
* Generic transient-data updater.
*
* @param {string} prop Name of the property to update.
* @param {any} value The new value of the property.
* @return {Action} The action.
*/
export const setTransient = ( prop, value ) => ( {
type: ACTION_TYPES.SET_TRANSIENT,
payload: { [ prop ]: value },
} );
/**
* Generic persistent-data updater.
*
* @param {string} prop Name of the property to update.
* @param {any} value The new value of the property.
* @return {Action} The action.
*/
export const setPersistent = ( prop, value ) => ( {
type: ACTION_TYPES.SET_PERSISTENT,
payload: { [ prop ]: value },
} );
/**
* Transient. Marks the onboarding details as "ready", i.e., fully initialized.
*
* @param {boolean} isReady
* @return {Action} The action.
*/
export const setIsReady = ( isReady ) => ( {
type: ACTION_TYPES.SET_TRANSIENT,
payload: { isReady },
} );
export const setIsReady = ( isReady ) => setTransient( 'isReady', isReady );
/**
* Transient. Sets the "manualClientId" value.
@ -53,10 +74,8 @@ export const setIsReady = ( isReady ) => ( {
* @param {string} manualClientId
* @return {Action} The action.
*/
export const setManualClientId = ( manualClientId ) => ( {
type: ACTION_TYPES.SET_TRANSIENT,
payload: { manualClientId },
} );
export const setManualClientId = ( manualClientId ) =>
setTransient( 'manualClientId', manualClientId );
/**
* Transient. Sets the "manualClientSecret" value.
@ -64,10 +83,8 @@ export const setManualClientId = ( manualClientId ) => ( {
* @param {string} manualClientSecret
* @return {Action} The action.
*/
export const setManualClientSecret = ( manualClientSecret ) => ( {
type: ACTION_TYPES.SET_TRANSIENT,
payload: { manualClientSecret },
} );
export const setManualClientSecret = ( manualClientSecret ) =>
setTransient( 'manualClientSecret', manualClientSecret );
/**
* Persistent.Set the "onboarding completed" flag which shows or hides the wizard.
@ -75,10 +92,8 @@ export const setManualClientSecret = ( manualClientSecret ) => ( {
* @param {boolean} completed
* @return {Action} The action.
*/
export const setCompleted = ( completed ) => ( {
type: ACTION_TYPES.SET_PERSISTENT,
payload: { completed },
} );
export const setCompleted = ( completed ) =>
setPersistent( 'completed', completed );
/**
* Persistent. Sets the onboarding wizard to a new step.
@ -86,10 +101,7 @@ export const setCompleted = ( completed ) => ( {
* @param {number} step
* @return {Action} The action.
*/
export const setStep = ( step ) => ( {
type: ACTION_TYPES.SET_PERSISTENT,
payload: { step },
} );
export const setStep = ( step ) => setPersistent( 'step', step );
/**
* Persistent. Sets the "isCasualSeller" value.
@ -97,10 +109,8 @@ export const setStep = ( step ) => ( {
* @param {boolean} isCasualSeller
* @return {Action} The action.
*/
export const setIsCasualSeller = ( isCasualSeller ) => ( {
type: ACTION_TYPES.SET_PERSISTENT,
payload: { isCasualSeller },
} );
export const setIsCasualSeller = ( isCasualSeller ) =>
setPersistent( 'isCasualSeller', isCasualSeller );
/**
* Persistent. Sets the "areOptionalPaymentMethodsEnabled" value.
@ -110,10 +120,11 @@ export const setIsCasualSeller = ( isCasualSeller ) => ( {
*/
export const setAreOptionalPaymentMethodsEnabled = (
areOptionalPaymentMethodsEnabled
) => ( {
type: ACTION_TYPES.SET_PERSISTENT,
payload: { areOptionalPaymentMethodsEnabled },
} );
) =>
setPersistent(
'areOptionalPaymentMethodsEnabled',
areOptionalPaymentMethodsEnabled
);
/**
* Persistent. Sets the "products" array.
@ -121,10 +132,8 @@ export const setAreOptionalPaymentMethodsEnabled = (
* @param {string[]} products
* @return {Action} The action.
*/
export const setProducts = ( products ) => ( {
type: ACTION_TYPES.SET_PERSISTENT,
payload: { products },
} );
export const setProducts = ( products ) =>
setPersistent( 'products', products );
/**
* Side effect. Triggers the persistence of onboarding data to the server.

View file

@ -9,32 +9,14 @@
import { useSelect, useDispatch } from '@wordpress/data';
import { createHooksForStore } from '../utils';
import { PRODUCT_TYPES } from './configuration';
import { STORE_NAME } from './constants';
const useTransient = ( key ) =>
useSelect(
( select ) => select( STORE_NAME ).transientData()?.[ key ],
[ key ]
);
const usePersistent = ( key ) =>
useSelect(
( select ) => select( STORE_NAME ).persistentData()?.[ key ],
[ key ]
);
const useHooks = () => {
const {
persist,
setStep,
setCompleted,
setIsCasualSeller,
setManualClientId,
setManualClientSecret,
setAreOptionalPaymentMethodsEnabled,
setProducts,
} = useDispatch( STORE_NAME );
const { useTransient, usePersistent } = createHooksForStore( STORE_NAME );
const { persist } = useDispatch( STORE_NAME );
// Read-only flags and derived state.
const flags = useSelect( ( select ) => select( STORE_NAME ).flags(), [] );
@ -44,18 +26,22 @@ const useHooks = () => {
);
// Transient accessors.
const isReady = useTransient( 'isReady' );
const manualClientId = useTransient( 'manualClientId' );
const manualClientSecret = useTransient( 'manualClientSecret' );
const [ isReady ] = useTransient( 'isReady' );
const [ manualClientId, setManualClientId ] =
useTransient( 'manualClientId' );
const [ manualClientSecret, setManualClientSecret ] =
useTransient( 'manualClientSecret' );
// Persistent accessors.
const step = usePersistent( 'step' );
const completed = usePersistent( 'completed' );
const isCasualSeller = usePersistent( 'isCasualSeller' );
const areOptionalPaymentMethodsEnabled = usePersistent(
'areOptionalPaymentMethodsEnabled'
);
const products = usePersistent( 'products' );
const [ step, setStep ] = usePersistent( 'step' );
const [ completed, setCompleted ] = usePersistent( 'completed' );
const [ isCasualSeller, setIsCasualSeller ] =
usePersistent( 'isCasualSeller' );
const [
areOptionalPaymentMethodsEnabled,
setAreOptionalPaymentMethodsEnabled,
] = usePersistent( 'areOptionalPaymentMethodsEnabled' );
const [ products, setProducts ] = usePersistent( 'products' );
const savePersistent = async ( setter, value ) => {
setter( value );