UX when using gin with Contnet Moderation and Workflows

Created on 11 May 2023, almost 2 years ago

when using the Gin theme with Content Moderation and Workflows module the node edit actions are separated causing UX issues (see image)

✨ Feature request
Status

Active

Version

3.0

Component

User interface

Created by

πŸ‡©πŸ‡ͺGermany stevieb

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @stevieb
  • πŸ‡ΈπŸ‡ͺSweden erikbrgn

    Yeah, this is not optimal from UX PoV.

    I'll make an attempt at changing this behavior/design.

  • @erikbrgn opened merge request.
  • Status changed to Needs review over 1 year ago
  • πŸ‡²πŸ‡½Mexico dalin πŸ‡¨πŸ‡¦, πŸ‡²πŸ‡½, 🌍

    Before I found this d.o issue I did a mockup of a better state. I'm not sure how much overlap this has with what's already been done on this issue.

  • πŸ‡²πŸ‡½Mexico dalin πŸ‡¨πŸ‡¦, πŸ‡²πŸ‡½, 🌍
  • πŸ‡¨πŸ‡­Switzerland saschaeggi Zurich

    I move the prio back to normal as this is a feature request.

  • πŸ‡ΈπŸ‡ͺSweden erikbrgn

    @dalin, unfortunately no overlap. I went with my companies UX-designers design, but it was mostly as a band-aid in order for us to start using this theme.

  • πŸ‡²πŸ‡½Mexico dalin πŸ‡¨πŸ‡¦, πŸ‡²πŸ‡½, 🌍
  • Status changed to Needs work over 1 year ago
  • πŸ‡²πŸ‡½Mexico dalin πŸ‡¨πŸ‡¦, πŸ‡²πŸ‡½, 🌍

    I spun this up on https://simplytest.me Mostly, this is great! Better than what I had mocked up as an interim back-end solution by just reordering some things. Here's some screenshots from using just Drupal Core:

    If I switch the moderation widget to "text field" then it's okay, but the field is too big:

    And if I adjust my screensize we get some problems with things bumping together, or blocking the title. It's not too terrible, but should be cleaned up before we commit this.

  • πŸ‡ΈπŸ‡ͺSweden erikbrgn

    @dalin, I took your feedback to my colleagues and this is what we came up as a solution for now:

    Fullscreen:

    Tablet (aligned left to make it stand out somewhat):

    Mobile (labels hidden to save space)

  • Status changed to Needs review over 1 year ago
  • Status changed to RTBC about 1 year ago
  • Hi, I tested MR! 295 changes look good not attaching each screen screenshot as in #11 screenshots have already been added.

  • πŸ‡ΈπŸ‡ͺSweden devdits

    Rebased MR on latest 8.x-3.x.
    Could not update MR, so will add patch here.

  • πŸ‡¨πŸ‡­Switzerland saschaeggi Zurich

    saschaeggi β†’ changed the visibility of the branch 3359619-ux-when-using to hidden.

  • πŸ‡¨πŸ‡­Switzerland saschaeggi Zurich

    saschaeggi β†’ changed the visibility of the branch 3359619-ux-when-using to active.

  • πŸ‡²πŸ‡½Mexico dalin πŸ‡¨πŸ‡¦, πŸ‡²πŸ‡½, 🌍

    @devdits
    Thanks for the re-roll.

    > Could not update MR

    Do you see a green "Get push access" button at the top of the page near the info about the fork?

    > Rebased MR on latest 8.x-3.x.

    In this latest reroll I'm seeing some elements bumping together.

    This is happening at all screensizes.

    Also, I'm not sure why many of the screenshots here don't include the words "Save as" or "Change to" because there isn't really a way to turn them off:
    https://git.drupalcode.org/project/drupal/-/blob/11.x/core/modules/conte...

  • πŸ‡¨πŸ‡­Switzerland saschaeggi Zurich

    This needs a rebase and a dist recompile

  • First commit to issue fork.
  • @scott_euser opened merge request.
  • πŸ‡¬πŸ‡§United Kingdom scott_euser

    New MR to 4.x (I assume that was the right thing to do too, sorry if not!)

    Screenshot (issue described in #17 also no longer applies in 4.x it seems):

  • πŸ‡¬πŸ‡§United Kingdom scott_euser

    scott_euser β†’ changed the visibility of the branch 3359619-ux-when-using to hidden.

  • πŸ‡¬πŸ‡§United Kingdom scott_euser
  • πŸ‡©πŸ‡ͺGermany jurgenhaas Gottmadingen

    This is looking good, except for 1 extra file components/content_moderation.scss that shouldn't be there. This file exists as styles/components/content_moderation.scss.

    After that, this is RTBC from my side.

    @saschaeggi as for new features, that should go into 4.1.x - are you ok that we create that branch and divert new features into that?

  • Status changed to Needs review about 2 months ago
  • First commit to issue fork.
  • πŸ‡¬πŸ‡§United Kingdom karengrey

    Updated MR

  • πŸ‡¬πŸ‡§United Kingdom karengrey

    Unfortunately, this still needs some work.
    The form container that is created in the gin sticky actions area doesn't actually do anything on form submit, so the moderation state remains unchanged.

  • πŸ‡¬πŸ‡§United Kingdom scott_euser

    Thanks for spotting and investigating! I see now what's going wrong; the sticky bar is outside of the <form> and therefore needs the form attribute set on the select element so that it gets submitted alongside the form. This is why the 'status' field without content moderation was already working, as it manually sets the form already on it. We now apply the same approach to moderation state.

  • πŸ‡¬πŸ‡§United Kingdom karengrey

    This is now working for me. Great spot, Scott!

  • Thank you for addressing this issue! It's working for us on 10.3.11, gin 4.0.x-dev, php 8.3.14.

  • πŸ‡²πŸ‡½Mexico dalin πŸ‡¨πŸ‡¦, πŸ‡²πŸ‡½, 🌍

    > It's working for us on... gin 4.0.x-dev

    Hmmm, not for me. I can't get this to apply to dev _or_ 4.0.2. I think it needs a rebase, but there are conflicts in `src/GinContentFormHelper.php`. That's beyond my current GitLab skills.

    We should also run through the full suite of tests in #10 so that we review all the different ways that the workflow widget can be configured.

  • πŸ‡²πŸ‡½Mexico dalin πŸ‡¨πŸ‡¦, πŸ‡²πŸ‡½, 🌍
Production build 0.71.5 2024