Merge pull request #3029 from woocommerce/PCP-4135-fix-js-error-button-is-not-defined

Fix JS error "Button is not defined" (4135)
This commit is contained in:
Emili Castells 2025-01-28 13:40:24 +01:00 committed by GitHub
commit 5b212879d5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 16 additions and 13 deletions

View file

@ -5,7 +5,7 @@ const ControlToggleButton = ( { label, description, value, onChange } ) => (
<Action>
<ToggleControl
className="ppcp--control-toggle"
__nextHasNoMarginBottom={ true }
__nextHasNoMarginBottom
checked={ value }
onChange={ onChange }
label={ label }

View file

@ -1,4 +1,5 @@
import { ToggleControl } from '@wordpress/components';
import { ToggleControl, Icon, Button } from '@wordpress/components';
import { cog } from '@wordpress/icons';
import SettingsBlock from '../SettingsBlock';
import PaymentMethodIcon from '../PaymentMethodIcon';
@ -13,12 +14,12 @@ const PaymentMethodItemBlock = ( {
<SettingsBlock className="ppcp--method-item" separatorAndGap={ false }>
<div className="ppcp--method-inner">
<div className="ppcp--method-title-wrapper">
{ paymentMethod?.icon && (
<PaymentMethodIcon
icons={ [ paymentMethod.icon ] }
type={ paymentMethod.icon }
/>
) }
{ paymentMethod?.icon && (
<PaymentMethodIcon
icons={ [ paymentMethod.icon ] }
type={ paymentMethod.icon }
/>
) }
<span className="ppcp--method-title">
{ paymentMethod.itemTitle }
</span>
@ -28,7 +29,7 @@ const PaymentMethodItemBlock = ( {
</p>
<div className="ppcp--method-footer">
<ToggleControl
__nextHasNoMarginBottom={ true }
__nextHasNoMarginBottom
checked={ isSelected }
onChange={ onSelect }
/>

View file

@ -43,6 +43,7 @@ const SettingsToggleBlock = ( {
</div>
<div className="ppcp-r-toggle-block__switch">
<ToggleControl
__nextHasNoMarginBottom
ref={ toggleRef }
checked={ isToggled }
onChange={ ( newState ) => setToggled( newState ) }

View file

@ -11,7 +11,7 @@ import PaymentMethodModal from '../../../../ReusableComponents/PaymentMethodModa
import { PaymentHooks } from '../../../../../data';
const Modal = ( { method, setModalIsVisible, onSave } ) => {
const { paymentMethods } = PaymentHooks.usePaymentMethods();
const { all: paymentMethods } = PaymentHooks.usePaymentMethods();
const {
paypalShowLogo,
threeDSecure,
@ -64,9 +64,9 @@ const Modal = ( { method, setModalIsVisible, onSave } ) => {
switch ( field.type ) {
case 'text':
return (
<div className="ppcp-r-modal__field-row">
<div key={ key } className="ppcp-r-modal__field-row">
<TextControl
__nextHasNoMarginBottom={ true }
__nextHasNoMarginBottom
className="ppcp-r-vertical-text-control"
label={ field.label }
value={ settings[ key ] }
@ -82,8 +82,9 @@ const Modal = ( { method, setModalIsVisible, onSave } ) => {
case 'toggle':
return (
<div className="ppcp-r-modal__field-row">
<div key={ key } className="ppcp-r-modal__field-row">
<ToggleControl
__nextHasNoMarginBottom
label={ field.label }
checked={ settings[ key ] }
onChange={ ( value ) =>