New Settings UI: Apply feedback

This commit is contained in:
Himad M 2024-12-03 15:24:49 -04:00
parent a06a74004c
commit 4f0f71f5e0
No known key found for this signature in database
GPG key ID: 5FC769E9888A7B98
5 changed files with 37 additions and 27 deletions

View file

@ -43,7 +43,11 @@ const useHooks = () => {
const clientSecret = usePersistent( 'clientSecret' );
const isSandboxMode = usePersistent( 'useSandbox' );
const isManualConnectionMode = usePersistent( 'useManualConnection' );
const flags = usePersistent( 'flags' );
const wooSettings = useSelect(
( select ) => select( STORE_NAME ).wooSettings(),
[]
);
const savePersistent = async ( setter, value ) => {
setter( value );
@ -70,7 +74,7 @@ const useHooks = () => {
},
connectViaSandbox,
connectViaIdAndSecret,
flags,
wooSettings,
};
};
@ -113,7 +117,6 @@ export const useManualConnection = () => {
};
export const useWooSettings = () => {
const { flags = {} } = useHooks();
const { country, currency } = flags;
return { storeCountry: country, storeCurrency: currency };
const { wooSettings } = useHooks();
return wooSettings;
};

View file

@ -22,10 +22,6 @@ const defaultPersistent = {
useManualConnection: false,
clientId: '',
clientSecret: '',
flags: {
country: '',
currency: '',
},
};
// Reducer logic.
@ -42,11 +38,18 @@ const commonReducer = createReducer( defaultTransient, defaultPersistent, {
[ ACTION_TYPES.SET_PERSISTENT ]: ( state, action ) =>
setPersistent( state, action ),
[ ACTION_TYPES.HYDRATE ]: ( state, payload ) =>
setPersistent( state, {
...payload.data,
flags: payload.flags,
} ),
[ ACTION_TYPES.HYDRATE ]: ( state, payload ) => {
const newState = setPersistent( state, payload.data );
if ( payload.wooSettings ) {
newState.wooSettings = {
...newState.wooSettings,
...payload.wooSettings,
};
}
return newState;
},
} );
export default commonReducer;

View file

@ -16,6 +16,10 @@ export const persistentData = ( state ) => {
};
export const transientData = ( state ) => {
const { data, ...transientState } = getState( state );
const { data, wooSettings, ...transientState } = getState( state ); // ← extract the wooSettings, to ensure they are not part of the "transientState" collection.
return transientState || EMPTY_OBJ;
};
export const wooSettings = ( state ) => {
return getState( state ).wooSettings || EMPTY_OBJ;
};