cjw/Oxicloud
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

feat(ui): improve groupby / sortby user experience + fix confusion in trash section

Browse Source
This commit is contained in:
Edouard Vanbelle
2026-05-30 11:15:46 +02:00
parent ae82f4b664
commit 19e8af84b7
10 changed files with 108 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/js/core/groupBySync.js
+6 -9
View File
@@ -22,7 +22,8 @@
*
* No-op when the menu elements are not in the DOM (e.g. before initApp).
*
* @param {string} groupBy Active group-by key, or `''` for "None".
* @param {string} groupBy Active group-by key, e.g. `''` for the "Name"
* / flat-sort option a section opts into.
* @param {boolean} reversed Whether sort direction is reversed.
*/
function applyGroupByMenuState(groupBy, reversed) {
@@ -32,18 +33,14 @@ function applyGroupByMenuState(groupBy, reversed) {
btn.classList.toggle('active', (btn.dataset.groupBy ?? '') === groupBy);
}
// Group-by button: active class + label text.
// Group-by button always reflects the active option (icon + label).
const groupByBtn = document.getElementById('group-by-btn');
groupByBtn?.classList.toggle('active', groupBy !== '');
groupByBtn?.classList.add('active');
const lbl = groupByBtn?.querySelector('.group-by-label');
if (lbl) {
if (groupBy === '') {
lbl.textContent = '';
} else {
const activeOpt = /** @type {HTMLElement|null} */ (document.querySelector(`.group-by-option[data-group-by="${CSS.escape(groupBy)}"]`));
lbl.textContent = activeOpt?.textContent ?? '';
}
const activeOpt = /** @type {HTMLElement|null} */ (document.querySelector(`.group-by-option[data-group-by="${CSS.escape(groupBy)}"]`));
lbl.innerHTML = activeOpt?.innerHTML ?? '';
}
// Sort-direction button: active = reversed.
static/js/core/icons.js
+4
View File
@@ -37,6 +37,10 @@ const OxiIcons = {
512,
'M214.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 109.3 160 480c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z'
],
'arrow-up-a-z': [
576,
'M183.6 42.4C177.5 35.8 169 32 160 32s-17.5 3.8-23.6 10.4l-88 96c-11.9 13-11.1 33.3 2 45.2s33.3 11.1 45.2-2L128 146.3 128 448c0 17.7 14.3 32 32 32s32-14.3 32-32l0-301.7 32.4 35.4c11.9 13 32.2 13.9 45.2 2s13.9-32.2 2-45.2l-88-96zM320 320c0 17.7 14.3 32 32 32l50.7 0-73.4 73.4c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8l128 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-50.7 0 73.4-73.4c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8l-128 0c-17.7 0-32 14.3-32 32zM416 32c-12.1 0-23.2 6.8-28.6 17.7l-64 128-16 32c-7.9 15.8-1.5 35 14.3 42.9s35 1.5 42.9-14.3l7.2-14.3 88.4 0 7.2 14.3c7.9 15.8 27.1 22.2 42.9 14.3s22.2-27.1 14.3-42.9l-16-32-64-128C439.2 38.8 428.1 32 416 32zM395.8 176L416 135.6 436.2 176l-40.4 0z'
],
'arrows-alt': [
512,
'M278.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-64 64c-9.2 9.2-11.9 22.9-6.9 34.9s16.6 19.8 29.6 19.8l32 0 0 96-96 0 0-32c0-12.9-7.8-24.6-19.8-29.6s-25.7-2.2-34.9 6.9l-64 64c-12.5 12.5-12.5 32.8 0 45.3l64 64c9.2 9.2 22.9 11.9 34.9 6.9s19.8-16.6 19.8-29.6l0-32 96 0 0 96-32 0c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l64 64c12.5 12.5 32.8 12.5 45.3 0l64-64c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8l-32 0 0-96 96 0 0 32c0 12.9 7.8 24.6 19.8 29.6s25.7 2.2 34.9-6.9l64-64c12.5-12.5 12.5-32.8 0-45.3l-64-64c-9.2-9.2-22.9-11.9-34.9-6.9s-19.8 16.6-19.8 29.6l0 32-96 0 0-96 32 0c12.9 0 24.6-7.8 29.6-19.8s2.2-25.7-6.9-34.9l-64-64z'