Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add reference widgets to legacy widget blocks. Use ajax admin endpoint on this blocks. #15801

Merged
merged 4 commits into from
Nov 11, 2019
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Minor code "style" fixes
  • Loading branch information
jorgefilipecosta committed Nov 11, 2019
commit e1e48acf68bbefecc2bb76edd625db6cf287c2d9
6 changes: 3 additions & 3 deletions lib/class-experimental-wp-widget-blocks-manager.php
Original file line number Diff line number Diff line change
Expand Up @@ -126,8 +126,8 @@ public static function get_sidebar_as_blocks( $sidebar_id ) {
$new_block = array(
'blockName' => 'core/legacy-widget',
'attrs' => array(
'widgetId' => $item,
'instance' => self::get_sidebar_widget_instance( $wp_registered_sidebars[ $sidebar_id ], $item ),
'id' => $item,
'instance' => self::get_sidebar_widget_instance( $wp_registered_sidebars[ $sidebar_id ], $item ),
),
'innerHTML' => '',
);
Expand All @@ -138,7 +138,7 @@ public static function get_sidebar_as_blocks( $sidebar_id ) {
$new_block['attrs']['idBase'] = $object->id_base;
}
if ( is_int( $number ) ) {
$new_block['attrs']['widgetNumber'] = $number;
$new_block['attrs']['number'] = $number;
}
$blocks[] = $new_block;
}
Expand Down
2 changes: 1 addition & 1 deletion lib/class-wp-rest-widget-forms.php
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ public function compute_new_widget_permissions_check() {
* @return boolean| True if the widget being referenced exists and false otherwise.
*/
private function is_valid_widget( $widget_class ) {
global $wp_widget_factory, $wp_registered_widgets;
global $wp_widget_factory;
if ( ! $widget_class ) {
return false;
}
Expand Down
21 changes: 12 additions & 9 deletions packages/block-library/src/legacy-widget/edit/dom-manager.js
Original file line number Diff line number Diff line change
Expand Up @@ -36,8 +36,8 @@ class LegacyWidgetEditDomManager extends Component {
this.idBaseInputRef.current.value = nextProps.idBase;
shouldTriggerWidgetUpdateEvent = true;
}
if ( nextProps.widgetNumber !== this.props.widgetNumber && this.widgetNumberInputRef.current ) {
this.widgetNumberInputRef.current.value = nextProps.widgetNumber;
if ( nextProps.number !== this.props.number && this.widgetNumberInputRef.current ) {
this.widgetNumberInputRef.current.value = nextProps.number;
}
if ( nextProps.form !== this.props.form && this.widgetContentRef.current ) {
const widgetContent = this.widgetContentRef.current;
Expand All @@ -54,7 +54,7 @@ class LegacyWidgetEditDomManager extends Component {
}

render() {
const { id, idBase, widgetNumber, form, isReferenceWidget } = this.props;
const { id, idBase, number, form, isReferenceWidget } = this.props;
return (
<div className="widget open" ref={ this.containerRef }>
<div className="widget-inside">
Expand All @@ -79,12 +79,15 @@ class LegacyWidgetEditDomManager extends Component {
className="widget-content"
dangerouslySetInnerHTML={ { __html: form } }
/>
{ isReferenceWidget && ( <><input type="hidden" name="widget-id" className="widget-id" value={ id } />
<input ref={ this.idBaseInputRef } type="hidden" name="id_base" className="id_base" value={ idBase } />
<input ref={ this.widgetNumberInputRef } type="hidden" name="widget_number" className="widget_number" value={ widgetNumber } />
<input type="hidden" name="multi_number" className="multi_number" value="" />
<input type="hidden" name="add_new" className="add_new" value="" />
</> ) }
{ isReferenceWidget && (
<>
<input type="hidden" name="widget-id" className="widget-id" value={ id } />
<input ref={ this.idBaseInputRef } type="hidden" name="id_base" className="id_base" value={ idBase } />
<input ref={ this.widgetNumberInputRef } type="hidden" name="widget_number" className="widget_number" value={ number } />
<input type="hidden" name="multi_number" className="multi_number" value="" />
<input type="hidden" name="add_new" className="add_new" value="" />
</>
) }
</form>
</div>
</div>
Expand Down
26 changes: 12 additions & 14 deletions packages/block-library/src/legacy-widget/edit/handler.js
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ class LegacyWidgetEditHandler extends Component {
}

render() {
const { instanceId, widgetId, widgetNumber, idBase, instance, isSelected, widgetName } = this.props;
const { instanceId, id, number, idBase, instance, isSelected, widgetName } = this.props;
const { form } = this.state;

if ( ! form ) {
Expand Down Expand Up @@ -96,16 +96,15 @@ class LegacyWidgetEditHandler extends Component {
>

<LegacyWidgetEditDomManager
isReferenceWidget={ !! widgetId }
isReferenceWidget={ !! id }
ref={ ( ref ) => {
this.widgetEditDomManagerRef = ref;
} }
onInstanceChange={ this.onInstanceChange }
widgetNumber={ widgetNumber ? widgetNumber : instanceId * -1 }
id={ widgetId }
number={ number ? number : instanceId * -1 }
id={ id }
idBase={ idBase }
form={ form }
widgetId={ widgetId }
/>
</div>
</>
Expand All @@ -120,8 +119,8 @@ class LegacyWidgetEditHandler extends Component {
}

onInstanceChange( instanceChanges ) {
const { widgetId } = this.props;
if ( widgetId ) {
const { id } = this.props;
if ( id ) {
// For reference widgets there is no need to query an endpoint,
// the widget is already saved with ajax.
this.props.onInstanceChange( instanceChanges, true );
Expand All @@ -134,29 +133,28 @@ class LegacyWidgetEditHandler extends Component {
}

requestWidgetUpdater( instanceChanges, callback ) {
const { widgetId, idBase, instance, widgetClass } = this.props;
const { id, idBase, instance, widgetClass } = this.props;
const { isStillMounted } = this;
if ( ! widgetId && ! widgetClass ) {
if ( ! id && ! widgetClass ) {
return;
}

// If we are in the presence of a reference widget, do a save ajax request
// with empty changes so we retrieve the widget edit form.
if ( widgetId ) {
if ( id ) {
const httpRequest = new XMLHttpRequest();
const formData = new FormData();
formData.append( 'action', 'save-widget' );
formData.append( 'id_base', idBase );
formData.append( 'widget-id', widgetId );
formData.append( 'widget-id', id );
formData.append( 'widget-width', '250' );
formData.append( 'widget-height', '200' );
formData.append( 'savewidgets', this.widgetNonce );
httpRequest.open( 'POST', window.ajaxurl );
const self = this;
httpRequest.addEventListener( 'load', function() {
httpRequest.addEventListener( 'load', () => {
if ( isStillMounted ) {
const form = httpRequest.responseText;
self.setState( { form } );
this.setState( { form } );
if ( callback ) {
callback( { form } );
}
Expand Down
17 changes: 8 additions & 9 deletions packages/block-library/src/legacy-widget/edit/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -48,21 +48,20 @@ class LegacyWidgetEdit extends Component {
setAttributes,
} = this.props;
const { isPreview, hasEditForm } = this.state;
const { widgetId, widgetClass } = attributes;
const { id, widgetClass } = attributes;
const widgetObject =
( widgetId && availableLegacyWidgets[ widgetId ] ) ||
( id && availableLegacyWidgets[ id ] ) ||
( widgetClass && availableLegacyWidgets[ widgetClass ] );
if ( ! widgetId && ! widgetClass ) {
if ( ! id && ! widgetClass ) {
return (
<LegacyWidgetPlaceholder
availableLegacyWidgets={ availableLegacyWidgets }
currentWidget={ widgetId }
hasPermissionsToManageWidgets={ hasPermissionsToManageWidgets }
onChangeWidget={ ( newWidget ) => {
const { isReferenceWidget } = availableLegacyWidgets[ newWidget ];
setAttributes( {
instance: {},
widgetId: isReferenceWidget ? newWidget : undefined,
id: isReferenceWidget ? newWidget : undefined,
widgetClass: isReferenceWidget ? undefined : newWidget,
} );
} }
Expand Down Expand Up @@ -120,9 +119,9 @@ class LegacyWidgetEdit extends Component {
<LegacyWidgetEditHandler
isSelected={ isSelected }
isVisible={ ! isPreview }
widgetId={ attributes.widgetId }
idBase={ attributes.idBase || attributes.widgetId }
widgetNumber={ attributes.widgetNumber }
id={ id }
idBase={ attributes.idBase || attributes.id }
number={ attributes.number }
widgetName={ get( widgetObject, [ 'name' ] ) }
widgetClass={ attributes.widgetClass }
instance={ attributes.instance }
Expand Down Expand Up @@ -151,7 +150,7 @@ class LegacyWidgetEdit extends Component {
this.switchToEdit();
this.props.setAttributes( {
instance: {},
widgetId: undefined,
id: undefined,
widgetClass: undefined,
} );
this.setState( {
Expand Down
20 changes: 10 additions & 10 deletions packages/block-library/src/legacy-widget/index.php
Original file line number Diff line number Diff line change
Expand Up @@ -72,17 +72,17 @@ function render_widget_by_id( $id ) {
* @return string Returns the post content with the legacy widget added.
*/
function render_block_legacy_widget( $attributes ) {
$widget_id = null;
$id = null;
$widget_class = null;
if ( isset( $attributes['widgetId'] ) ) {
$widget_id = $attributes['widgetId'];
if ( isset( $attributes['id'] ) ) {
$id = $attributes['id'];
}
if ( isset( $attributes['widgetClass'] ) ) {
$widget_class = $attributes['widgetClass'];
}

if ( $widget_id ) {
return render_widget_by_id( $widget_id );
if ( $id ) {
return render_widget_by_id( $id );
}
if ( ! $widget_class ) {
return '';
Expand All @@ -105,19 +105,19 @@ function register_block_core_legacy_widget() {
'core/legacy-widget',
array(
'attributes' => array(
'widgetClass' => array(
'widgetClass' => array(
'type' => 'string',
),
'widgetId' => array(
'id' => array(
'type' => 'string',
),
'idBase' => array(
'idBase' => array(
'type' => 'string',
),
'widgetNumber' => array(
'number' => array(
'type' => 'number',
),
'instance' => array(
'instance' => array(
'type' => 'object',
),
),
Expand Down