XWIKI-23286: Panel toggles and handles inconsistencies #4140

Sereza7 · 2025-05-07T13:59:01Z

Jira URL

I gathered a few fixes to small issues that are related to the new panel column controls.
Let me know if you think it's important to split these fixes across a few PRs.

This PR contains fixes for:

Changes

Description

Changed the nature of the hint for panel toggles. (fixes CI error)
Added column controls on the standalone edition sheet. (fixes inconsistency found for XWIKI-12824)
Changed the ID of the panel column on the standalone edition sheet so that it works as expected (fixes inconsistency found for XWIKI-12824)
Updated the visibility of panels to always be shown when the device has not enough width. (fixes inconsistency found for XWIKI-12824)
Fixed the unexpected side margins in mobile mode. (fixes inconsistency found for XWIKI-22727)
Prevented resetting preferences for panel width when passing by a page without panels. (fixes XWIKI-23166)

Clarifications

I first implemented a way for the new controls to work with the existing ID #editPanels. However, this was pretty much just duplicating CSS selectors everywhere (difficult to maintain). So I checked the actual uses of the #editPanels id. In XWiki Standard, it was not used in any selector. I figured it was okay to change this ID, and reverted all the selector copypaste I made in favor of this ID change.

Screenshots & Video

2025-05-07.14-57-53.mp4

Executed Tests

Manual tests to check all the points mentionned, see above for some of them.

Successfully built:

mvn clean install -f xwiki-platform-core/xwiki-platform-web/ -Pquality
mvn clean install -f xwiki-platform-distribution/xwiki-platform-distribution-flavor/xwiki-platform-distribution-flavor-test/xwiki-platform-distribution-flavor-test-webstandards/

Expected merging strategy

Prefers squash: Yes
Backport on branches:
- None.

* Changed the nature of the hint fgor panel toggles. * Added controls on the standalone edition sheet. * Made sure everything that worked with rightPanels also works with editPanels.

* Fixed the solution for the edit button. It triggered the form unexpectedly... * Updated the styles to keep them clear * Updated the visibility of panels to always be shown when the device has not enough width.

* Fixed the unexpected side margins in mobile mode. * Prevented resetting preferences for panel width when passing by a page without panels.

Sereza7 · 2025-05-07T14:03:02Z

IMO it would make sense to assign this PR to the 17.4.0-RC1 release manager.
I'm not sure who will handle it yet.

Sereza7 · 2025-05-12T09:26:25Z

@surli Let me know if you'd rather have the CI fix in its own PR so that we can merge it asap.

mflorea · 2025-05-13T06:34:04Z

...ngo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/layout.less

