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

use component instead of function

Browse source
This commit is contained in:
carmenmaymo 2025-01-13 15:21:55 +01:00
parent c2c4347ce2
commit f004be97ff
No known key found for this signature in database
GPG key ID: 6023F686B0F3102E
1 changed files with 24 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

52
modules/ppcp-settings/resources/js/Components/ReusableComponents/ConnectionInfo.js
View file

@ -5,35 +5,31 @@ const ConnectionInfo = () => {
const { merchant } = CommonHooks.useMerchantInfo(); const { merchant } = CommonHooks.useMerchantInfo();
return ( return (
<div className="ppcp-r-connection-status__data"> <div className="ppcp-r-connection-status__data">
{renderStatusRow( <StatusRow
__('Merchant ID', 'woocommerce-paypal-payments'), label={ __( 'Merchant ID', 'woocommerce-paypal-payments' ) }
connectionData.merchantId value={ merchant.id }
)} />
{renderStatusRow( <StatusRow
__('Email address', 'woocommerce-paypal-payments'), label={ __( 'Email address', 'woocommerce-paypal-payments' ) }
connectionData.email value={ merchant.email }
)} />
{renderStatusRow( <StatusRow
__('Client ID', 'woocommerce-paypal-payments'), label={ __( 'Client ID', 'woocommerce-paypal-payments' ) }
connectionData.clientId value={ merchant.clientId }
)} />
</div> </div>
); );
}; };
export default ConnectionInfo; export default ConnectionInfo;
return { const StatusRow = ( { label, value } ) => (
connectionStatus: merchant.isConnected || false, <div className="ppcp-r-connection-status__status-row">
email: merchant.email || '', <span className="ppcp-r-connection-status__status-label">
merchantId: merchant.id || '', { label }
clientId: merchant.clientId || '', </span>
}; <span className="ppcp-r-connection-status__status-value">
}; { value }
</span>
const renderStatusRow = (label, value) => ( </div>
<div className="ppcp-r-connection-status__status-row">
<span className="ppcp-r-connection-status__status-label">{label}</span>
<span className="ppcp-r-connection-status__status-value">{value}</span>
</div>
); );