Skip to content

Commit 5dea786

Browse files
author
David
committed
[IMP] web_notify: action button name and close
- We can now set a button name to the notification action. - We can set an icon button as well. - After the button is clicked, the notification gets closed.
1 parent 949fc07 commit 5dea786

8 files changed

+57
-38
lines changed

‎web_notify/README.rst

+10-9
Original file line numberDiff line numberDiff line change
@@ -91,28 +91,29 @@ The notifications can bring interactivity with some buttons.
9191

9292
The reload button is activated when sending the notification with:
9393

94-
95-
The action can be used using the ``action`` keyword:
94+
The action can be used using the ``action`` keyword and we can choose which name to
95+
give to our button with the ``button_name`` key in the action context `params` key:
9696

9797
.. code-block:: python
9898
9999
action = self.env["ir.actions.act_window"]._for_xml_id('sale.action_orders')
100100
action.update({
101-
'res_id': self.id,
102-
'views': [(False, 'form')],
101+
'res_id': self.id,
102+
'views': [(False, 'form')],
103103
})
104-
self.env.user.notify_info('My information message', action=action)
104+
action["context"].setdefault("params", {})
105+
action["context"]["params"]["button_name"] = "Sales"
106+
action["context"]["params"]["button_icon"] = "fa-eye"
107+
self.env.user.notify_info('My information message', action=action)
105108
106109
107-
.. figure:: https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/description/notifications_screenshot.gif
108-
:scale: 80 %
110+
.. figure:: https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/img/notifications_screenshot.gif
109111
:alt: Sample notifications
110112

111113
You can test the behaviour of the notifications by installing this module in a demo database.
112114
Access the users form through Settings -> Users & Companies. You'll see a tab called "Test web notify", here you'll find two buttons that'll allow you test the module.
113115

114-
.. figure:: https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/description/test_notifications_demo.png
115-
:scale: 80 %
116+
.. figure:: https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/img/test_notifications_demo.png
116117
:alt: Sample notifications
117118

118119
Bug Tracker

‎web_notify/models/res_users.py

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
from odoo import _, api, exceptions, fields, models
44

55
from odoo.addons.bus.models.bus import channel_with_db, json_dump
6-
from odoo.addons.web.controllers.main import clean_action
6+
from odoo.addons.web.controllers.utils import clean_action
77

88
DEFAULT_MESSAGE = "Default message"
99

‎web_notify/readme/USAGE.rst

+10-9
Original file line numberDiff line numberDiff line change
@@ -37,26 +37,27 @@ The notifications can bring interactivity with some buttons.
3737

3838
The reload button is activated when sending the notification with:
3939

40-
41-
The action can be used using the ``action`` keyword:
40+
The action can be used using the ``action`` keyword and we can choose which name to
41+
give to our button with the ``button_name`` key in the action context `params` key:
4242

4343
.. code-block:: python
4444
4545
action = self.env["ir.actions.act_window"]._for_xml_id('sale.action_orders')
4646
action.update({
47-
'res_id': self.id,
48-
'views': [(False, 'form')],
47+
'res_id': self.id,
48+
'views': [(False, 'form')],
4949
})
50-
self.env.user.notify_info('My information message', action=action)
50+
action["context"].setdefault("params", {})
51+
action["context"]["params"]["button_name"] = "Sales"
52+
action["context"]["params"]["button_icon"] = "fa-eye"
53+
self.env.user.notify_info('My information message', action=action)
5154
5255
53-
.. figure:: static/description/notifications_screenshot.gif
54-
:scale: 80 %
56+
.. figure:: ../static/img/notifications_screenshot.gif
5557
:alt: Sample notifications
5658

5759
You can test the behaviour of the notifications by installing this module in a demo database.
5860
Access the users form through Settings -> Users & Companies. You'll see a tab called "Test web notify", here you'll find two buttons that'll allow you test the module.
5961

60-
.. figure:: static/description/test_notifications_demo.png
61-
:scale: 80 %
62+
.. figure:: ../static/img/test_notifications_demo.png
6263
:alt: Sample notifications

‎web_notify/static/description/index.html

+19-12
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,11 @@
88

