Move the logout entry and add a help entry to the notification menu

Closes #14151

sao/CHANGELOG

@@ -1,3 +1,4 @@
+* Move the logout entry and add a help entry to the notification menu
 * Add visual hint on widget of modified field
 * Add support for Python 3.14
 * Remove support for Python 3.9

sao/index.html

@@ -58,18 +58,6 @@ this repository contains the full copyright notices and license terms. -->
                         </form>
                         <ul class="nav navbar-nav navbar-right flip">
                             <li id="user-preferences" class="dropdown"></li>
-                            <li id="user-logout">
-                                <a href="#">
-                                    <span class="icon hidden-xs">
-                                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
-                                            <path d="M0 0h24v24H0z" fill="none"/>
-                                            <path d="M10.09 15.59L11.5 17l5-5-5-5-1.41 1.41L12.67 11H3v2h9.67l-2.58 2.59zM19 3H5c-1.11 0-2 .9-2 2v4h2V5h14v14H5v-4H3v4c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"/>
-                                        </svg>
-                                    </span>
-                                    <span class="visible-xs">
-                                    </span>
-                                </a>
-                            </li>
                         </ul>
                         <ul id="tablist" class="nav navbar-nav nav-pills" role="tablist">
                         </ul>

sao/src/notification.js

@@ -116,27 +116,47 @@
                         'role': 'separator',
                         'class': 'divider',
                     }));
-                let preferences_img = jQuery('<img/>', {
+                let items = [
-                    'class': 'icon',
+                    {
-                });
-                let preferences = jQuery('<li/>', {
-                    'class': 'notification-item',
-                    'role': 'presentation',
-                }).append(
-                    jQuery('<a/>', {
-                        'role': 'menuitem',
-                        'href': '#',
                         'text': Sao.i18n.gettext("Preferences..."),
-                    }).prepend(preferences_img
+                        'icon': 'tryton-launch',
-                    ).click((evt) => {
+                        'action': () => Sao.preferences(),
-                        evt.preventDefault();
+                    },
-                        Sao.preferences();
+                    {
-                    }));
+                        'text': Sao.i18n.gettext("Help..."),
-                Sao.common.ICONFACTORY.get_icon_url('tryton-launch')
+                        'icon': 'tryton-question',
-                    .then(url => {
+                        'action': () => Sao.help_dialog(),
-                        preferences_img.attr('src', url);
+                    },
+                    {
+                        'text': Sao.i18n.gettext("Logout"),
+                        'icon': 'tryton-exit',
+                        'action': () => Sao.logout(),
+                    },
+                ];
+
+                items.forEach((item) => {
+                    let item_img = jQuery('<img/>', {
+                        'class': 'icon',
                     });
-                this.el.append(preferences);
+                    Sao.common.ICONFACTORY.get_icon_url(item.icon)
+                        .then(url => {
+                            item_img.attr('src', url);
+                        });
+                    let item_li = jQuery('<li/>', {
+                        'class': 'notification-item',
+                        'role': 'presentation',
+                    }).append(
+                        jQuery('<a/>', {
+                            'role': 'menuitem',
+                            'href': '#',
+                            'text': item.text,
+                        }).prepend(item_img
+                        ).click((evt) => {
+                            evt.preventDefault();
+                            item.action();
+                        }));
+                    this.el.append(item_li);
+                });
             });
 
         }

sao/src/sao.js

@@ -785,13 +785,6 @@ var Sao = {
             }));
         }
         user.prepend(Sao.NotificationMenu.indicator);
-        var title = Sao.i18n.gettext("Logout");
-        jQuery('#user-logout > a')
-            .attr('title', title)
-            .attr('aria-label', title)
-            .off()
-            .click(Sao.logout)
-            .find('span:not(.icon)').text(title);
     };
 
     Sao.main_menu_row_activate = function() {
@@ -1194,7 +1187,7 @@ var Sao = {
                 shortcut: 'f1',
                 label: Sao.i18n.gettext('Show this help'),
                 callback: function() {
-                    help_dialog();
+                    Sao.help_dialog();
                 },
             }, {
                 shortcut: 'ctrl+f1',
@@ -1272,7 +1265,7 @@ var Sao = {
 
     var _help_dialog = null;
 
-    function help_dialog() {
+    Sao.help_dialog = function() {
         Mousetrap.pause();
         var dialog;
         if (!_help_dialog) {