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

Adds the block hierarchy navigation menu to the header #10545

Merged
merged 32 commits into from Oct 17, 2018

Conversation

@youknowriad
Copy link
Contributor

@youknowriad youknowriad commented Oct 12, 2018

closes #9628 and closes #9212

This is still WIP, there are some things we need to polish before landing this:

  • The design is ready.
  • Add some unit tests for the new selectors and an e2e test for the navigation
  • Fix #9212 which is causing the inner blocks to be selected when we select the parent.

Doesn't mean we can't start testing and reviewing the PR though.

@youknowriad youknowriad self-assigned this Oct 12, 2018
@youknowriad youknowriad requested review from jasmussen and WordPress/gutenberg-core Oct 12, 2018
@gziolo gziolo changed the title Adds the block hierarchy navivation menu to the header Adds the block hierarchy navigation menu to the header Oct 12, 2018
@gziolo gziolo added this to the 4.1 milestone Oct 12, 2018
@mtias
Copy link
Contributor

@mtias mtias commented Oct 15, 2018

This is working quite well for me. Agreed on needing to fix #9212. We should also update the single column block icon.

@mtias
Copy link
Contributor

@mtias mtias commented Oct 15, 2018

Currently:

image

@youknowriad youknowriad force-pushed the add/block-hierarchy-navigation-menu branch from bad4436 to 810b214 Oct 15, 2018
@youknowriad
Copy link
Contributor Author

@youknowriad youknowriad commented Oct 15, 2018

I fixed the selection bug, I added some tests. The technical pieces should be ready. We might want to do some design tweaks now (cc @jasmussen ) before landing.

@youknowriad
Copy link
Contributor Author

@youknowriad youknowriad commented Oct 15, 2018

Oh I think @jasmussen is AFK this week (sorry for the pings), I'll see what we can do here :).

@youknowriad youknowriad force-pushed the add/block-hierarchy-navigation-menu branch from 14b9418 to 5779576 Oct 15, 2018
@youknowriad
Copy link
Contributor Author

@youknowriad youknowriad commented Oct 15, 2018

I tried tweaking the design as much as I can. Let me know how I should polish it further. and yes, this is ready for a final review.

@youknowriad youknowriad removed the request for review from WordPress/gutenberg-core Oct 15, 2018
…cks exist
@tofumatt
Copy link
Member

@tofumatt tofumatt commented Oct 17, 2018

The only thing to note here is NVDA reads out "Block Navigation Block Navigation menu" when this is opened. I wonder if the label prop on MenuGroup is repeating the label somehow?

That is a bug but we can tweak it after we merge this (which we should do for UI freeze). Once this is merged either file a follow-up issue and ping me or I'll do it 😄

Copy link
Member

@tofumatt tofumatt left a comment

Changed the shortcut to "o" (see: https://wordpress.slack.com/archives/C02QB2JS7/p1539717395000100) and tweaked the tests. This gets the 👍 from me.

@afercia
Copy link
Contributor

@afercia afercia commented Oct 17, 2018

Shortcuts: for future reference, worth nothing on the new WAI-ARIA Authoring Practices 1.1 (still not an official WCAG recommendation) there's a pretty good section dedicated to keyboard shortcuts. It's more about what not to do: https://www.w3.org/TR/wai-aria-practices-1.1/#kbd_shortcuts_assigning

@youknowriad youknowriad force-pushed the add/block-hierarchy-navigation-menu branch from 5c37bce to 45b7686 Oct 17, 2018
@youknowriad youknowriad merged commit e1cc1b2 into master Oct 17, 2018
2 checks passed
2 checks passed
codecov/project 49.48% (-0.02%) compared to 3eaf799
Details
continuous-integration/travis-ci/pr The Travis CI build passed
Details
@youknowriad youknowriad deleted the add/block-hierarchy-navigation-menu branch Oct 17, 2018
@talldan
Copy link
Contributor

@talldan talldan commented Oct 17, 2018

I've also made a PR updating the docs with that new keyboard shortcut, would be great if someone could approve:
#10677

@talldan
Copy link
Contributor

@talldan talldan commented Oct 17, 2018

One other thing, I noticed this when testing the new menu #10679. I don't think it's a massive issue, but it did cause some weirdness.

@simbalion
Copy link

@simbalion simbalion commented Oct 21, 2018

This is a good thing but it should include an 'explode blocks' toggle, if it doesn't already, which makes all the borders visible and adds padding between them.

@paaljoachim
Copy link
Contributor

@paaljoachim paaljoachim commented Oct 22, 2018

I am testing 4.1 RC2
I am not totally read up on how this works but I noticed the above wireframe with the icon beside Content Structure. Opening..
screen shot 2018-10-22 at 17 09 31

I see it is a way to move around in the document. I also expected to be able to move the items directly in the list. Instead of having to go to the document and move items there.

@tofumatt
Copy link
Member

@tofumatt tofumatt commented Oct 22, 2018

@simbalion and @paaljoachim: Interesting ideas about expectations from these features. I actually think they'd go together; an outline of the selected block would be a great addition. And then a mover would make sense because you could see what you're moving.

Not sure about the mover but the outline I'd definitely 👍 as an idea. Could you both file new issues for the features you'd like? This PR is merged so it's not the best place to discuss additional features, but new issues would be great. Thanks!

@simbalion
Copy link

@simbalion simbalion commented Oct 22, 2018

@tofumatt Moving blocks would work presumably the same as it normally does, the only difference would be the visibility of each block's borders, and the padding between them. Blocks could be quickly and visibly arranged, and then the 'explode' status could be toggled off to return to WYSIWYG editing. It should still be possible to edit blocks as normal in the exploded state.

@paaljoachim
Copy link
Contributor

@paaljoachim paaljoachim commented Oct 23, 2018

It seems this issue: #7115 with Insert Summary feature is somewhat similar to the Block Navigation.

(EDIT)
This also seems related "Drag & drop reordering of "chapters" in the Table of Contents": #5301

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment