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

Plugin sorting via priority property in registerPlugin #16384

Open
wants to merge 25 commits into
base: trunk
Choose a base branch
from

Conversation

ryanwelcher
Copy link
Contributor

@ryanwelcher ryanwelcher commented Jul 2, 2019

Description

As is stands now, there is no way to control the order of the items being rendered in Slots. This PR adds a new priority property to the settings object that is passed to registerPlugin. This property is optional and has a default value of 10. I chose 10 as that is the default priority for Hooks and familiar to most WordPress developers and so that we can move items ahead of the default position without using negative numbers.

The approach adds the priority property when the plugin is being registered and then uses sortBy to sort the plugins before they are rendered inside the <PluginArea /> component.

How has this been tested?

This has been tested locally and using the unit and e2e tests.

Types of changes

New feature (non-breaking change which adds functionality)

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.

@ryanwelcher
Copy link
Contributor Author

ryanwelcher commented Jul 2, 2019

This was broken out based on comments from @youknowriad on #13361

@ryanwelcher
Copy link
Contributor Author

@youknowriad have you had a chance to think on this any further? Happy to make any changes as needed.

@ryanwelcher ryanwelcher added the [Feature] Extensibility The ability to extend blocks or the editing experience label Aug 27, 2019
@ryanwelcher ryanwelcher force-pushed the try/slot-fill-priority branch 2 times, most recently from 31be67b to 247a1a2 Compare September 6, 2019 17:20
@paaljoachim
Copy link
Contributor

Adding in what @youknowriad mentioned during the core editor meeting on the 11th September:
"To be honest, I'm not entirely sold on this because it's very tied to the implementation of the Slot. (not a fully semantic API).
I don't have a better alternative at the moment.
I know @matias have some thoughts about that as well."

@ryanwelcher ryanwelcher changed the title SlotFill sorting with a priority property Plugin sorting via priority property in registerPlugin Oct 22, 2019
@ryanwelcher
Copy link
Contributor Author

ryanwelcher commented Oct 22, 2019

Based on comments in the last #core-editor meeting, I feel I need to better explain this PR. I have created a new issue #18064 to track the intent.

@mcsf commented:

It seems that priority and order are very visually focused, in stark contrast with how Gutenberg has tried to use SlotFill so far.

The items that would be affected by this change are very much visually based. They appear in a certain locations of the admin - ie. Menu Items and sidebar panels

In Gutenberg, we talk about advanced settings, inspector, etc., instead of the visual element sidebar. Coming back to priority, what does it mean for SlotFill as far as selective rendering goes? how is a sequence determined semantically? etc.Why does this matter? Well, the bridging of different platforms and environments under Gutenberg is an important factor. If a codebase needs to work transparently across Web and Mobile, for example, its semantics needs to be clear and independent of a particular visual expression (e.g. Web on Desktop)

I want to make it clear, that this PR does not affect how a SlotFill is rendered and it doesn't interact with the SlotFill system in any way. It simply controls the order in which plugins( that contain SlotFIlls ) are rendered inside the PluginAreacomponent.

@gziolo gziolo added the [Feature] Plugins API Extending the Gutenberg project with plugins via the Plugins API label Oct 23, 2019
@ItsJonQ
Copy link

ItsJonQ commented Oct 28, 2019

@ryanwelcher Hallo!! I just took a peak at this PR.

I think the priority approach is interesting idea, and your solution was well done! Nice, simple, and clean 😎 .

Note: I don't have context from the previous JS meetings.

Coming into this, I was curious how this would play out once more and more custom blocks are registered.

I think when you have your own blocks, you have (basically) maximum control on ordering. But when you have a collection of blocks from other people, you have far less control.

When something like priority is enabled, then block creators can just make their plugins priority 99999 for top spot. (Kinda like what happens in the world of CSS, with z-index: 999999999; 😂 ).

I'm not sure how they're sorted by now...

The only sort order I can think of that makes sense (given the above scenario) would be alphabetical.