-
-    & #leftPanels {
-      display: none;
+    /* We hide panels only when the screen is small enough.


I'm a bit puzzled by your comment. The media query below is activated when the screen width is larger than @screen-md-min, so my understanding is that the screen must be large enough. Am I missing something?

This was in order to fix when I hide a panel and then switch to "mobile mode" by making the window smaller, the panel stays hidden but there is no more button to get it back?

I;ll try to word it better because it even took me a while to understand again what I was doing here ...

Addressed in 6f5ff42 👍

mflorea · 2025-05-13T06:38:05Z

So I checked the actual uses of the #editPanels id. In XWiki Standard, it was not used in any selector. I figured it was okay to change this ID, and reverted all the selector copypaste I made in favor of this ID change.

Did you check also in xwiki-contrib?

Sereza7 · 2025-05-13T08:41:38Z

Did you check also in xwiki-contrib?

https://github.com/search?q=org%3Axwiki-contrib+%22editPanels%22&type=code&p=2

There's quite a few styles that would get lost when migrating. About half of those seem to be coded specifically for the editPanels while the other half also impacts the #rightPanels.

We could discuss about it further, but I'm not really a fan of all these alternative classes we use in the edition template (non inline edition). IMO it's enough for CSS to have one or a few extra classes on the top level container (either body or the edit form) to describe that the page is in an edit state . Right now, the whole structure is different from a view page while it's --for the most part-- the same layout and UI. So we have a lot of duplicated styles or unecessarily rare selectors.

surli · 2025-05-13T08:57:15Z

There's quite a few styles that would get lost when migrating. About half of those seem to be coded specifically for the editPanels while the other half also impacts the #rightPanels.

It's not only about styling. For example you have: https://github.com/xwiki-contrib/application-xwebide/blob/7bda93596a03f4c95f4abc5e921a5f6e13e4da20/application-xwebide-ui/src/main/resources/WebIDECode/WebIDE_class.xml#L469 and the extension is not indicated as deprecated or not working: https://extensions.xwiki.org/xwiki/bin/view/Extension/XWebIDE+Application

Sereza7 · 2025-05-13T09:55:23Z

Warning

TBD when writing the release note for this commit if we don't change solution: Let people know about the change in ID.

There's quite a few styles that would get lost when migrating. About half of those seem to be coded specifically for the editPanels while the other half also impacts the #rightPanels.

It's not only about styling. For example you have: https://github.com/xwiki-contrib/application-xwebide/blob/7bda93596a03f4c95f4abc5e921a5f6e13e4da20/application-xwebide-ui/src/main/resources/WebIDECode/WebIDE_class.xml#L469 and the extension is not indicated as deprecated or not working: https://extensions.xwiki.org/xwiki/bin/view/Extension/XWebIDE+Application

AFAICS we don't have much documentation about it. Nothing on https://www.xwiki.org/xwiki/bin/view/Documentation/DevGuide/FrontendResources/ . The only mention of this class I could find in our doc was: https://design.xwiki.org/xwiki/bin/view/Standards/CSSAPISelectors . We can keep this specific ID, but then we need to make sure that we describe it as API in the doc then. It comes with a non-null maintenance time and we should push people to use this one to power their customizations and extensions.

I opened a topic on the forum to discuss it with everyone,.

Sereza7 · 2025-06-11T08:11:02Z

The consensus from the forum was that it was okay to remove #editPanels. This PR is in a state ready for a merge. When writing the release notes, make sure to not forget mentionning this small breakage.

* Updated the comment to be clearer

Sereza7 · 2025-06-11T08:38:10Z

Addressed all comments and created a new issue (because the fix didn't get merged with the cause in 17.4.0)

XWIKI-23286: Panel toggles and handles inconsistencies
https://jira.xwiki.org/browse/XWIKI-23166

michitux

Looks good to me apart from a tiny code style issue, but I haven't tested if this actually resolves the problems.

...flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/flamingo.js

* Fixed codestyle Co-authored-by: Michael Hamann <michael@content-space.de>

* Removed an unwanted change added mistakenly at conflict resolution

Sereza7 · 2025-06-13T14:24:01Z

There was a small conflict with the changes merged from XWIKI-23282: Toggle panels columns has issues when using Small or Large sized panels. It's handled now 👍

github-actions · 2025-06-13T14:50:25Z

💔 All backports failed

Status	Branch	Result
❌	stable-17.4.x	Backport failed because of merge conflicts You might need to backport the following PRs to stable-17.4.x: - XWIKI-23282: Toggle panels columns has issues when using Small or Large sized panels (#4273)

Manual backport

To create the backport manually run:

backport --pr 4140

Questions ?

Please refer to the Backport tool documentation and see the Github Action logs for details

Sereza7 added 3 commits May 7, 2025 11:19

XWIKI-12824: Add buttons to hide/show panels

b1451ad

* Changed the nature of the hint fgor panel toggles. * Added controls on the standalone edition sheet. * Made sure everything that worked with rightPanels also works with editPanels.

XWIKI-12824: Add buttons to hide/show panels

cecaf3b

* Fixed the solution for the edit button. It triggered the form unexpectedly... * Updated the styles to keep them clear * Updated the visibility of panels to always be shown when the device has not enough width.

XWIKI-12824: Add buttons to hide/show panels

12cdc69

* Fixed the unexpected side margins in mobile mode. * Prevented resetting preferences for panel width when passing by a page without panels.

Sereza7 requested review from mflorea and michitux May 7, 2025 13:59

Sereza7 requested a review from manuelleduc May 7, 2025 14:15

Sereza7 assigned surli May 12, 2025

mflorea reviewed May 13, 2025

View reviewed changes

Merge branch 'xwiki:master' into XWIKI-12824-3

17acc66

Sereza7 mentioned this pull request May 15, 2025

Added an alternative selector to keep compatibility with changes that will come with XWIKI-12824 xwiki-contrib/application-xwebide#5

Merged

Sereza7 added the backport stable-17.4.x label Jun 11, 2025

XWIKI-12824: Add buttons to hide/show panels

6f5ff42

* Updated the comment to be clearer

Sereza7 changed the title ~~XWIKI-12824: Add buttons to hide/show left and right panel columns~~ XWIKI-23286: Panel toggles and handles inconsistencies Jun 11, 2025

Sereza7 requested a review from surli June 11, 2025 08:38

michitux approved these changes Jun 12, 2025

View reviewed changes

...flamingo-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/flamingo.js Outdated Show resolved Hide resolved

Sereza7 and others added 3 commits June 13, 2025 16:09

XWIKI-23286: Panel toggles and handles inconsistencies

d4aa6e8

* Fixed codestyle Co-authored-by: Michael Hamann <michael@content-space.de>

Merge branch 'master' into XWIKI-12824-3

ae16095

XWIKI-23286: Panel toggles and handles inconsistencies

5dffed8

* Removed an unwanted change added mistakenly at conflict resolution

surli merged commit 3db912d into xwiki:master Jun 13, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

XWIKI-23286: Panel toggles and handles inconsistencies #4140

XWIKI-23286: Panel toggles and handles inconsistencies #4140

Sereza7 commented May 7, 2025 •

edited

Loading

Uh oh!

Sereza7 commented May 7, 2025

Uh oh!

Sereza7 commented May 12, 2025

Uh oh!

mflorea May 13, 2025

Uh oh!

Sereza7 Jun 11, 2025 •

edited

Loading

Uh oh!

Sereza7 Jun 11, 2025

Uh oh!

mflorea commented May 13, 2025

Uh oh!

Sereza7 commented May 13, 2025 •

edited

Loading

Uh oh!

surli commented May 13, 2025

Uh oh!

Sereza7 commented May 13, 2025 •

edited

Loading

Uh oh!

Sereza7 commented Jun 11, 2025

Uh oh!

Sereza7 commented Jun 11, 2025

Uh oh!

michitux left a comment

Uh oh!

Uh oh!

Sereza7 commented Jun 13, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Jun 13, 2025

Uh oh!

Uh oh!

Uh oh!

XWIKI-23286: Panel toggles and handles inconsistencies #4140

XWIKI-23286: Panel toggles and handles inconsistencies #4140

Conversation

Sereza7 commented May 7, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Jira URL

Changes

Description

Clarifications

Screenshots & Video

Executed Tests

Expected merging strategy

Uh oh!

Sereza7 commented May 7, 2025

Uh oh!

Sereza7 commented May 12, 2025

Uh oh!

mflorea May 13, 2025

Choose a reason for hiding this comment

Uh oh!

Sereza7 Jun 11, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Sereza7 Jun 11, 2025

Choose a reason for hiding this comment

Uh oh!

mflorea commented May 13, 2025

Uh oh!

Sereza7 commented May 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

surli commented May 13, 2025

Uh oh!

Sereza7 commented May 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Sereza7 commented Jun 11, 2025

Uh oh!

Sereza7 commented Jun 11, 2025

Uh oh!

michitux left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Sereza7 commented Jun 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jun 13, 2025

💔 All backports failed

Manual backport

Questions ?

Uh oh!

Uh oh!

Sereza7 commented May 7, 2025 •

edited

Loading

Sereza7 Jun 11, 2025 •

edited

Loading

Sereza7 commented May 13, 2025 •

edited

Loading

Sereza7 commented May 13, 2025 •

edited

Loading

Sereza7 commented Jun 13, 2025 •

edited

Loading