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

Edit Site: Update template navigation to use new link control. #20366

Merged

Conversation

@epiqueras
Copy link
Contributor

epiqueras commented Feb 21, 2020

Description

#19141 was merged with a feature to navigate to the template that an internal link will use to render its front end, using the URLPopover.

The URLPopover has since been replaced with the LinkControl. This PR moves the slot/fill extension introduced by #19141 to the new LinkControl component.

How has this been tested?

It was verified that the feature works as expected with the new LinkControl.

Screenshots

image

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR.
@github-actions

This comment has been minimized.

Copy link

github-actions bot commented Feb 21, 2020

Size Change: +41 B (0%)

Total Size: 864 kB

Filename Size Change
build/block-editor/index.js 104 kB +19 B (0%)
build/edit-site/index.js 4.61 kB +22 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1 kB 0 B
build/annotations/index.js 3.43 kB 0 B
build/api-fetch/index.js 3.39 kB 0 B
build/autop/index.js 2.58 kB 0 B
build/blob/index.js 620 B 0 B
build/block-directory/index.js 6.02 kB 0 B
build/block-directory/style-rtl.css 760 B 0 B
build/block-directory/style.css 760 B 0 B
build/block-editor/style-rtl.css 10.3 kB 0 B
build/block-editor/style.css 10.3 kB 0 B
build/block-library/editor-rtl.css 7.67 kB 0 B
build/block-library/editor.css 7.67 kB 0 B
build/block-library/index.js 116 kB 0 B
build/block-library/style-rtl.css 7.49 kB 0 B
build/block-library/style.css 7.49 kB 0 B
build/block-library/theme-rtl.css 669 B 0 B
build/block-library/theme.css 671 B 0 B
build/block-serialization-default-parser/index.js 1.65 kB 0 B
build/block-serialization-spec-parser/index.js 3.1 kB 0 B
build/blocks/index.js 57.6 kB 0 B
build/components/index.js 190 kB 0 B
build/components/style-rtl.css 15.5 kB 0 B
build/components/style.css 15.5 kB 0 B
build/compose/index.js 5.76 kB 0 B
build/core-data/index.js 10.5 kB 0 B
build/data-controls/index.js 1.03 kB 0 B
build/data/index.js 8.22 kB 0 B
build/date/index.js 5.37 kB 0 B
build/deprecated/index.js 772 B 0 B
build/dom-ready/index.js 568 B 0 B
build/dom/index.js 3.06 kB 0 B
build/edit-post/index.js 90.9 kB 0 B
build/edit-post/style-rtl.css 8.59 kB 0 B
build/edit-post/style.css 8.58 kB 0 B
build/edit-site/style-rtl.css 2.77 kB 0 B
build/edit-site/style.css 2.76 kB 0 B
build/edit-widgets/index.js 4.43 kB 0 B
build/edit-widgets/style-rtl.css 2.59 kB 0 B
build/edit-widgets/style.css 2.58 kB 0 B
build/editor/editor-styles-rtl.css 325 B 0 B
build/editor/editor-styles.css 327 B 0 B
build/editor/index.js 44.6 kB 0 B
build/editor/style-rtl.css 4.01 kB 0 B
build/editor/style.css 4 kB 0 B
build/element/index.js 4.45 kB 0 B
build/escape-html/index.js 733 B 0 B
build/format-library/index.js 7.6 kB 0 B
build/format-library/style-rtl.css 502 B 0 B
build/format-library/style.css 502 B 0 B
build/hooks/index.js 1.92 kB 0 B
build/html-entities/index.js 622 B 0 B
build/i18n/index.js 3.45 kB 0 B
build/is-shallow-equal/index.js 710 B 0 B
build/keyboard-shortcuts/index.js 2.3 kB 0 B
build/keycodes/index.js 1.68 kB 0 B
build/list-reusable-blocks/index.js 2.99 kB 0 B
build/list-reusable-blocks/style-rtl.css 226 B 0 B
build/list-reusable-blocks/style.css 226 B 0 B
build/media-utils/index.js 4.85 kB 0 B
build/notices/index.js 1.57 kB 0 B
build/nux/index.js 3.02 kB 0 B
build/nux/style-rtl.css 616 B 0 B
build/nux/style.css 613 B 0 B
build/plugins/index.js 2.54 kB 0 B
build/primitives/index.js 1.49 kB 0 B
build/priority-queue/index.js 879 B 0 B
build/redux-routine/index.js 2.84 kB 0 B
build/rich-text/index.js 14.3 kB 0 B
build/server-side-render/index.js 2.54 kB 0 B
build/shortcode/index.js 1.7 kB 0 B
build/token-list/index.js 1.27 kB 0 B
build/url/index.js 4 kB 0 B
build/viewport/index.js 1.61 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.18 kB 0 B

compressed-size-action

@shaunandrews

This comment has been minimized.

Copy link
Contributor

shaunandrews commented Feb 21, 2020

Whats the use-case in which I'd want to edit a Template from within the context of the link editor?

@epiqueras

This comment has been minimized.

Copy link
Contributor Author

epiqueras commented Feb 21, 2020

That's not what this is doing.

#19204 (comment)

Copy link
Contributor

Addison-Stavlo left a comment

This is cool!