That said, I'm not against this idea! Just wanted to share my thoughts :)

From the WordPress PHP side, there's wp_enqueue_scripts, which does a very similar thing. But it runs into the whole "plz make my scripts highest priority" problem, at least from my experience and from examples I found online:

https://wordpress.stackexchange.com/questions/272067/how-to-enqueue-scripts-in-order-of-head-section

@ryanwelcher
Copy link
Contributor Author

Hi, @ItsJonQ!

Thanks for taking the time to review the PR. All input is greatly appreciated here 😄 . I just wanted to address some of your comments/concerns.

When something like priority is enabled, then block creators can just make their plugins priority 99999 for top spot. (Kinda like what happens in the world of CSS, with z-index: 999999999; 😂 ).

Unfortunately, this is going to be inherent with this approach. Authors can abuse this option but they can do similar things now in the Hooks API which also uses the concept of priority to control the order in which hook callbacks are run.

I'm not sure how they're sorted by now...

There is no sorting now at all. It is based on the order in which the code is loaded. This PR is meant to provide some control here.

The only sort order I can think of that makes sense (given the above scenario) would be alphabetical.

To your point above, authors can simply register a plugin called aaaaaaaaaaaaa-awesome-plugin to push it to the top of the rendering pile.

From the WordPress PHP side, there's wp_enqueue_scripts, which does a very similar thing. But it runs into the whole "plz make my scripts highest priority" problem, at least from my experience and from examples I found online:

I understand your point here but that link above has more to do with how order is used when it comes to dependencies. The PR isn't meant to address that. If there are plugins that rely on each other, that should be addressed in a different way.

packages/plugins/src/api/index.js Show resolved Hide resolved
packages/plugins/src/api/index.js Outdated Show resolved Hide resolved
@@ -58,16 +59,22 @@ class PluginArea extends Component {
}

getCurrentPluginsState() {
return {
plugins: map( getPlugins(), ( { icon, name, render } ) => {
const plugins = compose(
Copy link
Member

Choose a reason for hiding this comment

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

It would be great to have a test which validates whether components are rendered in the order enforced by priorities.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Sounds great! I'll get those in place ASAP.

packages/plugins/src/components/plugin-context/index.js Outdated Show resolved Hide resolved
@ryanwelcher
Copy link
Contributor Author

Related #19485

@ndiego
Copy link
Member

ndiego commented Jan 1, 2024

Does anyone know if there's a workaround for this?

Not that I am aware of.

Ryan Welcher added 25 commits August 27, 2024 11:29
…orts the registered plugins by priority before rendering them in PluginArea
…orts the registered plugins by priority before rendering them in PluginArea
…orts the registered plugins by priority before rendering them in PluginArea
…orts the registered plugins by priority before rendering them in PluginArea
Copy link

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Unlinked Accounts

The following contributors have not linked their GitHub and WordPress.org accounts: @[email protected], @nicolad, @ItsJonQ, @etoledom, @michaelmcandrew.

Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Unlinked contributors: [email protected], nicolad, ItsJonQ, etoledom, michaelmcandrew.

Co-authored-by: swissspidy <[email protected]>
Co-authored-by: ryanwelcher <[email protected]>
Co-authored-by: gziolo <[email protected]>
Co-authored-by: paaljoachim <[email protected]>
Co-authored-by: nerrad <[email protected]>
Co-authored-by: adamsilverstein <[email protected]>
Co-authored-by: mcsf <[email protected]>
Co-authored-by: jeffpaul <[email protected]>
Co-authored-by: SiobhyB <[email protected]>
Co-authored-by: ndiego <[email protected]>
Co-authored-by: emeaguiar <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Extensibility The ability to extend blocks or the editing experience [Feature] Plugins API Extending the Gutenberg project with plugins via the Plugins API
Projects
Status: PR needs review
Development

Successfully merging this pull request may close these issues.

Provide way to control render order of plugins registered via registerPlugin