In use, I found that I often click the text on the dropdown button, rather than the arrow and accidentally trigger the first block type. I think an UX improvement could be changing that first option in the dropdown to something like "Add Block" so users can click the entire button to display the options.

This is a must have module for enhancing layout builder!

CommentFileSizeAuthor
#3 make-first-option-a-label-not-link-3157440_3.patch5.13 KBarshadkhan35
#3 lb_direct_add_settings_form.png170.93 KBarshadkhan35
#3 lb_direct_add_label_at_the_top.png171.88 KBarshadkhan35
#6 make-first-option-a-label-not-link-3157440_3_reroll_against_tag_8.x-1.2.patch7.79 KBarshadkhan35
#6 make-first-option-a-label-not-link-3157440_3_reroll_againt_branch_8.x-1.x-dev.patch6.91 KBarshadkhan35
#7 make-first-option-a-label-not-link-3157440_3_reroll_updated_against_tag_8.x-1.2.patch8.4 KBarshadkhan35
#10 3157440-10.patch13.12 KBpyrello
#14 3157440-14.patch16.61 KBpyrello
#15 interdiff_7-14.txt14.22 KBpyrello
#16 Screen Shot 2021-03-17 at 5.36.59 PM.png33.79 KBpyrello
#17 3157440-17.patch16.66 KBpyrello
#17 interdiff_10-17.txt14.66 KBpyrello

Issue fork lb_direct_add-3157440

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

galactus86 created an issue. See original summary.

pyrello’s picture

pyrello commented

@galactus86 Thanks for checking out the module. I took a look at the definition for the 'dropbutton' render element: https://api.drupal.org/api/drupal/core%21lib%21Drupal%21Core%21Render%21.... It doesn't look like there is a way, using that element, to create the type of UX you are requesting. If you have a suggestion for an alternative, I would be happy to look into it. Also, if you want to provide a patch, I'll give it a look.

Thanks!

Sean

arshadkhan35’s picture

arshadkhan35 commented
StatusFileSize
new make-first-option-a-label-not-link-3157440_3.patch5.13 KB
new lb_direct_add_settings_form.png170.93 KB
new lb_direct_add_label_at_the_top.png171.88 KB

Thanks @pyrello for this amazing module, we are using this module too and wanted to have this feature where we can add new label at the top of the dropdown, Created a patch for the same which include

  • A settings from where you can choose whether you want to add a label or not with a checkbox
  • Label text is configurable in same setting form

Please have look. thanks

arshadkhan35’s picture

arshadkhan35 commented
Status: Active » Needs review
pyrello’s picture

pyrello commented

@arshadkhan35 Thanks for submitting a patch. I'll take a look when I have some time to review it.

arshadkhan35’s picture

arshadkhan35 commented
StatusFileSize
new make-first-option-a-label-not-link-3157440_3_reroll_against_tag_8.x-1.2.patch7.79 KB
new make-first-option-a-label-not-link-3157440_3_reroll_againt_branch_8.x-1.x-dev.patch6.91 KB

Hi @pyrello please ignore #3 patch as it has some missing file , Rerolling the same patch against 8.x-1.2 tag and 8.x-1.x-dev branch.

arshadkhan35’s picture

arshadkhan35 commented
StatusFileSize
new make-first-option-a-label-not-link-3157440_3_reroll_updated_against_tag_8.x-1.2.patch8.4 KB
galactus86’s picture

galactus86 commented
Version: 8.x-1.1 » 8.x-1.2
Status: Needs review » Reviewed & tested by the community

Hi @pyrello

For some reason I missed any updates on this issue so I apologize for not following up.

I applied the patch from @arshadkhan35 with Composer and so far it seems to work as described. I am able to access the config page, update the text, and then use on a Layout Page. Not seeing any errors in the logs.

And really useful module, so thank you!

pyrello’s picture

pyrello commented
Version: 8.x-1.2 » 2.x-dev

Targeting a new version and taking the opportunity to switch to semantic versioning at the same time :)

pyrello’s picture

pyrello commented
Version: 2.x-dev » 8.x-1.2
StatusFileSize
new 3157440-10.patch13.12 KB

After testing the patch in #7, my impression is that using the dropbutton element no longer seems right when the first link is not an actual action and just a trigger for seeing the actions. This patch attempts to create a UI for what I think the experience should be like.

Feedback is definitely welcome.

pyrello’s picture

pyrello commented
Status: Reviewed & tested by the community » Needs review

pyrello opened merge request !1

bspeare made their first commit to this issue’s fork.

pyrello’s picture

pyrello commented
StatusFileSize
new 3157440-14.patch16.61 KB

Adding a patch to make testing changes to the issue fork and merge request easier.

pyrello’s picture

pyrello commented
StatusFileSize
new interdiff_7-14.txt14.22 KB

I always forget to add these at the time when I am adding the patch.

pyrello’s picture

pyrello commented
StatusFileSize
new Screen Shot 2021-03-17 at 5.36.59 PM.png33.79 KB

Here is what it looks like in practice:

pyrello’s picture

pyrello commented
StatusFileSize
new 3157440-17.patch16.66 KB
new interdiff_10-17.txt14.66 KB

The patch in #14 had an error in because I had failed to change a couple of variable names when I was renaming things.

New patch, new interdiff.

pyrello’s picture

pyrello commented
pyrello’s picture

pyrello commented
pyrello’s picture

pyrello commented
pyrello’s picture

pyrello commented
pyrello’s picture

pyrello commented
Status: Needs review » Reviewed & tested by the community

Based on some limited feedback in Slack and our own testing, I think I'm ready to call this RTBC. If we need to refine the UI in the future, I guess we'll open additional issues.

Thanks to everyone for your help with this.

  • pyrello committed c60b756 on 2.x 
    Issue #3157440 by pyrello, arshadkhan35, galactus86, bspeare: Make first...
pyrello’s picture

pyrello commented
pyrello’s picture

pyrello commented
Status: Reviewed & tested by the community » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

jdhaire’s picture

jdhaire commented

Was this patch merged into v1.2? I have 1.2 installed but it does not match branch 2.x. I tried applying the https://www.drupal.org/files/issues/2021-03-17/3157440-17_0.patch without success. On drupal 9.3.4. Any direction on how to get this functionality would be appreciated. Love this idea as it saves time and reduces clicks. Thanks!

jdhaire’s picture

jdhaire commented

Nevermind! I completely overlooked the 2.x-dev (maybe add to the module page). Any way, works as expected. Is there a way to modify the + icon that displays before the label? I would like to style it to match the rest of the + icons. Thanks again! Sorry for the first message panic. Ha!