Problem/Motivation

We are always showing drag and drop control, even when there is 0 or 1 paragraph item which does not make sense.

Above screenshot also shows that we are missing edge screen detection, but this will be a rare case and i don't think it is a big deal for now.

Proposed resolution

Show drag and drop control only for two or more par items.

Remaining tasks

Do it.

User interface changes

None.

API changes

None.

Data model changes

None.

CommentFileSizeAuthor
#13 hide-drag-drop-for-0-1-items-2907668-13.patch1.15 KBpivica
#9 hide-drag-drop-for-0-1-items-2907668-9.patch1.16 KBpivica
#9 interdiff-2907688-2-9.txt926 bytespivica
#2 hide-drag-drop-for-0-1-items-2907668.patch1.16 KBpivica
Selection_056.png13.27 KBpivica
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

pivica created an issue. See original summary.

pivica’s picture

pivica CreditAttribution: pivica at MD Systems GmbH commented
Status: Active » Needs review
FileSize
hide-drag-drop-for-0-1-items-2907668.patch1.16 KB

Here is a patch. Not really sure about tests, we have that paragraphs_test_dragdrop_force_show switch which we are using and because of that we always show drag&drop control in tests.

miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented

I like it how the drag&drop button looks while no single Paragraph is present.. ;-)

Dunno why we need that force mode? I would think it is to force switch into drag&drop mode, not about button visibility?

pivica’s picture

pivica CreditAttribution: pivica at MD Systems GmbH commented

> Dunno why we need that force mode?

If there are no items or there is only 1 item there is no reason to switch to drag and drop mode i guess... Especially for 0 items UI is broken and a bit different so at least for 0 we should remove it.

miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented

We are talking about two different things.

I fully agree to hide the button if it is only 0..1 items.

Berdir’s picture

Berdir
Primary language German
Location Switzerland
CreditAttribution: Berdir at MD Systems GmbH commented
Status: Needs review » Needs work

The thing with one item is that you could have children in that single item that you for example want to move outside. That's why it is currently shown then.

And the force mode is for tests, when the library is not present. Which also means the combined logic is not correct, should be count > 0 && (library || force) IMHO.

miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented
Priority: Normal » Major

Still promoting to major as the "Drag & drop" action is confusing if there is nothing inside.

miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented
Issue tags: +Usability
pivica’s picture

pivica CreditAttribution: pivica at MD Systems GmbH commented
Status: Needs work » Needs review
FileSize
interdiff-2907688-2-9.txt926 bytes
hide-drag-drop-for-0-1-items-2907668-9.patch1.16 KB

Here is a new patch based on @berdir feedback from comment 6.

I figure two additional things for this:

> The thing with one item is that you could have children in that single item that you for example want to move outside.

Yeah, make sense. Is there an easy way to query children count maybe and if there are no kids we don't show drop&down in this case?

I found one more problem. When you have one item if you remove that item then we will still show drag&drop control because realItemCount will still have value 1. I tried to figure this out quickly but didn't have any luck. Is there an easy way to handle this case?

miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented

If you remove it, the item still exists with a status set to removed. It is actually removed on save.
If you want to know the effective count, you need to loop and exclude removed count. I don't think we have such a corrected counter at hand already?

miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented
Related issues: +#2931440: Fix realItemsCount use and count

Oh checked...

  /**
   * Number of paragraphs item on form.
   */
  protected $realItemCount;

So it seems that removed should not have been counted here...

Created issue to investigate.

miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented
Status: Needs review » Needs work

Hm, needs a reroll. Otherwise ready to commit.

pivica’s picture

pivica CreditAttribution: pivica at MD Systems GmbH commented
Status: Needs work » Needs review
FileSize
hide-drag-drop-for-0-1-items-2907668-13.patch1.15 KB

Re-rolled a patch.

  • miro_dietiker committed 194b3e9 on 8.x-1.x authored by pivica 
    Issue #2907668 by pivica, miro_dietiker: Don't show drag and drop when...
miro_dietiker’s picture

miro_dietiker
Location Switzerland
CreditAttribution: miro_dietiker at MD Systems GmbH commented
Status: Needs review » Fixed

Committed, thx.

Status: Fixed » Closed (fixed)

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

Charles Belov’s picture

Charles Belov
he/him
Primary language English
Location San Francisco, CA, US
CreditAttribution: Charles Belov at San Francisco Municipal Transportation Agency commented

This issue appears to have regressed. As of Feb. 28, 2024:

Steps to reproduce

1. Go to https://simplytest.me
2. In the field, type "Core" (without the quotes)
3. Choose Drupal core
4. Click the add project button
5. In the project field, type "Paragraphs"
6. Choose Paragraphs
7. Click the button to create the site
8. Once the site has been created, log in as admin
9. In the admin menu, choose Manage, then Structure, then Paragraphs types
10. Click Add paragraph type
11. Type label "Single contact"
12. Click Save and manage fields
13. Click Create a new field
14. Type label "Contact name"
15. Choose text
16. Click Continue
17. Change Allowed number of values to unlimited
18. Click Save settings
19. Choose Structure, then Content types, then, on the row for Basic page, choose Manage fields
20. Click Create a new field
21. Type label "Contact information"
22. Choose Paragraphs
23. Click Continue
24. Under paragraph types, check Single contact
25. Click Save settings
26. In the admin menu, choose Manage, then Content, then Add content, then Basic page

Expected result: Contact information has no vertical three dots icon

Actual result: Contact information has a vertical three dots icon. Clicking the three dot icon reveals the menu item Drag & Drop