[FIX] website{,_sale}: fix search product with several categories

This commit fixes an issue when there are several public categories on
a single product. Categories are shown side-by-side under product name
in the search bar.
This commit also fixes the issue where the `Category:X` text is matched
and highlighted whereas the search text is not used to match the product
categories.

Steps to reproduce :
    - Install eCommerce
    - Add several eCommerce Categories to a product
    - Go to shop
    - Search for the product in the searchbar
    - Traceback

Current Behavior :
    - Traceback when generating the results in the quick search bar.
      It's not expected to have several categories in the current
      implementation.
    - If all products have a unique category, then the text in
`Category:X` is matched and highlighted.

Desired Behavior :
    - No traceback
    - When there are multiple categories, an extra link should be
      present on each category rather than a unique link on all
      categories.
    - The product categories don't have to be matched.

Related PR: #79258
task-2680726

closes odoo/odoo#79363

Signed-off-by: Yannick Tivisse (yti) <yti@odoo.com>

addons/website/static/src/snippets/s_searchbar/000.xml

@@ -20,9 +20,11 @@
             <div class="media-body px-3">
                 <t t-set="description" t-value="parts['description'] and widget.displayDescription and result['description']"/>
                 <t t-set="extra_link" t-value="parts['extra_link'] and widget.displayExtraLink and result['extra_link_url'] and result['extra_link']"/>
+                <t t-set="extra_link_html" t-value="parts['extra_link'] and widget.displayExtraLink and !result['extra_link_url'] and result['extra_link']"/>
                 <div t-attf-class="h6 font-weight-bold #{description ? '' : 'mb-0'}" t-out="result['name']"/>
                 <p t-if="description" class="mb-0" t-out="description"/>
                 <button t-if="extra_link" class="extra_link btn btn-link btn-sm" t-att-data-target="result['extra_link_url']" t-out="extra_link"/>
+                <t t-if="extra_link_html" t-out="extra_link_html"/>
             </div>
             <div t-if="parts['detail'] and widget.displayDetail" class="flex-shrink-0">
                 <t t-if="result['detail_strike']">

addons/website/views/website_templates.xml

@@ -2568,10 +2568,12 @@ Sitemap: <t t-esc="url_root"/>sitemap.xml
             <div class="media-body px-3">
                 <t t-set="description" t-value="result.get('description')"/>
                 <t t-set="extra_link" t-value="result.get('extra_link_url') and result.get('extra_link')"/>
+                <t t-set="extra_link_html" t-value="not result.get('extra_link_url') and result.get('extra_link')"/>
                 <div t-att-class="'h6 font-weight-bold %s' % ('' if description else 'mb-0')" t-out="result['name']"/>
                 <p t-if="description" class="mb-0" t-out="description"/>
                 <button t-if="extra_link" class="extra_link btn btn-link btn-sm" t-out="extra_link"
                     t-attf-onclick="location.href='#{result.get('extra_link_url')}';return false;"/>
+                <t t-if="extra_link_html" t-out="extra_link_html"/>
             </div>
             <div class="flex-shrink-0">
                 <t t-if="result.get('detail_strike')">

addons/website_sale/models/product_template.py

@@ -375,8 +375,7 @@ class ProductTemplate(models.Model):
             mapping['detail'] = {'name': 'price', 'type': 'html', 'display_currency': options['display_currency']}
             mapping['detail_strike'] = {'name': 'list_price', 'type': 'html', 'display_currency': options['display_currency']}
         if with_category:
-            mapping['extra_link'] = {'name': 'category', 'type': 'text', 'match': True}
-            mapping['extra_link_url'] = {'name': 'category_url', 'type': 'text'}
+            mapping['extra_link'] = {'name': 'category', 'type': 'html'}
         return {
             'model': 'product.template',
             'base_domain': domains,
@@ -401,9 +400,10 @@ class ProductTemplate(models.Model):
             if with_image:
                 data['image_url'] = '/web/image/product.template/%s/image_128' % data['id']
             if with_category and product.public_categ_ids:
-                data['category'] = _('Category: %s', product.public_categ_ids.name)
-                slugs = [slug(category) for category in product.public_categ_ids]
-                data['category_url'] = '/shop/category/%s' % ','.join(slugs)
+                data['category'] = self.env['ir.ui.view'].sudo()._render_template(
+                    "website_sale.product_category_extra_link",
+                    {'categories': product.public_categ_ids, 'slug': slug}
+                )
         return results_data
 
     @api.model

addons/website_sale/views/templates.xml

@@ -1985,4 +1985,15 @@
             <t t-set="html_data" t-value="dict(html_data, **{'data-add2cart-redirect': website.cart_add_on_page and '1' or '0'})"/>
         </xpath>
     </template>
+
+    <template id="product_category_extra_link" name="Product Category Extra Link">
+        <button  class="btn btn-link btn-sm pr-0" disabled="disabled">
+            <t t-if="len(categories) == 1">Category:</t>
+            <t t-else="">Categories:</t>
+        </button>
+        <t t-foreach="categories" t-as="category">
+            <button class="btn btn-link btn-sm p-0" t-out="category.name"
+                t-attf-onclick="location.href='/shop/category/#{slug(category)}';return false;"/>
+        </t>
+    </template>
 </odoo>