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.

Sign up for GitHub

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

Jump to bottom

Send post_id to the REST API in the ServerSideRender component within the Editor #9323

Merged
merged 8 commits into from
Sep 12, 2018
Merged

Send post_id to the REST API in the ServerSideRender component within the Editor #9323

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
dda93e9
Add custom URL query arguments to ServerSideRender
alexsanford Jul 28, 2018
954dcf7
Add wrapper to editor package for ServerSideRender
alexsanford Aug 24, 2018
996fa1f
Add README
alexsanford Aug 24, 2018
5ac43df
Update block library components to use ServerSideRender wrapper
alexsanford Aug 24, 2018
495b788
Simplify addition of urlQueryArgs
alexsanford Sep 7, 2018
7c8408f
Add more explanation to README
alexsanford Sep 7, 2018
2cd708c
Ensure we accept incoming urlQueryArgs rather than blindly overriding…
alexsanford Sep 7, 2018
0c8481c
Move editor ServerSideRender into components subdirectory
alexsanford Sep 7, 2018
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
2 changes: 1 addition & 1 deletion packages/block-library/src/archives/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
import { Fragment } from '@wordpress/element';
import {
PanelBody,
ServerSideRender,
ToggleControl,
Disabled,
} from '@wordpress/components';
Expand All @@ -17,6 +16,7 @@ import {
InspectorControls,
BlockAlignmentToolbar,
BlockControls,
ServerSideRender,
} from '@wordpress/editor';

