Edit File by line

/* global wpforms_divi_builder, WPFormsRepeaterField */

[0] Fix | Delete

[1] Fix | Delete

import React, { Component } from 'react';

[2] Fix | Delete

import PropTypes from 'prop-types';

[3] Fix | Delete

[4] Fix | Delete

[5] Fix | Delete

/**

[6] Fix | Delete

* WPFormsSelector component.

[7] Fix | Delete

[8] Fix | Delete

* @since 1.6.3

[9] Fix | Delete

[10] Fix | Delete

class WPFormsSelector extends Component {

[11] Fix | Delete

[12] Fix | Delete

/**

[13] Fix | Delete

* Module slug.

[14] Fix | Delete

[15] Fix | Delete

* @since 1.6.3

[16] Fix | Delete

[17] Fix | Delete

* @type {string}

[18] Fix | Delete

[19] Fix | Delete

static slug = 'wpforms_selector';

[20] Fix | Delete

[21] Fix | Delete

/**

[22] Fix | Delete

* Constructor.

[23] Fix | Delete

[24] Fix | Delete

* @since 1.6.3

[25] Fix | Delete

[26] Fix | Delete

* @param {string} props List of properties.

[27] Fix | Delete

[28] Fix | Delete

constructor( props ) {

[29] Fix | Delete

[30] Fix | Delete

super( props );

[31] Fix | Delete

[32] Fix | Delete

this.state = {

[33] Fix | Delete

error: null,

[34] Fix | Delete

isLoading: true,

[35] Fix | Delete

form: null,

[36] Fix | Delete

};

[37] Fix | Delete

}

[38] Fix | Delete

[39] Fix | Delete

/**

[40] Fix | Delete

* Set types for properties.

[41] Fix | Delete

[42] Fix | Delete

* @since 1.6.3

[43] Fix | Delete

[44] Fix | Delete

* @returns {object} Properties type.

[45] Fix | Delete

[46] Fix | Delete

static get propTypes() {

[47] Fix | Delete

[48] Fix | Delete

return {

[49] Fix | Delete

form_id: PropTypes.number, // eslint-disable-line camelcase

[50] Fix | Delete

show_title: PropTypes.string, // eslint-disable-line camelcase

[51] Fix | Delete

show_desc: PropTypes.string, // eslint-disable-line camelcase

[52] Fix | Delete

};

[53] Fix | Delete

}

[54] Fix | Delete

[55] Fix | Delete

/**

[56] Fix | Delete

* Check if form settings was updated.

[57] Fix | Delete

[58] Fix | Delete

* @since 1.6.3

[59] Fix | Delete

[60] Fix | Delete

* @param {object} prevProps List of previous properties.

[61] Fix | Delete

[62] Fix | Delete

componentDidUpdate( prevProps ) {

[63] Fix | Delete

[64] Fix | Delete

if ( prevProps.form_id !== this.props.form_id || prevProps.show_title !== this.props.show_title || prevProps.show_desc !== this.props.show_desc ) {

[65] Fix | Delete

this.componentDidMount();

[66] Fix | Delete

}

[67] Fix | Delete

}

[68] Fix | Delete

[69] Fix | Delete

/**

[70] Fix | Delete

* Ajax request for form HTML.

[71] Fix | Delete

[72] Fix | Delete

* @since 1.6.3

[73] Fix | Delete

[74] Fix | Delete

componentDidMount() {

[75] Fix | Delete

[76] Fix | Delete

var formData = new FormData();

[77] Fix | Delete

[78] Fix | Delete

formData.append( 'nonce', wpforms_divi_builder.nonce );

[79] Fix | Delete

formData.append( 'action', 'wpforms_divi_preview' );

[80] Fix | Delete

formData.append( 'form_id', this.props.form_id );

[81] Fix | Delete

formData.append( 'show_title', this.props.show_title );

[82] Fix | Delete

formData.append( 'show_desc', this.props.show_desc );

[83] Fix | Delete

[84] Fix | Delete

fetch(

[85] Fix | Delete

wpforms_divi_builder.ajax_url,

[86] Fix | Delete

{

[87] Fix | Delete

method: 'POST',

[88] Fix | Delete

cache: 'no-cache',

[89] Fix | Delete

credentials: 'same-origin',

[90] Fix | Delete

headers: {

[91] Fix | Delete

'Content-Type': 'application/x-www-form-urlencoded',

[92] Fix | Delete

'Cache-Control': 'no-cache',

[93] Fix | Delete

[94] Fix | Delete

body: new URLSearchParams( formData ),

[95] Fix | Delete

[96] Fix | Delete

)

[97] Fix | Delete

.then( res => res.json() )

[98] Fix | Delete

.then(

[99] Fix | Delete

( result ) => {

[100] Fix | Delete

[101] Fix | Delete

this.setState( {

[102] Fix | Delete

isLoading: false,

[103] Fix | Delete

form: result.data,

[104] Fix | Delete

} );

[105] Fix | Delete

[106] Fix | Delete

( error ) => {

[107] Fix | Delete

[108] Fix | Delete

this.setState( {

[109] Fix | Delete

isLoading: false,

[110] Fix | Delete

error,

[111] Fix | Delete

} );

[112] Fix | Delete

[113] Fix | Delete

);

[114] Fix | Delete

}

[115] Fix | Delete

[116] Fix | Delete

/**

[117] Fix | Delete

* Render module view.

[118] Fix | Delete

[119] Fix | Delete

* @since 1.6.3

[120] Fix | Delete

[121] Fix | Delete

* @returns {JSX.Element} View for module.

[122] Fix | Delete

[123] Fix | Delete

render() {

[124] Fix | Delete

const { error, isLoaded, form } = this.state,

[125] Fix | Delete

wrapperClasses = isLoaded ? 'wpforms-divi-form-preview loading' : 'wpforms-divi-form-preview';

[126] Fix | Delete

[127] Fix | Delete

if ( typeof this.props.form_id === 'undefined' || this.props.form_id === '' ) {

[128] Fix | Delete

return (

[129] Fix | Delete

[130] Fix | Delete

[131] Fix | Delete

[132] Fix | Delete

{ <p dangerouslySetInnerHTML={ { __html: wpforms_divi_builder.block_empty_text } } /> }

[133] Fix | Delete

[134] Fix | Delete

<button type="button" onClick={

[135] Fix | Delete

() => {

[136] Fix | Delete

window.open( wpforms_divi_builder.get_started_url, '_blank' );

[137] Fix | Delete

}

[138] Fix | Delete

}

[139] Fix | Delete

[140] Fix | Delete

{ wpforms_divi_builder.get_started_text }

[141] Fix | Delete

</button>

[142] Fix | Delete

[143] Fix | Delete

[144] Fix | Delete

{ wpforms_divi_builder.help_text } 

[145] Fix | Delete

<a href={ wpforms_divi_builder.guide_url } onClick={

[146] Fix | Delete

() => {

[147] Fix | Delete

window.open( wpforms_divi_builder.guide_url, '_blank' );

[148] Fix | Delete

}

[149] Fix | Delete

}

[150] Fix | Delete

[151] Fix | Delete

{ wpforms_divi_builder.guide_text }.

[152] Fix | Delete

</a>

[153] Fix | Delete

</p>

[154] Fix | Delete

</div>

[155] Fix | Delete

);

[156] Fix | Delete

}

[157] Fix | Delete

[158] Fix | Delete

if ( error || ! form ) {

[159] Fix | Delete

return (

[160] Fix | Delete

[161] Fix | Delete

[162] Fix | Delete

</div>

[163] Fix | Delete

);

[164] Fix | Delete

}

[165] Fix | Delete

[166] Fix | Delete

return (

[167] Fix | Delete

[168] Fix | Delete

{ <div dangerouslySetInnerHTML={ { __html: form } } /> }

[169] Fix | Delete

</div>

[170] Fix | Delete

);

[171] Fix | Delete

}

[172] Fix | Delete

}

[173] Fix | Delete

[174] Fix | Delete

jQuery( window )

[175] Fix | Delete

[176] Fix | Delete

// Register custom modules.

[177] Fix | Delete

.on( 'et_builder_api_ready', ( event, API ) => {

[178] Fix | Delete

API.registerModules( [ WPFormsSelector ] );

[179] Fix | Delete

} )

[180] Fix | Delete

[181] Fix | Delete

// Re-initialize WPForms frontend.

[182] Fix | Delete

.on( 'wpformsDiviModuleDisplay', () => {

[183] Fix | Delete

window.wpforms.init();

[184] Fix | Delete

} );

[185] Fix | Delete

[186] Fix | Delete

jQuery( document )

[187] Fix | Delete

.on( 'wpformsReady', function() {

[188] Fix | Delete

const $ = jQuery;

[189] Fix | Delete

[190] Fix | Delete

// Make all the modern dropdowns disabled.

[191] Fix | Delete

$( '.choicesjs-select' ).each( function() {

[192] Fix | Delete

const $instance = $( this ).data( 'choicesjs' );

[193] Fix | Delete

[194] Fix | Delete

if ( $instance && typeof $instance.disable === 'function' ) {

[195] Fix | Delete

$instance.disable();

[196] Fix | Delete

}

[197] Fix | Delete

} );

[198] Fix | Delete

[199] Fix | Delete

// Init Repeater fields.

[200] Fix | Delete

WPFormsRepeaterField?.ready();

[201] Fix | Delete

} );

[202] Fix | Delete

[203] Fix | Delete