99
/*
1010
:Author: David Goodger ([email protected])
11-
:Id: $Id: html4css1.css 8954 2022-01-20 10:10:25Z milde $
11+
:Id: $Id: html4css1.css 9511 2024-01-13 09:50:07Z milde $
1212
:Copyright: This stylesheet has been placed in the public domain.
1313
1414
Default cascading style sheet for the HTML output of Docutils.
15+
Despite the name, some widely supported CSS2 features are used.
1516
1617
See https://docutils.sourceforge.io/docs/howto/html-stylesheets.html for how to
1718
customize this style sheet.
@@ -274,7 +275,7 @@
274275
margin-left: 2em ;
275276
margin-right: 2em }
276277

277-
pre.code .ln { color: grey; } /* line numbers */
278+
pre.code .ln { color: gray; } /* line numbers */
278279
pre.code, code { background-color: #eeeeee }
279280
pre.code .comment, code .comment { color: #5C6576 }
280281
pre.code .keyword, code .keyword { color: #3B0D06; font-weight: bold }
@@ -300,7 +301,7 @@
300301
span.pre {
301302
white-space: pre }
302303

303-
span.problematic {
304+
span.problematic, pre.problematic {
304305
color: red }
305306

306307
span.section-subtitle {
@@ -425,22 +426,26 @@ <h1><a class="toc-backref" href="#toc-entry-2">Usage</a></h1>
425426
<li>Another allowing to send a window / client action</li>
426427
</ul>
427428
<p>The reload button is activated when sending the notification with:</p>
428-
<p>The action can be used using the <tt class="docutils literal">action</tt> keyword:</p>
429+
<p>The action can be used using the <tt class="docutils literal">action</tt> keyword and we can choose which name to
430+
give to our button with the <tt class="docutils literal">button_name</tt> key in the action context <cite>params</cite> key:</p>
429431
<pre class="code python literal-block">
430-
<span class="n">action</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">env</span><span class="p">[</span><span class="s2">&quot;ir.actions.act_window&quot;</span><span class="p">]</span><span class="o">.</span><span class="n">_for_xml_id</span><span class="p">(</span><span class="s1">'sale.action_orders'</span><span class="p">)</span><span class="w">
431-
</span> <span class="n">action</span><span class="o">.</span><span class="n">update</span><span class="p">({</span><span class="w">
432-
</span> <span class="s1">'res_id'</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">id</span><span class="p">,</span><span class="w">
433-
</span> <span class="s1">'views'</span><span class="p">:</span> <span class="p">[(</span><span class="kc">False</span><span class="p">,</span> <span class="s1">'form'</span><span class="p">)],</span><span class="w">
434-
</span> <span class="p">})</span><span class="w">
432+
<span class="n">action</span> <span class="o">=</span> <span class="bp">self</span><span class="o">.</span><span class="n">env</span><span class="p">[</span><span class="s2">&quot;ir.actions.act_window&quot;</span><span class="p">]</span><span class="o">.</span><span class="n">_for_xml_id</span><span class="p">(</span><span class="s1">'sale.action_orders'</span><span class="p">)</span><span class="w">
433+
</span><span class="n">action</span><span class="o">.</span><span class="n">update</span><span class="p">({</span><span class="w">
434+
</span> <span class="s1">'res_id'</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">id</span><span class="p">,</span><span class="w">
435+
</span> <span class="s1">'views'</span><span class="p">:</span> <span class="p">[(</span><span class="kc">False</span><span class="p">,</span> <span class="s1">'form'</span><span class="p">)],</span><span class="w">
436+
</span><span class="p">})</span><span class="w">
437+
</span><span class="n">action</span><span class="p">[</span><span class="s2">&quot;context&quot;</span><span class="p">]</span><span class="o">.</span><span class="n">setdefault</span><span class="p">(</span><span class="s2">&quot;params&quot;</span><span class="p">,</span> <span class="p">{})</span><span class="w">
438+
</span><span class="n">action</span><span class="p">[</span><span class="s2">&quot;context&quot;</span><span class="p">][</span><span class="s2">&quot;params&quot;</span><span class="p">][</span><span class="s2">&quot;button_name&quot;</span><span class="p">]</span> <span class="o">=</span> <span class="s2">&quot;Sales&quot;</span><span class="w">
439+
</span><span class="n">action</span><span class="p">[</span><span class="s2">&quot;context&quot;</span><span class="p">][</span><span class="s2">&quot;params&quot;</span><span class="p">][</span><span class="s2">&quot;button_icon&quot;</span><span class="p">]</span> <span class="o">=</span> <span class="s2">&quot;fa-eye&quot;</span><span class="w">
435440
</span><span class="bp">self</span><span class="o">.</span><span class="n">env</span><span class="o">.</span><span class="n">user</span><span class="o">.</span><span class="n">notify_info</span><span class="p">(</span><span class="s1">'My information message'</span><span class="p">,</span> <span class="n">action</span><span class="o">=</span><span class="n">action</span><span class="p">)</span>
436441
</pre>
437442
<div class="figure">
438-
<img alt="Sample notifications" src="https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/description/notifications_screenshot.gif" />
443+
<img alt="Sample notifications" src="https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/img/notifications_screenshot.gif" />
439444
</div>
440445
<p>You can test the behaviour of the notifications by installing this module in a demo database.
441446
Access the users form through Settings -&gt; Users &amp; Companies. You’ll see a tab called “Test web notify”, here you’ll find two buttons that’ll allow you test the module.</p>
442447
<div class="figure">
443-
<img alt="Sample notifications" src="https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/description/test_notifications_demo.png" />
448+
<img alt="Sample notifications" src="https://raw.githubusercontent.com/OCA/web/16.0/web_notify/static/img/test_notifications_demo.png" />
444449
</div>
445450
</div>
446451
<div class="section" id="bug-tracker">
@@ -477,7 +482,9 @@ <h2><a class="toc-backref" href="#toc-entry-6">Contributors</a></h2>
477482
<div class="section" id="maintainers">
478483
<h2><a class="toc-backref" href="#toc-entry-7">Maintainers</a></h2>
479484
<p>This module is maintained by the OCA.</p>
480-
<a class="reference external image-reference" href="https://odoo-community.org"><img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" /></a>
485+
<a class="reference external image-reference" href="https://odoo-community.org">
486+
<img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" />
487+
</a>
481488
<p>OCA, or the Odoo Community Association, is a nonprofit organization whose
482489
mission is to support the collaborative development of Odoo features and
483490
promote its widespread use.</p>

‎web_notify/static/description/notifications_screenshot.gif

-211 KB
Binary file not shown.

‎web_notify/static/img/notifications_screenshot.gif

210 KB
Loading

‎web_notify/static/description/test_notifications_demo.png ‎web_notify/static/img/test_notifications_demo.png

File renamed without changes.

‎web_notify/static/src/js/services/notification_services.esm.js

+17-7
Original file line numberDiff line numberDiff line change
@@ -10,33 +10,43 @@ export const webNotificationService = {
1010
let webNotifTimeouts = {};
1111
/**
1212
* Displays the web notification on user's screen
13+
* @param {*} notifications
1314
*/
1415
function displaywebNotification(notifications) {
1516
Object.values(webNotifTimeouts).forEach((notif) =>
1617
browser.clearTimeout(notif)
1718
);
1819
webNotifTimeouts = {};
19-
notifications.forEach(function (notif) {
20-
browser.setTimeout(function () {
21-
let buttons = [];
22-
20+
notifications.forEach((notif) => {
21+
browser.setTimeout(() => {
22+
var buttons = [];
2323
if (notif.action) {
24+
const params =
25+
(notif.action.context && notif.action.context.params) || {};
2426
buttons = [
2527
{
26-
name: env._t("Open"),
28+
name: params.button_name || env._t("Open"),
2729
primary: true,
2830
onClick: async () => {
2931
await action.doAction(notif.action);
3032
},
33+
...(params.button_icon && {icon: params.button_icon}),
3134
},
3235
];
3336
}
34-
notification.add(Markup(notif.message), {
37+
const notificationRemove = notification.add(Markup(notif.message), {
3538
title: notif.title,
3639
type: notif.type,
3740
sticky: notif.sticky,
3841
className: notif.className,
39-
buttons: buttons,
42+
buttons: buttons.map((button) => {
43+
const onClick = button.onClick;
44+
button.onClick = async () => {
45+
await onClick();
46+
notificationRemove();
47+
};
48+
return button;
49+
}),
4050
});
4151
});
4252
});

0 commit comments

Comments
 (0)