2024-12-08 09:33:49 +01:00
|
|
|
import { ToggleControl } from '@wordpress/components';
|
2025-01-21 18:57:36 +01:00
|
|
|
|
|
|
|
import SettingsBlock from '../SettingsBlock';
|
2024-12-08 09:33:49 +01:00
|
|
|
import PaymentMethodIcon from '../PaymentMethodIcon';
|
|
|
|
import data from '../../../utils/data';
|
2025-01-21 18:57:36 +01:00
|
|
|
|
2025-01-02 13:55:32 +01:00
|
|
|
const PaymentMethodItemBlock = ( {
|
2025-01-22 12:09:21 +01:00
|
|
|
paymentMethod,
|
2025-01-02 13:55:32 +01:00
|
|
|
onTriggerModal,
|
|
|
|
onSelect,
|
|
|
|
isSelected,
|
|
|
|
} ) => {
|
2024-12-08 09:33:49 +01:00
|
|
|
return (
|
2025-01-24 17:01:03 +01:00
|
|
|
<SettingsBlock className="ppcp--method-item" separatorAndGap={ false }>
|
|
|
|
<div className="ppcp--method-inner">
|
|
|
|
<div className="ppcp--method-title-wrapper">
|
2025-01-22 12:09:21 +01:00
|
|
|
<PaymentMethodIcon
|
|
|
|
icons={ [ paymentMethod.icon ] }
|
|
|
|
type={ paymentMethod.icon }
|
|
|
|
/>
|
2025-01-24 17:01:03 +01:00
|
|
|
<span className="ppcp--method-title">
|
2025-01-22 12:09:21 +01:00
|
|
|
{ paymentMethod.itemTitle }
|
2025-01-02 13:55:32 +01:00
|
|
|
</span>
|
2024-12-16 16:00:27 +01:00
|
|
|
</div>
|
2025-01-24 17:01:03 +01:00
|
|
|
<p className="ppcp--method-description">
|
2025-01-22 12:09:21 +01:00
|
|
|
{ paymentMethod.itemDescription }
|
2025-01-02 13:55:32 +01:00
|
|
|
</p>
|
2025-01-24 17:01:03 +01:00
|
|
|
<div className="ppcp--method-footer">
|
2025-01-02 13:55:32 +01:00
|
|
|
<ToggleControl
|
|
|
|
__nextHasNoMarginBottom={ true }
|
|
|
|
checked={ isSelected }
|
|
|
|
onChange={ onSelect }
|
|
|
|
/>
|
2025-01-22 12:09:21 +01:00
|
|
|
{ paymentMethod?.fields && onTriggerModal && (
|
2025-01-02 13:55:32 +01:00
|
|
|
<div
|
2025-01-24 17:01:03 +01:00
|
|
|
className="ppcp--method-settings"
|
2025-01-02 13:55:32 +01:00
|
|
|
onClick={ onTriggerModal }
|
|
|
|
>
|
|
|
|
{ data().getImage( 'icon-settings.svg' ) }
|
|
|
|
</div>
|
|
|
|
) }
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</SettingsBlock>
|
2024-12-08 09:33:49 +01:00
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default PaymentMethodItemBlock;
|