[FIX] web: calendar > filter panel > sort items ASC

Before this commit:
Filter items in the sidebar/panel are sorted DESC. Items without value
are put at the end of the sorted list (eg : Open Shifts)

After this commit:
Filter items are sorted ASC. Label that begins with numeric are also
sorted correctly. Items without value are stull put at the end of the
sorted list.

task~3524031

closes odoo/odoo#146127

Signed-off-by: Francois Georis (fge) <fge@odoo.com>
This commit is contained in:
Pierre Pulinckx (pipu)
2023-12-22 12:00:42 +00:00
parent 8b4f4f2e37
commit 95fcb25396
4 changed files with 78 additions and 16 deletions
@@ -132,10 +132,15 @@ export class CalendarFilterPanel extends Component {
if (a.type === b.type) {
const va = a.value ? -1 : 0;
const vb = b.value ? -1 : 0;
//Condition to put unvaluable item (eg: Open Shifts) at the end of the sorted list.
if (a.type === "dynamic" && va !== vb) {
return va - vb;
}
return b.label.localeCompare(a.label);
return a.label.localeCompare(b.label, undefined, {
numeric: true,
sensitivity: "base",
ignorePunctuation: true,
});
} else {
return this.getFilterTypePriority(a.type) - this.getFilterTypePriority(b.type);
}
@@ -18,10 +18,15 @@ export class CalendarMobileFilterPanel extends Component {
if (a.type === b.type) {
const va = a.value ? -1 : 0;
const vb = b.value ? -1 : 0;
//Condition to put unvaluable item (eg: Open Shifts) at the end of the sorted list.
if (a.type === "dynamic" && va !== vb) {
return va - vb;
}
return b.label.localeCompare(a.label);
return a.label.localeCompare(b.label, undefined, {
numeric: true,
sensitivity: "base",
ignorePunctuation: true,
});
} else {
return this.getFilterTypePriority(a.type) - this.getFilterTypePriority(b.type);
}
@@ -47,13 +47,13 @@ QUnit.module("CalendarView - FilterPanel", ({ beforeEach }) => {
assert.containsN(sections[0], ".o_calendar_filter_item", 4);
assert.strictEqual(
sections[0].textContent.trim(),
"AttendeesMitchell AdminMarc DemoBrandon FreemanEverybody's calendar"
"AttendeesMitchell AdminBrandon FreemanMarc DemoEverybody's calendar"
);
header = sections[1].querySelector(".o_cw_filter_label");
assert.strictEqual(header.textContent, "Users");
assert.containsN(sections[1], ".o_calendar_filter_item", 2);
assert.strictEqual(sections[1].textContent.trim(), "UsersMarc DemoBrandon Freeman");
assert.strictEqual(sections[1].textContent.trim(), "UsersBrandon FreemanMarc Demo");
});
QUnit.test("section can collapse", async (assert) => {
@@ -101,12 +101,12 @@ QUnit.module("CalendarView - FilterPanel", ({ beforeEach }) => {
assert.hasAttrValue(
filters[1].querySelector(".o_cw_filter_avatar"),
"data-src",
"/web/image/res.partner/6/avatar_128"
"/web/image/res.partner/4/avatar_128"
);
assert.hasAttrValue(
filters[2].querySelector(".o_cw_filter_avatar"),
"data-src",
"/web/image/res.partner/4/avatar_128"
"/web/image/res.partner/6/avatar_128"
);
});
@@ -148,7 +148,7 @@ QUnit.module("CalendarView - FilterPanel", ({ beforeEach }) => {
await click(filters[1], ".o_calendar_filter_item .o_remove");
await click(filters[2], ".o_calendar_filter_item .o_remove");
assert.verifySteps(["partner_ids 2", "partner_ids 1"]);
assert.verifySteps(["partner_ids 1", "partner_ids 2"]);
});
QUnit.test("click on filter", async (assert) => {
@@ -172,8 +172,8 @@ QUnit.module("CalendarView - FilterPanel", ({ beforeEach }) => {
await click(filters[3], "input");
assert.verifySteps([
"partner_ids 3 false",
"partner_ids 6 true",
"partner_ids 4 false",
"partner_ids 6 true",
"partner_ids all true",
"partner_ids all false",
]);
@@ -460,7 +460,7 @@ QUnit.module("Views", ({ beforeEach }) => {
"should display 7 events ('event 5' counts for 2 because it spans two weeks and thus generate two fc-event elements)"
);
await click(target.querySelectorAll(".o_calendar_filter input[type=checkbox]")[1]); // click on partner 2
assert.containsN(target, ".fc-event", 5, "should now only display 5 event");
assert.containsN(target, ".fc-event", 6, "should now only display 6 event");
await click(target.querySelectorAll(".o_calendar_filter input[type=checkbox]")[2]);
assert.containsNone(target, ".fc-event", "should not display any event anymore");
// test search bar in filter
@@ -577,7 +577,7 @@ QUnit.module("Views", ({ beforeEach }) => {
[...section.querySelectorAll(".o_calendar_filter_item")].map((el) =>
el.textContent.trim()
),
["partner 2", "partner 1", "Everything"]
["partner 1", "partner 2", "Everything"]
);
// Open the autocomplete dropdown
@@ -659,7 +659,7 @@ QUnit.module("Views", ({ beforeEach }) => {
[...section.querySelectorAll(".o_calendar_filter_item")].map((el) =>
el.textContent.trim()
),
["partner 2", "partner 1", "foo partner 5", "Everything"]
["foo partner 5", "partner 1", "partner 2", "Everything"]
);
assert.strictEqual(input.value, "");
@@ -740,7 +740,7 @@ QUnit.module("Views", ({ beforeEach }) => {
[...section.querySelectorAll(".o_calendar_filter_item")].map((el) =>
el.textContent.trim()
),
["partner 2", "partner 1", "foo partner 5", "Everything"]
["foo partner 5", "partner 1", "partner 2", "Everything"]
);
assert.strictEqual(input.value, "");
});
@@ -2604,7 +2604,7 @@ QUnit.module("Views", ({ beforeEach }) => {
[...section.querySelectorAll(".o_calendar_filter_item")].map((el) =>
el.textContent.trim()
),
["Forest", "Desert", "Undefined"]
["Desert", "Forest", "Undefined"]
);
});
@@ -4988,9 +4988,9 @@ QUnit.module("Views", ({ beforeEach }) => {
await clickEvent(target, 1);
assert.deepEqual(
[...target.querySelectorAll(".o_popover [name='properties'] .o_card_property_field")].map(
(el) => el.textContent
),
[
...target.querySelectorAll(".o_popover [name='properties'] .o_card_property_field"),
].map((el) => el.textContent),
["hello", "B"]
);
});
@@ -5374,4 +5374,56 @@ QUnit.module("Views", ({ beforeEach }) => {
assert.verifySteps(["scale_year"]);
});
});
QUnit.test("calendar sidebar filters are ASC sorted (not valued @end)", async (assert) => {
patchDate(2023, 11, 14, 9, 0, 0);
serverData.models.event.records = [];
for (let i = 1; i <= 18; i++) {
serverData.models.event.records.push({
user_id: i,
name: `event ${i}`,
start: "2023-12-11 00:00:00",
stop: "2023-12-11 00:00:00",
});
}
serverData.models.event.records.push({
name: `event X`,
start: "2023-12-11 00:00:00",
stop: "2023-12-11 00:00:00",
});
serverData.models.user.records = [
{ id: 1, display_name: "Zoooro" },
{ id: 2, display_name: "Jean-Paul 1" },
{ id: 3, display_name: "Jean-Paul 2" },
{ id: 4, display_name: "Jeremy" },
{ id: 5, display_name: "Kévin" },
{ id: 6, display_name: "Romelü" },
{ id: 7, display_name: "Edên" },
{ id: 8, display_name: "Thibaùlt" },
{ id: 9, display_name: "1 - brol" },
{ id: 10, display_name: "10 - machin" },
{ id: 11, display_name: "11 - chose" },
{ id: 12, display_name: "101" },
{ id: 13, display_name: "100 - bidule" },
{ id: 14, display_name: "1000 - truc" },
{ id: 15, display_name: "00 - bazar" },
{ id: 16, display_name: "0 - chouette" },
{ id: 17, display_name: "@Hello" },
{ id: 18, display_name: "#Hello" },
];
await makeView({
type: "calendar",
resModel: "event",
serverData,
arch: `
<calendar date_start="start" mode="month">
<field name="user_id" filters="1"/>
</calendar>
`,
});
assert.strictEqual(
target.querySelector(".o_calendar_filter_items").textContent,
"00 - bazar0 - chouette1 - brol10 - machin11 - chose100 - bidule1011000 - trucEdên@Hello#HelloJean-Paul 1Jean-Paul 2JeremyKévinRomelüThibaùltZoooroUndefined"
);
});
});