So I can go to the Site Editor and edit a template-part. From here I can add a link to the front-page template (link defined to /), and then navigate to that template in the site editor via that link. Fantastic! 🎉

What I am having issues with is creating a second template (call it 'second-page') in here and adding a link to that second template (link defined to lead to /second-page ?):

  1. It seems to go to the front-page template either way,
  2. and that second template does not seem to persist in the Site Editor's list of templates when I go back into the Site Editor later (although it did get added to the list of 'templates' in the 'appearance' section).

Are these behaviors expected at this point and/or represent future work to be done in follow ups?

@epiqueras

This comment has been minimized.

Copy link
Contributor Author

epiqueras commented Feb 24, 2020

It seems to go to the front-page template either way,

second-page is not in the template hierarchy. These links go to the template the linked URL would render in.

and that second template does not seem to persist in the Site Editor's list of templates when I go back into the Site Editor later (although it did get added to the list of 'templates' in the 'appearance' section).

It needs to be published to be part of the hierarchy.

@Addison-Stavlo

This comment has been minimized.

Copy link
Contributor

Addison-Stavlo commented Feb 24, 2020

Thanks for the info!

It needs to be published to be part of the hierarchy.

If I go to "Appearance" -> "Templates" (or similarly "Template Parts"), there are Templates / Template Parts that are listed as "Published" that do not appear in the selection dropdown in the Top-Left of the site editor. Is there something else I need to do for them to be "published" where the Site Editor is concerned?

These links go to the template the linked URL would render in.

I am struggling to find how to set up a second page to render another template in for the sake of testing this nifty template navigation even further. Do you happen to have any other info on this? I just got done going through the most recent gutenbrerg times demo with no luck, is there anything else that may highlight this?

@epiqueras

This comment has been minimized.

Copy link
Contributor Author

epiqueras commented Feb 24, 2020

If I go to "Appearance" -> "Templates" (or similarly "Template Parts"), there are Templates / Template Parts that are listed as "Published" that do not appear in the selection dropdown in the Top-Left of the site editor. Is there something else I need to do for them to be "published" where the Site Editor is concerned?

They need to be part of the resolved hierarchy somehow.

I am struggling to find how to set up a second page to render another template in for the sake of testing this nifty template navigation even further. Do you happen to have any other info on this? I just got done going through the most recent gutenbrerg times demo with no luck, is there anything else that may highlight this?

Make a single template and link to a single post.

@Addison-Stavlo

This comment has been minimized.

Copy link
Contributor

Addison-Stavlo commented Feb 25, 2020

Make a single template

So I made a single.html template in the demo-block-templates folder, and now 'single' shows up in the site editor's template list.

and link to a single post.

added a link in the header to /?p=1. The slotfill for 'Edit Page Template' does not appear. However, on the front-end /?p=1 does properly load using the single.html template. 🤔

@epiqueras

This comment has been minimized.

Copy link
Contributor Author

epiqueras commented Feb 25, 2020

There was a bug with URLs with query strings. I just fixed it, and it works well now.

Thanks for catching it!

import { pencil } from '@wordpress/icons';
import { createSlotFill, ExternalLink, Button } from '@wordpress/components';
import { ExternalLink, Button } from '@wordpress/components';
import { safeDecodeURI, filterURLForDisplay } from '@wordpress/url';
import { useMemo } from '@wordpress/element';

const { Slot, Fill } = createSlotFill( 'BlockEditorURLPopoverLinkViewer' );
Comment on lines -10 to -15

This comment has been minimized.

Copy link
@Addison-Stavlo

Addison-Stavlo Feb 25, 2020

Contributor

If the URLPopover has been replaced, why do we need to make changes to this file?

Could there be any cases where this is still used where removing this slot may cause issues?

This comment has been minimized.

Copy link
@epiqueras

epiqueras Feb 25, 2020

Author Contributor

This was only added for this, so I am reverting it here before anyone gets a chance to use it.

@Addison-Stavlo

This comment has been minimized.

Copy link
Contributor

Addison-Stavlo commented Feb 25, 2020

This is working great!

I am about ready to approve, but just have the question about about the link-viewer file above.

@epiqueras

This comment has been minimized.

Copy link
Contributor Author

epiqueras commented Feb 25, 2020

Answered 😄

Copy link
Contributor

Addison-Stavlo left a comment

This works great and is a really awesome feature to have working in the Site Editor!

Thanks for all your effort 😄

@epiqueras epiqueras force-pushed the update/edit-site-template-navigation-to-use-new-link-control branch from 59cdd3e to 5432e83 Feb 25, 2020
@epiqueras epiqueras merged commit d285534 into master Feb 25, 2020
3 checks passed
3 checks passed
build
Details
pull-request-automation
Details
Travis CI - Pull Request Build Passed
Details
@epiqueras epiqueras added this to Done in Phase 2 via automation Feb 25, 2020
@epiqueras epiqueras deleted the update/edit-site-template-navigation-to-use-new-link-control branch Feb 25, 2020
@github-actions github-actions bot added this to the Gutenberg 7.7 milestone Feb 25, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Phase 2
  
Done
Linked issues

Successfully merging this pull request may close these issues.

None yet

3 participants
You can’t perform that action at this time.