mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-06 18:16:38 +08:00
New Settings UI: Apply feedback
This commit is contained in:
parent
a06a74004c
commit
4f0f71f5e0
5 changed files with 37 additions and 27 deletions
|
@ -43,7 +43,11 @@ const useHooks = () => {
|
||||||
const clientSecret = usePersistent( 'clientSecret' );
|
const clientSecret = usePersistent( 'clientSecret' );
|
||||||
const isSandboxMode = usePersistent( 'useSandbox' );
|
const isSandboxMode = usePersistent( 'useSandbox' );
|
||||||
const isManualConnectionMode = usePersistent( 'useManualConnection' );
|
const isManualConnectionMode = usePersistent( 'useManualConnection' );
|
||||||
const flags = usePersistent( 'flags' );
|
|
||||||
|
const wooSettings = useSelect(
|
||||||
|
( select ) => select( STORE_NAME ).wooSettings(),
|
||||||
|
[]
|
||||||
|
);
|
||||||
|
|
||||||
const savePersistent = async ( setter, value ) => {
|
const savePersistent = async ( setter, value ) => {
|
||||||
setter( value );
|
setter( value );
|
||||||
|
@ -70,7 +74,7 @@ const useHooks = () => {
|
||||||
},
|
},
|
||||||
connectViaSandbox,
|
connectViaSandbox,
|
||||||
connectViaIdAndSecret,
|
connectViaIdAndSecret,
|
||||||
flags,
|
wooSettings,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -113,7 +117,6 @@ export const useManualConnection = () => {
|
||||||
};
|
};
|
||||||
|
|
||||||
export const useWooSettings = () => {
|
export const useWooSettings = () => {
|
||||||
const { flags = {} } = useHooks();
|
const { wooSettings } = useHooks();
|
||||||
const { country, currency } = flags;
|
return wooSettings;
|
||||||
return { storeCountry: country, storeCurrency: currency };
|
|
||||||
};
|
};
|
||||||
|
|
|
@ -22,10 +22,6 @@ const defaultPersistent = {
|
||||||
useManualConnection: false,
|
useManualConnection: false,
|
||||||
clientId: '',
|
clientId: '',
|
||||||
clientSecret: '',
|
clientSecret: '',
|
||||||
flags: {
|
|
||||||
country: '',
|
|
||||||
currency: '',
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// Reducer logic.
|
// Reducer logic.
|
||||||
|
@ -42,11 +38,18 @@ const commonReducer = createReducer( defaultTransient, defaultPersistent, {
|
||||||
[ ACTION_TYPES.SET_PERSISTENT ]: ( state, action ) =>
|
[ ACTION_TYPES.SET_PERSISTENT ]: ( state, action ) =>
|
||||||
setPersistent( state, action ),
|
setPersistent( state, action ),
|
||||||
|
|
||||||
[ ACTION_TYPES.HYDRATE ]: ( state, payload ) =>
|
[ ACTION_TYPES.HYDRATE ]: ( state, payload ) => {
|
||||||
setPersistent( state, {
|
const newState = setPersistent( state, payload.data );
|
||||||
...payload.data,
|
|
||||||
flags: payload.flags,
|
if ( payload.wooSettings ) {
|
||||||
} ),
|
newState.wooSettings = {
|
||||||
|
...newState.wooSettings,
|
||||||
|
...payload.wooSettings,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
return newState;
|
||||||
|
},
|
||||||
} );
|
} );
|
||||||
|
|
||||||
export default commonReducer;
|
export default commonReducer;
|
||||||
|
|
|
@ -16,6 +16,10 @@ export const persistentData = ( state ) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
export const transientData = ( 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;
|
return transientState || EMPTY_OBJ;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const wooSettings = ( state ) => {
|
||||||
|
return getState( state ).wooSettings || EMPTY_OBJ;
|
||||||
|
};
|
||||||
|
|
|
@ -34,7 +34,7 @@ class CommonSettings extends AbstractDataModel {
|
||||||
*
|
*
|
||||||
* @var array
|
* @var array
|
||||||
*/
|
*/
|
||||||
protected array $flags = array();
|
protected array $woo_settings = array();
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Constructor.
|
* Constructor.
|
||||||
|
@ -44,8 +44,8 @@ class CommonSettings extends AbstractDataModel {
|
||||||
*/
|
*/
|
||||||
public function __construct( string $country, string $currency ) {
|
public function __construct( string $country, string $currency ) {
|
||||||
parent::__construct();
|
parent::__construct();
|
||||||
$this->flags['country'] = $country;
|
$this->woo_settings['country'] = $country;
|
||||||
$this->flags['currency'] = $currency;
|
$this->woo_settings['currency'] = $currency;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -141,7 +141,7 @@ class CommonSettings extends AbstractDataModel {
|
||||||
*
|
*
|
||||||
* @return array
|
* @return array
|
||||||
*/
|
*/
|
||||||
public function get_flags() : array {
|
public function get_woo_settings() : array {
|
||||||
return $this->flags;
|
return $this->woo_settings;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -65,12 +65,12 @@ class CommonRestEndpoint extends RestEndpoint {
|
||||||
*
|
*
|
||||||
* @var array
|
* @var array
|
||||||
*/
|
*/
|
||||||
private array $flag_map = array(
|
private array $woo_settings_map = array(
|
||||||
'country' => array(
|
'country' => array(
|
||||||
'js_name' => 'country',
|
'js_name' => 'storeCountry',
|
||||||
),
|
),
|
||||||
'currency' => array(
|
'currency' => array(
|
||||||
'js_name' => 'currency',
|
'js_name' => 'storeCurrency',
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -123,15 +123,15 @@ class CommonRestEndpoint extends RestEndpoint {
|
||||||
$this->field_map
|
$this->field_map
|
||||||
);
|
);
|
||||||
|
|
||||||
$js_flags = $this->sanitize_for_javascript(
|
$js_woo_settings = $this->sanitize_for_javascript(
|
||||||
$this->settings->get_flags(),
|
$this->settings->get_woo_settings(),
|
||||||
$this->flag_map
|
$this->woo_settings_map
|
||||||
);
|
);
|
||||||
|
|
||||||
return $this->return_success(
|
return $this->return_success(
|
||||||
$js_data,
|
$js_data,
|
||||||
array(
|
array(
|
||||||
'flags' => $js_flags,
|
'wooSettings' => $js_woo_settings,
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue