diff --git a/addons/im_livechat/static/src/embed/chat_window/chat_window_patch.xml b/addons/im_livechat/static/src/embed/chat_window/chat_window_patch.xml index bf674c1a3e5..a7ac1863348 100644 --- a/addons/im_livechat/static/src/embed/chat_window/chat_window_patch.xml +++ b/addons/im_livechat/static/src/embed/chat_window/chat_window_patch.xml @@ -10,7 +10,7 @@ /> $0 - + $0 diff --git a/addons/im_livechat/static/src/embed/core/thread_model_patch.js b/addons/im_livechat/static/src/embed/core/thread_model_patch.js index a97d3f2af40..9117ee97f1e 100644 --- a/addons/im_livechat/static/src/embed/core/thread_model_patch.js +++ b/addons/im_livechat/static/src/embed/core/thread_model_patch.js @@ -12,6 +12,10 @@ patch(Thread.prototype, "im_livechat", { return this.type === "livechat" || this._super(); }, + get isChatChannel() { + return this.type === "livechat" || this._super(); + }, + get isLastMessageFromCustomer() { if (this.type !== "livechat") { return this._super(); diff --git a/addons/im_livechat/static/tests/embed/unread_messages_tests.js b/addons/im_livechat/static/tests/embed/unread_messages_tests.js index 16ab91f4ee4..4467c89ca18 100644 --- a/addons/im_livechat/static/tests/embed/unread_messages_tests.js +++ b/addons/im_livechat/static/tests/embed/unread_messages_tests.js @@ -33,8 +33,8 @@ QUnit.test("new message from operator displays unread counter", async (assert) = thread_model: "discuss.channel", }); }); - await waitUntil(".o-mail-ChatWindow-header:contains((1))"); - assert.containsOnce($, ".o-mail-ChatWindow-header:contains((1))"); + await waitUntil(".o-mail-ChatWindow-header:contains(1)"); + assert.containsOnce($, ".o-mail-ChatWindow-header:contains(1)"); }); QUnit.test("focus on unread livechat marks it as read", async (assert) => { diff --git a/addons/im_livechat/static/tests/sidebar_patch_tests.js b/addons/im_livechat/static/tests/sidebar_patch_tests.js index 8db05c0b024..fd659e80ca7 100644 --- a/addons/im_livechat/static/tests/sidebar_patch_tests.js +++ b/addons/im_livechat/static/tests/sidebar_patch_tests.js @@ -293,7 +293,7 @@ QUnit.test("No counter if category is folded and without unread messages", async await openDiscuss(); assert.containsNone( $, - ".o-mail-DiscussCategory-livechat .o-mail-DiscussCategory-counter", + ".o-mail-DiscussCategory-livechat .o-discuss-badge", "should not have a counter if the category is unfolded and with unread messages" ); }); @@ -324,10 +324,7 @@ QUnit.test( }); const { openDiscuss } = await start(); await openDiscuss(); - assert.strictEqual( - $(".o-mail-DiscussCategory-livechat .o-mail-DiscussCategory-counter").text(), - "1" - ); + assert.strictEqual($(".o-mail-DiscussCategory-livechat .o-discuss-badge").text(), "1"); } ); diff --git a/addons/mail/static/src/core/common/chat_window.scss b/addons/mail/static/src/core/common/chat_window.scss index 8a1315096f6..aae61db806c 100644 --- a/addons/mail/static/src/core/common/chat_window.scss +++ b/addons/mail/static/src/core/common/chat_window.scss @@ -21,6 +21,10 @@ z-index: 2; } +.o-mail-ChatWindow-counter { + padding: 3px 6px; +} + .o-mail-ChatWindow-header { height: $o-mail-Discuss-headerHeight; diff --git a/addons/mail/static/src/core/common/chat_window.xml b/addons/mail/static/src/core/common/chat_window.xml index b7a185f8d95..290cfce2186 100644 --- a/addons/mail/static/src/core/common/chat_window.xml +++ b/addons/mail/static/src/core/common/chat_window.xml @@ -28,10 +28,10 @@ 'ms-3 me-1 my-0': !thread, }" /> -
- () -
+
+ +
diff --git a/addons/mail/static/src/core/common/core.dark.scss b/addons/mail/static/src/core/common/core.dark.scss new file mode 100644 index 00000000000..a261430d7c8 --- /dev/null +++ b/addons/mail/static/src/core/common/core.dark.scss @@ -0,0 +1,3 @@ +.o-discuss-badge { + background-color: $primary; +} diff --git a/addons/mail/static/src/core/common/core.scss b/addons/mail/static/src/core/common/core.scss index fe1baac242c..bde404061a4 100644 --- a/addons/mail/static/src/core/common/core.scss +++ b/addons/mail/static/src/core/common/core.scss @@ -2,6 +2,18 @@ background-color: inherit; } +.o-discuss-badge { + --o-discuss-badge-bg: #{$o-success}; // sync with --o-navbar-badge-bg + color: $white !important; + background-color: var(--o-discuss-badge-bg) !important; +} + +.o-discuss-badge, .o-discuss-badgeShape { + display: flex; + transform: translate(0, 0) !important; // cancel systray style on badge + font-size: 0.7em !important; +} + .o-min-width-0 { min-width: 0; } diff --git a/addons/mail/static/src/core/common/thread_model.js b/addons/mail/static/src/core/common/thread_model.js index cf1b65b94c5..8e4821c194d 100644 --- a/addons/mail/static/src/core/common/thread_model.js +++ b/addons/mail/static/src/core/common/thread_model.js @@ -277,6 +277,10 @@ export class Thread { return createLocalId(this.model, this.id); } + get needactionCounter() { + return this.isChatChannel ? this.message_unread_counter : this.message_needaction_counter; + } + /** @returns {import("@mail/core/common/message_model").Message | undefined} */ get newestMessage() { return [...this.messages].reverse().find((msg) => !msg.isEmpty); diff --git a/addons/mail/static/src/core/web/messaging_menu.xml b/addons/mail/static/src/core/web/messaging_menu.xml index b5f396a8157..216ca3bf62b 100644 --- a/addons/mail/static/src/core/web/messaging_menu.xml +++ b/addons/mail/static/src/core/web/messaging_menu.xml @@ -81,7 +81,7 @@ -
+
Notification Item Image @@ -11,9 +11,8 @@
- () - + @@ -24,7 +23,10 @@
- +
+ + +
diff --git a/addons/mail/static/src/core/web/sidebar.scss b/addons/mail/static/src/core/web/sidebar.scss index 6d6a104643c..6501f1b293d 100644 --- a/addons/mail/static/src/core/web/sidebar.scss +++ b/addons/mail/static/src/core/web/sidebar.scss @@ -19,6 +19,10 @@ } } +.o-mail-DiscussSidebar-badge { + padding: 3px 6px; +} + .o-mail-DiscussCategoryItem-threadIcon { font-size: xx-small; width: 13px; diff --git a/addons/mail/static/src/core/web/sidebar.xml b/addons/mail/static/src/core/web/sidebar.xml index 3170a1c32e1..e28a7c7895a 100644 --- a/addons/mail/static/src/core/web/sidebar.xml +++ b/addons/mail/static/src/core/web/sidebar.xml @@ -38,8 +38,8 @@
-
- +
+
@@ -56,7 +56,7 @@
-
+
@@ -99,8 +99,8 @@
-
- +
+
diff --git a/addons/mail/static/tests/discuss_app/sidebar_tests.js b/addons/mail/static/tests/discuss_app/sidebar_tests.js index 7002cb36849..d51c2cd6ac6 100644 --- a/addons/mail/static/tests/discuss_app/sidebar_tests.js +++ b/addons/mail/static/tests/discuss_app/sidebar_tests.js @@ -352,11 +352,11 @@ QUnit.test("chat - channel should count unread message [REQUIRE FOCUS]", async ( }); const { openDiscuss } = await start(); await openDiscuss(); - assert.containsOnce($, ".o-mail-DiscussCategoryItem-counter"); - assert.strictEqual($(".o-mail-DiscussCategoryItem-counter").text(), "1"); + assert.containsOnce($, ".o-discuss-badge"); + assert.strictEqual($(".o-discuss-badge").text(), "1"); await click(".o-mail-DiscussCategoryItem:contains(Demo)"); - assert.containsNone($, ".o-mail-DiscussCategoryItem-counter"); + assert.containsNone($, ".o-discuss-badge"); }); QUnit.test("mark channel as seen on last message visible [REQUIRE FOCUS]", async (assert) => { @@ -1178,7 +1178,7 @@ QUnit.test("Group unread counter up to date after mention is marked as seen", as ]); const { openDiscuss } = await start(); await openDiscuss(); - assert.containsOnce($, ".o-mail-DiscussCategoryItem-counter"); + assert.containsOnce($, ".o-mail-DiscussCategoryItem .o-discuss-badge"); await click(".o-mail-DiscussCategoryItem"); - await waitUntil(".o-mail-DiscussCategoryItem-counter", 0); + await waitUntil(".o-discuss-badge", 0); }); diff --git a/addons/mail/static/tests/messaging_menu/messaging_menu_tests.js b/addons/mail/static/tests/messaging_menu/messaging_menu_tests.js index 032aa911697..348dbf6824c 100644 --- a/addons/mail/static/tests/messaging_menu/messaging_menu_tests.js +++ b/addons/mail/static/tests/messaging_menu/messaging_menu_tests.js @@ -10,11 +10,11 @@ import { waitUntil, } from "@mail/../tests/helpers/test_utils"; -import { browser } from "@web/core/browser/browser"; import { makeFakeNotificationService } from "@web/../tests/helpers/mock_services"; +import { patchWithCleanup, triggerEvent, triggerHotkey } from "@web/../tests/helpers/utils"; import { patchBrowserNotification } from "@mail/../tests/helpers/patch_notifications"; import { patchUiSize, SIZES } from "@mail/../tests/helpers/patch_ui_size"; -import { patchWithCleanup, triggerHotkey } from "@web/../tests/helpers/utils"; +import { browser } from "@web/core/browser/browser"; QUnit.module("messaging menu"); @@ -182,7 +182,7 @@ QUnit.test("grouped notifications by document", async (assert) => { await start(); await click(".o_menu_systray i[aria-label='Messages']"); assert.containsOnce($, ".o-mail-NotificationItem"); - assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner (2))"); + assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner) .badge:contains(2)"); assert.containsNone($, ".o-mail-ChatWindow"); await click(".o-mail-NotificationItem"); @@ -241,7 +241,7 @@ QUnit.test("grouped notifications by document model", async (assert) => { }, }); await click(".o_menu_systray i[aria-label='Messages']"); - assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner (2))"); + assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner) .badge:contains(2)"); $(".o-mail-NotificationItem")[0].click(); assert.verifySteps(["do_action"]); @@ -339,12 +339,14 @@ QUnit.test("mark unread channel as read", async (assert) => { }, }); await click(".o_menu_systray i[aria-label='Messages']"); - assert.containsOnce($, ".o-mail-NotificationItem i[title='Mark As Read']"); + await triggerEvent($(".o-mail-NotificationItem")[0], null, "mouseenter"); + assert.containsOnce($, ".o-mail-NotificationItem [title='Mark As Read']"); - await click(".o-mail-NotificationItem i[title='Mark As Read']"); + await click(".o-mail-NotificationItem [title='Mark As Read']"); assert.verifySteps(["set_last_seen_message"]); assert.hasClass($(".o-mail-NotificationItem"), "o-muted"); - assert.containsNone($, ".o-mail-NotificationItem i[title='Mark As Read']"); + await triggerEvent($(".o-mail-NotificationItem")[0], null, "mouseenter"); + assert.containsNone($, ".o-mail-NotificationItem [title='Mark As Read']"); assert.containsNone($, ".o-mail-ChatWindow"); }); @@ -372,9 +374,10 @@ QUnit.test("mark failure as read", async (assert) => { $, ".o-mail-NotificationItem:contains(An error occurred when sending an email)" ); - assert.containsOnce($, ".o-mail-NotificationItem:contains(Channel) i[title='Mark As Read']"); + await triggerEvent($(".o-mail-NotificationItem:contains(Channel)")[0], null, "mouseenter"); + assert.containsOnce($, ".o-mail-NotificationItem:contains(Channel) [title='Mark As Read']"); - await click(".o-mail-NotificationItem i[title='Mark As Read']"); + await click(".o-mail-NotificationItem [title='Mark As Read']"); assert.containsNone($, ".o-mail-NotificationItem:contains(Channel)"); assert.containsNone( $, @@ -428,7 +431,7 @@ QUnit.test("different discuss.channel are not grouped", async (assert) => { await click(".o_menu_systray i[aria-label='Messages']"); assert.containsN($, ".o-mail-NotificationItem", 4); - const group_1 = $(".o-mail-NotificationItem:contains(Channel (2)):first"); + const group_1 = $(".o-mail-NotificationItem:contains(Channel):first"); await click(group_1); assert.containsOnce($, ".o-mail-ChatWindow"); }); @@ -869,7 +872,8 @@ QUnit.test( await start(); await click(".o_menu_systray i[aria-label='Messages']"); assert.containsN($, ".o-mail-NotificationItem", 1); - assert.ok($(".o-mail-NotificationItem").text().includes("Test (1)")); + assert.ok($(".o-mail-NotificationItem").text().includes("Test")); + assert.ok($(".o-mail-NotificationItem .badge").text().includes("1")); assert.ok($(".o-mail-NotificationItem").text().includes("Message with needaction")); } ); @@ -891,7 +895,7 @@ QUnit.test("chat should show unread counter on receiving new messages", async (a await click(".o_menu_systray i[aria-label='Messages']"); assert.containsOnce($, ".o-mail-NotificationItem"); assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner1)"); - assert.containsNone($, ".o-mail-NotificationItem:contains('Partner1 (1)')"); + assert.containsNone($, ".o-mail-NotificationItem .badge:contains('1')"); // simulate receiving a new message const channel = pyEnv["discuss.channel"].searchRead([["id", "=", channelId]])[0]; pyEnv["bus.bus"]._sendone(channel, "discuss.channel/new_message", { @@ -904,7 +908,7 @@ QUnit.test("chat should show unread counter on receiving new messages", async (a res_id: channelId, }, }); - await waitUntil(".o-mail-NotificationItem:contains('Partner1 (1)')"); + await waitUntil(".o-mail-NotificationItem .badge:contains('1')"); }); QUnit.test("preview for channel should show latest non-deleted message", async (assert) => { diff --git a/addons/mail/static/tests/messaging_menu/notification_tests.js b/addons/mail/static/tests/messaging_menu/notification_tests.js index 774dbc7b3f6..6b57e261ba6 100644 --- a/addons/mail/static/tests/messaging_menu/notification_tests.js +++ b/addons/mail/static/tests/messaging_menu/notification_tests.js @@ -3,7 +3,7 @@ import { afterNextRender, click, start, startServer } from "@mail/../tests/helpers/test_utils"; import { browser } from "@web/core/browser/browser"; -import { patchWithCleanup } from "@web/../tests/helpers/utils"; +import { patchWithCleanup, triggerEvent } from "@web/../tests/helpers/utils"; QUnit.module("notification"); @@ -58,6 +58,11 @@ QUnit.test("mark as read", async (assert) => { }); await start(); await click(".o_menu_systray i[aria-label='Messages']"); + await triggerEvent( + $(".o-mail-NotificationItem-name:contains(Channel)").closest(".o-mail-NotificationItem")[0], + null, + "mouseenter" + ); assert.containsOnce( $(".o-mail-NotificationItem-name:contains(Channel)").closest(".o-mail-NotificationItem"), ".o-mail-NotificationItem-markAsRead" diff --git a/addons/mail/static/tests/thread/thread_tests.js b/addons/mail/static/tests/thread/thread_tests.js index 8adec3049ad..49f75958a17 100644 --- a/addons/mail/static/tests/thread/thread_tests.js +++ b/addons/mail/static/tests/thread/thread_tests.js @@ -919,10 +919,9 @@ QUnit.test( id: channelId, message: formattedMessage, }); - await waitUntil(".o-mail-DiscussCategoryItem-counter:contains(1)"); await waitUntil("button:contains(Inbox) .badge:contains(1)"); await click("button:contains(General)"); - await waitUntil(".o-mail-DiscussCategoryItem-counter", 0); + await waitUntil(".o-discuss-badge", 0); await waitUntil("button:contains(Inbox) .badge", 0); assert.verifySteps(["mark-all-messages-as-read"]); } @@ -981,10 +980,10 @@ QUnit.test("can be marked as read while loading", async function (assert) { }, }); await openDiscuss(undefined, { waitUntilMessagesLoaded: false }); - assert.containsOnce($, ".o-mail-DiscussCategoryItem-counter:contains(1)"); + assert.containsOnce($, ".o-discuss-badge:contains(1)"); await click(".o-mail-DiscussCategoryItem:contains(Demo)"); await afterNextRender(loadDeferred.resolve); - assert.containsNone($, ".o-mail-DiscussCategoryItem-counter"); + assert.containsNone($, ".o-discuss-badge"); }); QUnit.test( diff --git a/addons/sms/static/tests/messaging_menu/messaging_menu_patch_tests.js b/addons/sms/static/tests/messaging_menu/messaging_menu_patch_tests.js index bca50755827..829d906c7db 100644 --- a/addons/sms/static/tests/messaging_menu/messaging_menu_patch_tests.js +++ b/addons/sms/static/tests/messaging_menu/messaging_menu_patch_tests.js @@ -1,9 +1,9 @@ /** @odoo-module **/ import { start, startServer, click } from "@mail/../tests/helpers/test_utils"; -import { patchWithCleanup } from "@web/../tests/helpers/utils"; +import { patchWithCleanup, triggerEvent } from "@web/../tests/helpers/utils"; -QUnit.module("message menu (patch)"); +QUnit.module("messaging menu (patch)"); QUnit.test("mark as read", async (assert) => { const pyEnv = await startServer(); @@ -21,12 +21,13 @@ QUnit.test("mark as read", async (assert) => { await start(); await click(".o_menu_systray i[aria-label='Messages']"); assert.containsOnce($, ".o-mail-NotificationItem"); - assert.containsOnce($, ".o-mail-NotificationItem i[title='Mark As Read']"); + await triggerEvent($(".o-mail-NotificationItem")[0], null, "mouseenter"); + assert.containsOnce($, ".o-mail-NotificationItem [title='Mark As Read']"); assert.containsOnce( $, ".o-mail-NotificationItem:contains(An error occurred when sending an SMS)" ); - await click(".o-mail-NotificationItem i[title='Mark As Read']"); + await click(".o-mail-NotificationItem [title='Mark As Read']"); assert.containsNone($, ".o-mail-NotificationItem"); }); @@ -73,9 +74,11 @@ QUnit.test("notifications grouped by notification_type", async (assert) => { await click(".o_menu_systray i[aria-label='Messages']"); assert.containsN($, ".o-mail-NotificationItem", 2); const items = $(".o-mail-NotificationItem"); - assert.ok(items[0].textContent.includes("Partner (2)")); + assert.ok(items[0].textContent.includes("Partner")); + assert.ok(items[0].textContent.includes("2")); // counter assert.ok(items[0].textContent.includes("An error occurred when sending an email")); - assert.ok(items[1].textContent.includes("Partner (2)")); + assert.ok(items[1].textContent.includes("Partner")); + assert.ok(items[1].textContent.includes("2")); // counter assert.ok(items[1].textContent.includes("An error occurred when sending an SMS")); }); @@ -133,7 +136,7 @@ QUnit.test("grouped notifications by document model", async (assert) => { await click(".o_menu_systray i[aria-label='Messages']"); assert.containsOnce($, ".o-mail-NotificationItem"); - assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner (2))"); + assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner) .badge:contains(2)"); await click(".o-mail-NotificationItem"); assert.verifySteps(["do_action"]); }); diff --git a/addons/snailmail/static/tests/messaging_menu/messaging_menu_patch_tests.js b/addons/snailmail/static/tests/messaging_menu/messaging_menu_patch_tests.js index 63eb8f3834b..18e267bbadc 100644 --- a/addons/snailmail/static/tests/messaging_menu/messaging_menu_patch_tests.js +++ b/addons/snailmail/static/tests/messaging_menu/messaging_menu_patch_tests.js @@ -1,9 +1,9 @@ /** @odoo-module **/ import { start, startServer, click } from "@mail/../tests/helpers/test_utils"; -import { patchWithCleanup } from "@web/../tests/helpers/utils"; +import { patchWithCleanup, triggerEvent } from "@web/../tests/helpers/utils"; -QUnit.module("message menu (patch)"); +QUnit.module("messaging menu (patch)"); QUnit.test("mark as read", async (assert) => { const pyEnv = await startServer(); @@ -23,12 +23,13 @@ QUnit.test("mark as read", async (assert) => { await start(); await click(".o_menu_systray i[aria-label='Messages']"); assert.containsOnce($, ".o-mail-NotificationItem"); - assert.containsOnce($, ".o-mail-NotificationItem i[title='Mark As Read']"); + await triggerEvent($(".o-mail-NotificationItem")[0], null, "mouseenter"); + assert.containsOnce($, ".o-mail-NotificationItem [title='Mark As Read']"); assert.containsOnce( $, ".o-mail-NotificationItem:contains(An error occurred when sending a letter with Snailmail.)" ); - await click(".o-mail-NotificationItem i[title='Mark As Read']"); + await click(".o-mail-NotificationItem [title='Mark As Read']"); assert.containsNone($, ".o-mail-NotificationItem"); }); @@ -74,13 +75,15 @@ QUnit.test("notifications grouped by notification_type", async (assert) => { await start(); await click(".o_menu_systray i[aria-label='Messages']"); assert.containsN($, ".o-mail-NotificationItem", 2); - assert.ok($(".o-mail-NotificationItem:eq(0)").text().includes("Partner (2)")); + assert.ok($(".o-mail-NotificationItem:eq(0)").text().includes("Partner")); + assert.ok($(".o-mail-NotificationItem:eq(0)").text().includes("2")); // counter assert.ok( $(".o-mail-NotificationItem:eq(0)") .text() .includes("An error occurred when sending an email") ); - assert.ok($(".o-mail-NotificationItem:eq(1)").text().includes("Partner (2)")); + assert.ok($(".o-mail-NotificationItem:eq(1)").text().includes("Partner")); + assert.ok($(".o-mail-NotificationItem:eq(1)").text().includes("2")); // counter assert.ok( $(".o-mail-NotificationItem:eq(1)") .text() @@ -142,7 +145,8 @@ QUnit.test("grouped notifications by document model", async (assert) => { }); await click(".o_menu_systray i[aria-label='Messages']"); assert.containsOnce($, ".o-mail-NotificationItem"); - assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner (2))"); + assert.containsOnce($, ".o-mail-NotificationItem:contains(Partner)"); + assert.containsOnce($, ".o-mail-NotificationItem:contains(2)"); // counter await click(".o-mail-NotificationItem"); assert.verifySteps(["do_action"]); });