[IMP] website: simplify website menu

Some apps, once installed, automatically create a menuitem in website.
What complexify the UI and create useless menu withtout plusvalue.

It is not because you install livechat to make support online, that you want
a link in your menu to show stats e.g.

Now we remove the default menu created, and help user to find it when he create
a link. The autocomplete suggest most of the main App's controllers

task-2189613

closes odoo/odoo#49081

Related: odoo/enterprise#9733
Signed-off-by: Jérémy Kersten (jke) <jke@openerp.com>

1 files changed, 43 insertions, 10 deletions

diff --git a/addons/website/static/src/js/utils.js b/addons/website/static/src/js/utils.js
index d8e69e3eba4..7947eb6f93c 100644
--- a/addons/website/static/src/js/utils.js
+++ b/addons/website/static/src/js/utils.js
@@ -33,7 +33,35 @@ function loadAnchors(url) {
  * @param {jQuery} $input
  */
 function autocompleteWithPages(self, $input) {
-    $input.autocomplete({
+    $.widget("website.urlcomplete", $.ui.autocomplete, {
+        _create: function () {
+            this._super();
+            this.widget().menu("option", "items", "> :not(.ui-autocomplete-category)");
+        },
+        _renderMenu: function (ul, items) {
+            const self = this;
+            items.forEach(item => {
+                if (item.separator) {
+                    self._renderSeparator(ul, item);
+                }
+                else {
+                    self._renderItem(ul, item);
+                }
+            });
+        },
+        _renderSeparator: function (ul, item) {
+            return $("<li class='ui-autocomplete-category font-weight-bold text-capitalize m-2'>")
+                   .append(`<div>${item.separator}</div>`)
+                   .appendTo(ul);
+        },
+        _renderItem: function (ul, item) {
+            return $("<li>")
+                   .data('ui-autocomplete-item', item)
+                   .append(`<div>${item.label}</div>`)
+                   .appendTo(ul);
+        },
+    });
+    $input.urlcomplete({
         source: function (request, response) {
             if (request.term[0] === '#') {
                 loadAnchors(request.term).then(function (anchors) {
@@ -41,17 +69,22 @@ function autocompleteWithPages(self, $input) {
                 });
             } else {
                 return self._rpc({
-                    model: 'website',
-                    method: 'search_pages',
-                    args: [null, request.term],
-                    kwargs: {
+                    route: '/website/get_suggested_links',
+                    params: {
+                        needle: request.term,
                         limit: 15,
-                    },
-                }).then(function (exists) {
-                    var rs = _.map(exists, function (r) {
-                        return r.loc;
+                    }
+                }).then(function (res) {
+                    let choices = res.matching_pages;
+                    res.others.forEach(other => {
+                        if (other.values.length) {
+                            choices = choices.concat(
+                                [{separator: other.title}],
+                                other.values,
+                            );
+                        }
                     });
-                    response(rs.sort());
+                    response(choices);
                 });
             }
         },