| 1 |
/** |
| 2 |
* Shared editor for MailChimp / MailPoet / Campaign Monitor Subscribe blocks. |
| 3 |
* Each block passes `config` (bridgeKey, list/hide/defaultChecked attrs, labels). |
| 4 |
* Empty `lists` → notice; single-select list id matches legacy. |
| 5 |
*/ |
| 6 |
import { __ } from '@wordpress/i18n'; |
| 7 |
import { PanelBody, SelectControl, ToggleControl, Notice, ExternalLink } from '@wordpress/components'; |
| 8 |
import BaseFieldEdit from './BaseFieldEdit'; |
| 9 |
|
| 10 |
export default function SubscribeFieldEdit( props ) { |
| 11 |
const { config, ...blockProps } = props; |
| 12 |
const { attributes, setAttributes } = props; |
| 13 |
|
| 14 |
const fb = ( typeof window !== 'undefined' && window.wppbFb ) || {}; |
| 15 |
const bridge = ( config && fb[ config.bridgeKey ] ) || {}; |
| 16 |
const lists = Array.isArray( bridge.lists ) ? bridge.lists : []; |
| 17 |
const settingsUrl = bridge.settingsUrl || ''; |
| 18 |
|
| 19 |
const setYesNo = ( attr, on ) => setAttributes( { [ attr ]: on ? 'yes' : '' } ); |
| 20 |
|
| 21 |
const panel = ( |
| 22 |
<PanelBody title={ `${ config.serviceLabel } ${ __( 'Settings', 'profile-builder' ) }` }> |
| 23 |
{ lists.length > 0 ? ( |
| 24 |
<SelectControl |
| 25 |
label={ config.listLabel } |
| 26 |
value={ attributes[ config.listAttr ] || '' } |
| 27 |
options={ [ |
| 28 |
{ value: '', label: __( 'Select a list…', 'profile-builder' ) }, |
| 29 |
...lists, |
| 30 |
] } |
| 31 |
onChange={ ( val ) => setAttributes( { [ config.listAttr ]: val } ) } |
| 32 |
help={ __( 'The list new subscribers are added to.', 'profile-builder' ) } |
| 33 |
/> |
| 34 |
) : ( |
| 35 |
<Notice status="warning" isDismissible={ false }> |
| 36 |
{ __( 'No lists available — configure the integration in its settings page, then reopen this form.', 'profile-builder' ) } |
| 37 |
{ settingsUrl && ' ' } |
| 38 |
{ settingsUrl && ( |
| 39 |
<ExternalLink href={ settingsUrl }> |
| 40 |
{ `${ config.serviceLabel } ${ __( 'settings', 'profile-builder' ) }` } |
| 41 |
</ExternalLink> |
| 42 |
) } |
| 43 |
</Notice> |
| 44 |
) } |
| 45 |
|
| 46 |
{ config.defaultCheckedAttr && ( |
| 47 |
<ToggleControl |
| 48 |
label={ __( 'Checked by default (register forms)', 'profile-builder' ) } |
| 49 |
checked={ attributes[ config.defaultCheckedAttr ] === 'yes' } |
| 50 |
onChange={ ( on ) => setYesNo( config.defaultCheckedAttr, on ) } |
| 51 |
help={ __( 'Pre-check the subscribe box on registration forms.', 'profile-builder' ) } |
| 52 |
/> |
| 53 |
) } |
| 54 |
<ToggleControl |
| 55 |
label={ __( 'Hide on Edit Profile forms', 'profile-builder' ) } |
| 56 |
checked={ attributes[ config.hideFieldAttr ] === 'yes' } |
| 57 |
onChange={ ( on ) => setYesNo( config.hideFieldAttr, on ) } |
| 58 |
/> |
| 59 |
</PanelBody> |
| 60 |
); |
| 61 |
|
| 62 |
return ( |
| 63 |
<BaseFieldEdit { ...blockProps } inspectorPanels={ panel } hideDescription> |
| 64 |
<label style={ { display: 'flex', alignItems: 'center', gap: '6px' } }> |
| 65 |
<input |
| 66 |
type="checkbox" |
| 67 |
disabled |
| 68 |
readOnly |
| 69 |
checked={ !! config.defaultCheckedAttr && attributes[ config.defaultCheckedAttr ] === 'yes' } |
| 70 |
/> |
| 71 |
<span>{ attributes[ 'field-title' ] }</span> |
| 72 |
</label> |
| 73 |
</BaseFieldEdit> |
| 74 |
); |
| 75 |
} |
| 76 |
|