export default function ArchivesEdit( { attributes, setAttributes } ) {
Expand Down
2 changes: 1 addition & 1 deletion packages/block-library/src/latest-comments/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@ import {
PanelBody,
RangeControl,
ToggleControl,
ServerSideRender,
} from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import {
InspectorControls,
BlockAlignmentToolbar,
BlockControls,
ServerSideRender,
} from '@wordpress/editor';

/**
Expand Down
7 changes: 4 additions & 3 deletions packages/components/src/server-side-render/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,10 +20,11 @@ import { addQueryArgs } from '@wordpress/url';
import Placeholder from '../placeholder';
import Spinner from '../spinner';

export function rendererPathWithAttributes( block, attributes = null ) {
export function rendererPath( block, attributes = null, urlQueryArgs = {} ) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Given this is an exported function, do we need to keep (or deprecate) the original rendererPathWithAttributes()?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Phrased another way: maybe we should keep the name as rendererPathWithAttributes(), and it simply supports a third urlQueryArgs argument.

Copy link
Member

@jorgefilipecosta jorgefilipecosta Sep 11, 2018 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @danielbachhuber, the function rendererPathWithAttributes is exported just for testing but is not exported outside of @wordpress/components as we only export the default export outside of the module (the component)

gutenberg/packages/components/src/index.js

Line 51 in 0c8481c

export { default as ServerSideRender } from './server-side-render';

No plugin could have used this function so even if we change the name I don't think deprecations are necessary.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, makes sense. Thanks for clarifying @jorgefilipecosta

return addQueryArgs( `/gutenberg/v1/block-renderer/${ block }`, {
context: 'edit',
...( null !== attributes ? { attributes } : {} ),
...urlQueryArgs,
} );
}

Expand Down Expand Up @@ -54,9 +55,9 @@ export class ServerSideRender extends Component {
if ( null !== this.state.response ) {
this.setState( { response: null } );
}
const { block, attributes = null } = props;
const { block, attributes = null, urlQueryArgs = {} } = props;

const path = rendererPathWithAttributes( block, attributes );
const path = rendererPath( block, attributes, urlQueryArgs );

return apiFetch( { path } )
.then( ( response ) => {
Expand Down
29 changes: 22 additions & 7 deletions packages/components/src/server-side-render/test/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import { rendererPathWithAttributes } from '../index';
import { rendererPath } from '../index';

describe( 'blockPathWithAttributes', function() {
describe( 'rendererPath', function() {
test( 'should return an base path for empty input', function() {
expect( rendererPathWithAttributes( 'core/test-block', null ) ).toBe( '/gutenberg/v1/block-renderer/core/test-block?context=edit' );
expect( rendererPathWithAttributes( 'core/test-block' ) ).toBe( '/gutenberg/v1/block-renderer/core/test-block?context=edit' );
expect( rendererPath( 'core/test-block', null ) ).toBe( '/gutenberg/v1/block-renderer/core/test-block?context=edit' );
expect( rendererPath( 'core/test-block' ) ).toBe( '/gutenberg/v1/block-renderer/core/test-block?context=edit' );
} );

test( 'should format basic url params ', function() {
expect(
rendererPathWithAttributes( 'core/test-block', {
rendererPath( 'core/test-block', {
stringArg: 'test',
nullArg: null,
emptyArg: '',
Expand All @@ -21,7 +21,7 @@ describe( 'blockPathWithAttributes', function() {

test( 'should format object params ', function() {
expect(
rendererPathWithAttributes( 'core/test-block', {
rendererPath( 'core/test-block', {
objectArg: {
stringProp: 'test',
numberProp: 123,
Expand All @@ -34,7 +34,7 @@ describe( 'blockPathWithAttributes', function() {

test( 'should format an array of objects', function() {
expect(
rendererPathWithAttributes( 'core/test-block', {
rendererPath( 'core/test-block', {
children: [
{
name: 'bobby',
Expand All @@ -52,4 +52,19 @@ describe( 'blockPathWithAttributes', function() {
'/gutenberg/v1/block-renderer/core/test-block?context=edit&attributes%5Bchildren%5D%5B0%5D%5Bname%5D=bobby&attributes%5Bchildren%5D%5B0%5D%5Bage%5D=12&attributes%5Bchildren%5D%5B0%5D%5Bsex%5D=M&attributes%5Bchildren%5D%5B1%5D%5Bname%5D=sally&attributes%5Bchildren%5D%5B1%5D%5Bage%5D=8&attributes%5Bchildren%5D%5B1%5D%5Bsex%5D=F',
);
} );

test( 'should include urlQueryArgs', function() {
expect(
rendererPath(
'core/test-block', {
stringArg: 'test',
},
{
id: 1234,
}
)
).toBe(
'/gutenberg/v1/block-renderer/core/test-block?context=edit&attributes%5BstringArg%5D=test&id=1234',
);
} );
} );
1 change: 1 addition & 0 deletions packages/editor/src/components/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ export { default as PanelColorSettings } from './panel-color-settings';
export { default as PlainText } from './plain-text';
export { default as RichText } from './rich-text';
export { default as RichTextProvider } from './rich-text/provider';
export { default as ServerSideRender } from './server-side-render';
export { default as MediaPlaceholder } from './media-placeholder';
export { default as MediaUpload } from './media-upload';
export { default as URLInput } from './url-input';
Expand Down
3 changes: 3 additions & 0 deletions packages/editor/src/components/server-side-render/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# ServerSideRender

This utility component is a wrapper for the generic ServerSideRender in `@wordpress/components`. It adds the `post_id` parameter to the `urlQueryArgs` prop of the wrapped component. Use this component to ensure that the global `$post` object is set up properly in the server-side `render_callback` when rendering within the editor.
18 changes: 18 additions & 0 deletions packages/editor/src/components/server-side-render/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
/**
* WordPress dependencies.
*/
import { ServerSideRender } from '@wordpress/components';
import { select } from '@wordpress/data';

export default function( { urlQueryArgs = {}, ...props } ) {
const { getCurrentPostId } = select( 'core/editor' );

urlQueryArgs = {
post_id: getCurrentPostId(),
...urlQueryArgs,
};

return (
<ServerSideRender urlQueryArgs={ urlQueryArgs } { ...props } />
);
}