[IMP] website_event, event: Add event.tag.category and event.tag + rename event.type display name

This commit changes the display name for the model event.type from
"Event Category" to "Event Template"

This change was needed before introducing the new model event.tag.category
which will be used to group tags (event.tag)

This commit introduces two new models: event.tag.category & event.tag

The tags will be grouped by category and will be used to filter events.

In the front-end, if the user activates the "filter by categories", each
event.tag.category will generate a new dropdown of related tags.
Clicking on one of these tags will add a new "tag badge" above the events
(same way as in eLearning).

LINKS:

TaskID:2162438
PR: #43856

addons/event/__manifest__.py

@@ -32,6 +32,7 @@ Key Features
         'views/res_config_settings_views.xml',
         'views/event_templates.xml',
         'views/res_partner_views.xml',
+        'views/event_tag_views.xml'
     ],
     'demo': [
         'data/res_users_demo.xml',

addons/event/data/event_demo.xml

@@ -25,6 +25,50 @@
         <field name="default_timezone">Europe/Brussels</field>
     </record>
 
+    <!-- Category and Tags -->
+    <record id="event_tag_category_1" model="event.tag.category">
+        <field name="name">Age</field>
+    </record>
+
+    <record id="event_tag_category_2" model="event.tag.category">
+        <field name="name">Activity</field>
+    </record>
+
+    <record id="event_tag_category_1_tag_1" model="event.tag">
+        <field name="name">5-10</field>
+        <field name="category_id" ref="event_tag_category_1"/>
+    </record>
+
+    <record id="event_tag_category_1_tag_2" model="event.tag">
+        <field name="name">10-14</field>
+        <field name="category_id" ref="event_tag_category_1"/>
+    </record>
+
+    <record id="event_tag_category_1_tag_3" model="event.tag">
+        <field name="name">15-18</field>
+        <field name="category_id" ref="event_tag_category_1"/>
+    </record>
+
+    <record id="event_tag_category_1_tag_4" model="event.tag">
+        <field name="name">18+</field>
+        <field name="category_id" ref="event_tag_category_1"/>
+    </record>
+
+    <record id="event_tag_category_2_tag_1" model="event.tag">
+        <field name="name">Culture</field>
+        <field name="category_id" ref="event_tag_category_2"/>
+    </record>
+
+    <record id="event_tag_category_2_tag_2" model="event.tag">
+        <field name="name">Music</field>
+        <field name="category_id" ref="event_tag_category_2"/>
+    </record>
+
+    <record id="event_tag_category_2_tag_3" model="event.tag">
+        <field name="name">Sport</field>
+        <field name="category_id" ref="event_tag_category_2"/>
+    </record>
+
     <!-- Event -->
     <record id="event.event_0" model="event.event">
         <field name="name">Design Fair Los Angeles</field>
@@ -37,6 +81,7 @@
         <field name="date_tz">US/Pacific</field>
         <field name="event_type_id" ref="event_type_0"/>
         <field name="stage_id" ref="event_stage_booked"/>
+        <field name="tag_ids" eval="[(6, 0, [event_tag_category_1_tag_1,event_tag_category_2_tag_1])]"/>
     </record>
     <record id="event_0_ticket_0" model="event.event.ticket">
         <field name="name">Free</field>
@@ -72,6 +117,7 @@
         <field name="address_id" ref="event.res_partner_location_0"/>
         <field name="stage_id" ref="event_stage_booked"/>
         <field name="kanban_state">blocked</field>
+        <field name="tag_ids" eval="[(6, 0, [event_tag_category_1_tag_4,event_tag_category_2_tag_3])]"/>
     </record>
 
     <record id="message_event_1_0" model="mail.message">
@@ -125,6 +171,7 @@
         <field name="seats_availability">limited</field>
         <field name="seats_max">200</field>
         <field name="stage_id" ref="event_stage_booked"/>
+        <field name="tag_ids" eval="[(6, 0, [event_tag_category_1_tag_4,event_tag_category_2_tag_1])]"/>
     </record>
     <record id="event_2_ticket_1" model="event.event.ticket">
         <field name="name">Standard</field>
@@ -160,6 +207,7 @@
         <field name="event_type_id" ref="event_type_0"/>
         <field name="address_id" ref="event.res_partner_location_1"/>
         <field name="stage_id" ref="event_stage_announced"/>
+        <field name="tag_ids" eval="[(6, 0, [event_tag_category_1_tag_3,event_tag_category_2_tag_2])]"/>
     </record>
     <record id="event_3_ticket_0" model="event.event.ticket">
         <field name="name">Standard</field>
@@ -200,6 +248,7 @@
         <field name="event_type_id" ref="event_type_1"/>
         <field name="stage_id" ref="event_stage_done"/>
         <field name="kanban_state">done</field>
+        <field name="tag_ids" eval="[(6, 0, [event_tag_category_1_tag_4,event_tag_category_2_tag_1])]"/>
     </record>
     <record id="event_4_ticket_0" model="event.event.ticket">
         <field name="name">General Admission</field>
@@ -224,6 +273,7 @@
         <field eval="(DateTime.today()+ timedelta(days=371)).strftime('%Y-%m-%d 17:00:00')" name="date_end"/>
         <field name="event_type_id" ref="event_type_2"/>
         <field name="address_id" ref="event.res_partner_location_1"/>
+        <field name="tag_ids" eval="[(6, 0, [event_tag_category_1_tag_2,event_tag_category_2_tag_3])]"/>
     </record>
 
     <record id="event.event_6" model="event.event">

addons/event/models/__init__.py

@@ -5,6 +5,7 @@ from . import event_event
 from . import event_mail
 from . import event_registration
 from . import event_stage
+from . import event_tag
 from . import event_ticket
 from . import res_config_settings
 from . import res_partner

addons/event/models/event_event.py

@@ -21,10 +21,10 @@ except ImportError:
 
 class EventType(models.Model):
     _name = 'event.type'
-    _description = 'Event Category'
+    _description = 'Event Template'
     _order = 'sequence, id'
 
-    name = fields.Char('Event Category', required=True, translate=True)
+    name = fields.Char('Event Template', required=True, translate=True)
     sequence = fields.Integer()
     # tickets
     use_ticket = fields.Boolean('Ticketing')
@@ -32,6 +32,7 @@ class EventType(models.Model):
         'event.type.ticket', 'event_type_id',
         string='Tickets', compute='_compute_event_type_ticket_ids',
         readonly=False, store=True)
+    tag_ids = fields.Many2many('event.tag', string="Tags", copy=True)
     # registration
     has_seats_limitation = fields.Boolean('Limited Seats')
     seats_max = fields.Integer(
@@ -91,7 +92,6 @@ class EventType(models.Model):
             if not template.has_seats_limitation:
                 template.seats_max = 0
 
-
 class EventEvent(models.Model):
     """Event"""
     _name = 'event.event'
@@ -118,11 +118,13 @@ class EventEvent(models.Model):
         'res.partner', string='Organizer', tracking=True,
         default=lambda self: self.env.company.partner_id,
         domain="['|', ('company_id', '=', False), ('company_id', '=', company_id)]")
-    event_type_id = fields.Many2one('event.type', string='Category', ondelete='set null')
+    event_type_id = fields.Many2one('event.type', string='Template', ondelete='set null')
     color = fields.Integer('Kanban Color Index')
     event_mail_ids = fields.One2many(
         'event.mail', 'event_id', string='Mail Schedule', copy=True,
         compute='_compute_from_event_type', readonly=False, store=True)
+    tag_ids = fields.Many2many('event.tag', string="Tags", readonly=False,
+        copy=True, store=True, compute="_compute_from_event_type")
     # Kanban fields
     kanban_state = fields.Selection([('normal', 'In Progress'), ('done', 'Done'), ('blocked', 'Blocked')], default='normal')
     kanban_state_label = fields.Char(
@@ -379,6 +381,9 @@ class EventEvent(models.Model):
                         })
                     for line in event.event_type_id.event_type_ticket_ids]
 
+            if event.event_type_id.tag_ids:
+                event.tag_ids = event.event_type_id.tag_ids
+
     @api.constrains('seats_max', 'seats_available', 'seats_availability')
     def _check_seats_limit(self):
         if any(event.seats_availability == 'limited' and event.seats_max and event.seats_available < 0 for event in self):

addons/event/models/event_tag.py

@@ -0,0 +1,26 @@
+# -*- coding: utf-8 -*-
+# Part of Odoo. See LICENSE file for full copyright and licensing details.
+
+from odoo import _, api, fields, models
+
+
+class EventTagCategory(models.Model):
+    _name = "event.tag.category"
+    _description = "Event Tag Category"
+    _order = "sequence"
+
+    name = fields.Char("Name", required=True, translate=True)
+    sequence = fields.Integer('Sequence', default=0)
+    tag_ids = fields.One2many('event.tag', 'category_id', string="Tags")
+
+class EventTag(models.Model):
+    _name = "event.tag"
+    _description = "Event Tag"
+    _order = "sequence"
+
+    name = fields.Char("Name", required=True, translate=True)
+    sequence = fields.Integer('Sequence', default=0)
+    category_id = fields.Many2one("event.tag.category", string="Category", required=True, ondelete='cascade')
+
+    def name_get(self):
+        return [(tag.id, _("%s: %s" % (tag.category_id.name, tag.name))) for tag in self]

addons/event/security/ir.model.access.csv

@@ -19,3 +19,7 @@ access_event_type_mail_event_user,event.type.mail.event.user,model_event_type_ma
 access_event_type_mail_event_manager,event.type.mail.event.manager,model_event_type_mail,event.group_event_manager,1,1,1,1
 access_event_stage_user,event.stage.user,model_event_stage,event.group_event_user,1,1,1,1
 access_event_stage_manager,event.stage.manager,model_event_stage,event.group_event_manager,1,1,1,1
+access_event_category,event.tag.category,model_event_tag_category,event.group_event_user,1,0,0,0
+access_event_category_manager,event.tag.category manager,model_event_tag_category,event.group_event_manager,1,1,1,1
+access_event_tag,event.tag,model_event_tag,event.group_event_user,1,0,0,0
+access_event_tag_manager,event.tag manager,model_event_tag,event.group_event_manager,1,1,1,1

addons/event/views/event_menu_views.xml

@@ -28,7 +28,7 @@
         sequence="99"
         parent="event_main_menu"
         groups="event.group_event_user"/>
-    <menuitem name="Event Categories"
+    <menuitem name="Event Templates"
         id="menu_event_type"
         sequence="1"
         parent="menu_event_configuration"/>
@@ -37,5 +37,9 @@
         sequence="10"
         parent="menu_event_configuration"
         groups="base.group_no_one"/>
+    <menuitem name="Event Tags Categories"
+        id="menu_event_category"
+        sequence="20"
+        parent="menu_event_configuration"/>
 
 </data></odoo>

addons/event/views/event_tag_views.xml

@@ -0,0 +1,79 @@
+<?xml version="1.0"?>
+<odoo>
+    <data>
+        <!-- EVENT.TAG.CATEGORY VIEWS -->
+        <record id="event_tag_category_view_tree" model="ir.ui.view">
+            <field name="name">event.tag.category.view.tree</field>
+            <field name="model">event.tag.category</field>
+            <field name="arch" type="xml">
+                <tree string="Event Category">
+                    <field name="sequence" widget="handle"/>
+                    <field name="name"/>
+                    <field name="tag_ids" widget="many2many_tags" />
+                </tree>
+            </field>
+        </record>
+
+        <record id="event_tag_category_view_form" model="ir.ui.view">
+            <field name="name">event.tag.category.view.form</field>
+            <field name="model">event.tag.category</field>
+            <field name="arch" type="xml">
+                <form string="Event Category">
+                    <sheet>
+                        <div class="oe_title">
+                            <h1><field nolabel="1" name="name"/></h1>
+                        </div>
+                        <group>
+                            <field name="tag_ids" context="{'default_category_id': active_id}">
+                                <tree string="Tags" editable="bottom">
+                                    <field name="sequence" widget="handle"/>
+                                    <field name="name"/>
+                                </tree>
+                            </field>
+                        </group>
+                    </sheet>
+                </form>
+            </field>
+        </record>
+
+        <record id="event_tag_category_action_tree" model="ir.actions.act_window" >
+            <field name="name">Event Tags Categories</field>
+            <field name="res_model">event.tag.category</field>
+            <field name="view_mode">tree,form</field>
+        </record>
+
+        <!-- EVENT.TAG VIEWS -->
+        <record id="event_tag_view_tree" model="ir.ui.view">
+            <field name="name">event.tag.view.tree</field>
+            <field name="model">event.tag</field>
+            <field name="arch" type="xml">
+                <tree string="Event Tags Categories">
+                    <field name="sequence" widget="handle"/>
+                    <field name="name"/>
+                    <field name="category_id"/>
+                </tree>
+            </field>
+        </record>
+
+        <record id="event_tag_view_form" model="ir.ui.view">
+            <field name="name">event.tag.view.form</field>
+            <field name="model">event.tag</field>
+            <field name="arch" type="xml">
+                <form string="Event Category Tag">
+                    <sheet>
+                        <div class="oe_title">
+                            <label for="name" class="oe_edit_only"/>
+                            <h1><field name="name"/></h1>
+                        </div>
+                        <field name="category_id" widget="many2one"/>
+                    </sheet>
+                </form>
+            </field>
+        </record>
+
+        <record id="menu_event_category" model="ir.ui.menu">
+            <field name="action" ref="event.event_tag_category_action_tree"/>
+        </record>
+
+    </data>
+</odoo>

addons/event/views/event_views.xml

@@ -86,6 +86,10 @@
                                     </div>
                                 </div>
                             </div>
+                            <div class="col-12 col-lg-6 o_setting_box" >
+                                <label for="tag_ids" string="Tags"/>
+                                <field name="tag_ids" widget="many2many_tags" options="{'no_quick_create': True}"/>
+                            </div>
                         </div>
                         <h2>Attendees</h2>
                         <div class="row mt16 o_settings_container" name="event_type_attendees">
@@ -131,7 +135,7 @@
             <field name="name">event.type.tree</field>
             <field name="model">event.type</field>
             <field name="arch" type="xml">
-                <tree string="Event Category">
+                <tree string="Event Template">
                     <field name="sequence" widget="handle"/>
                     <field name="name"/>
                 </tree>
@@ -142,7 +146,7 @@
             <field name="name">event.type.search</field>
             <field name="model">event.type</field>
             <field name="arch" type="xml">
-                <search string="Event Categories">
+                <search string="Event Templates">
                     <field name="name"/>
                     <filter string="Online Event" name="online_event" help="Online Event" domain="[('is_online', '=', True)]"/>
                 </search>
@@ -150,7 +154,7 @@
         </record>
 
         <record model="ir.actions.act_window" id="action_event_type">
-            <field name="name">Event Categories</field>
+            <field name="name">Event Templates</field>
             <field name="res_model">event.type</field>
         </record>
 
@@ -227,6 +231,7 @@
                             </group>
                             <group>
                                 <field name="event_type_id" options="{'no_create':True}"/>
+                                <field name="tag_ids" widget="many2many_tags" options="{'no_quick_create': True}"/>
                                 <field name="auto_confirm" groups="base.group_no_one"/>
                             </group>
                             <group>
@@ -446,7 +451,7 @@
                         domain="[('activity_ids.date_deadline', '&gt;', context_today().strftime('%Y-%m-%d'))]"/>
                     <group expand="0" string="Group By">
                         <filter string="Responsible" name="responsible" context="{'group_by': 'user_id'}"/>
-                        <filter string="Event Category" name="event_type_id" context="{'group_by': 'event_type_id'}"/>
+                        <filter string="Template" name="event_type_id" context="{'group_by': 'event_type_id'}"/>
                         <filter string="Stage" name="stage_id" context="{'group_by': 'stage_id'}"/>
                         <filter string="Start Date" name="date_begin" domain="[]" context="{'group_by': 'date_begin'}"/>
                     </group>

addons/website_event/controllers/main.py

@@ -5,6 +5,8 @@ import re
 import werkzeug
 from werkzeug.datastructures import OrderedMultiDict
 
+from ast import literal_eval
+from collections import defaultdict
 from datetime import datetime, timedelta
 from dateutil.relativedelta import relativedelta
 
@@ -12,6 +14,7 @@ from odoo import fields, http, _
 from odoo.addons.http_routing.models.ir_http import slug
 from odoo.addons.website.controllers.main import QueryURL
 from odoo.http import request
+from odoo.osv import expression
 from odoo.tools.misc import get_lang, format_date
 
 
@@ -28,6 +31,7 @@ class WebsiteEventController(http.Controller):
 
         searches.setdefault('search', '')
         searches.setdefault('date', 'all')
+        searches.setdefault('tags', '')
         searches.setdefault('type', 'all')
         searches.setdefault('country', 'all')
 
@@ -70,6 +74,19 @@ class WebsiteEventController(http.Controller):
         if searches['search']:
             domain_search['search'] = [('name', 'ilike', searches['search'])]
 
+        search_tags = self._extract_searched_event_tags(searches)
+        if search_tags:
+            # Example: You filter on age: 10-12 and activity: football.
+            # Doing it this way allows to only get events who are tagged "age: 10-12" AND "activity: football".
+            # Add another tag "age: 12-15" to the search and it would fetch the ones who are tagged:
+            # ("age: 10-12" OR "age: 12-15") AND "activity: football
+            grouped_tags = defaultdict(list)
+            for tag in search_tags:
+                grouped_tags[tag.category_id].append(tag)
+            domain_search['tags'] = []
+            for group in grouped_tags:
+                domain_search['tags'] = expression.AND([domain_search['tags'], [('tag_ids', 'in', [tag.id for tag in grouped_tags[group]])]])
+
         current_date = None
         current_type = None
         current_country = None
@@ -102,11 +119,6 @@ class WebsiteEventController(http.Controller):
                 date[3] = Event.search_count(dom_without('date') + date[2])
 
         domain = dom_without('type')
-        types = Event.read_group(domain, ["id", "event_type_id"], groupby=["event_type_id"], orderby="event_type_id")
-        types.insert(0, {
-            'event_type_id_count': sum([int(type['event_type_id_count']) for type in types]),
-            'event_type_id': ("all", _("All Categories"))
-        })
 
         domain = dom_without('country')
         countries = Event.read_group(domain, ["id", "country_id"], groupby="country_id", orderby="country_id")
@@ -141,10 +153,11 @@ class WebsiteEventController(http.Controller):
             'current_type': current_type,
             'event_ids': events,  # event_ids used in website_event_track so we keep name as it is
             'dates': dates,
-            'types': types,
+            'categories': request.env['event.tag.category'].search([]),
             'countries': countries,
             'pager': pager,
             'searches': searches,
+            'search_tags': search_tags,
             'keep': keep,
         }
 
@@ -342,3 +355,15 @@ class WebsiteEventController(http.Controller):
             'google_url': urls.get('google_url'),
             'iCal_url': urls.get('iCal_url')
         })
+
+    def _extract_searched_event_tags(self, searches):
+        tags = request.env['event.tag']
+        if searches.get('tags'):
+            try:
+                tag_ids = literal_eval(searches['tags'])
+            except:
+                pass
+            else:
+                # perform a search to filter on existing / valid tags implicitely
+                tags = request.env['event.tag'].search([('id', 'in', tag_ids)])
+        return tags

addons/website_event/security/ir.model.access.csv

@@ -4,3 +4,5 @@ access_event_event_portal,event.event.portal,event.model_event_event,base.group_
 access_event_type_public,event.type.public,event.model_event_type,,1,0,0,0
 access_event_event_ticket_public,event.event.ticket.public,event.model_event_event_ticket,base.group_public,1,0,0,0
 access_event_event_ticket_portal,event.event.ticket.portal,event.model_event_event_ticket,base.group_portal,1,0,0,0
+access_event_category_public,event.tag.category.public,event.model_event_tag_category,,1,0,0,0
+access_event_tag_public,event.tag.public,event.model_event_tag,,1,0,0,0

addons/website_event/static/src/scss/website_event.scss

@@ -1,11 +1,3 @@
-.o_wevent_event_searchbar_form {
-    flex: 0 0 100%;
-
-    @include media-breakpoint-up(lg) {
-       flex: 0 0 33%;
-    }
-}
-
 .o_wevent_index_topbar_filters {
     .dropdown-toggle {
         border: $border-width solid gray('400');

addons/website_event/views/event_templates.xml

@@ -15,6 +15,9 @@
             <!-- Content -->
             <div t-attf-class="o_wevent_events_list #{opt_events_list_cards and 'opt_event_list_cards_bg'}">
                 <div class="container">
+                    <div class="row">
+                        <t t-call="website_event.searched_tags"/>
+                    </div>
                     <div class="row">
                         <div id="o_wevent_index_main_col" t-attf-class="col-md my-5 #{opt_events_list_columns and 'opt_events_list_columns' or 'opt_events_list_rows'}">
                             <div class="row">
@@ -42,20 +45,40 @@
 <template id="index_topbar" name="Topbar">
     <nav class="navbar navbar-light border-top shadow-sm d-print-none">
         <div class="container">
-            <span class="navbar-brand h4 my-0 mr-4">Events</span>
-            <ul class="o_wevent_index_topbar_filters nav mr-n2"/>
-            <t t-call="website_event.events_search_box">
-                <t t-set="_classes" t-value="'ml-auto pl-lg-3'"/>
-                <t t-set="_searches" t-value="searches"/>
-            </t>
+            <div class="row d-flex justify-content-between w-100 mr-0">
+                <div class="col-lg-8 col-sm-12">
+                    <span class="navbar-brand h4 my-0">Events</span>
+                    <ul class="o_wevent_index_topbar_filters nav"/>
+                </div>
+                <div class="col-lg-3 col-sm-12 d-flex align-items-center flex-wrap px16">
+                    <t t-call="website_event.events_search_box">
+                        <t t-set="_searches" t-value="searches"/>
+                    </t>
+                    <a href="/event" class="btn btn-info text-nowrap mr-0 w-100" role="button" title="Clear filters">
+                        <i class="fa fa-eraser"/> Clear filters
+                    </a>
+                </div>
+            </div>
         </div>
     </nav>
 </template>
 
+<template id="searched_tags" name="Searched tags">
+    <div class="d-flex align-items-center mt16">
+        <t t-foreach="search_tags" t-as="tag">
+            <span class="align-items-baseline border d-inline-flex pl-2 rounded ml16 mb-2 bg-white">
+                <i class="fa fa-tag mr-2 text-muted"/>
+                <t t-esc="tag.display_name"/>
+                <a t-att-href="'/event?%s' % keep_query('*', tags=str((search_tags - tag).ids))" class="btn border-0 py-1">&#215;</a>
+            </span>
+        </t>
+    </div>
+</template>
+
 <!-- Filter - Date -->
 <template id="event_time" inherit_id="website_event.index_topbar" customize_show="True" name="Filter by Date">
     <xpath expr="//ul[hasclass('o_wevent_index_topbar_filters')]" position="inside">
-        <li class="nav-item dropdown mr-2 my-1 my-lg-0">
+        <li class="nav-item dropdown mr-2 my-1">
             <a href="#" role="button" class="btn dropdown-toggle" data-toggle="dropdown">
                 <i class="fa fa-calendar"/>
                 <t t-if="current_date" t-esc="current_date"/>
@@ -75,33 +98,36 @@
     </xpath>
 </template>
 
+<<<<<<< HEAD
 <!-- Filter - Category -->
 <template id="event_category" inherit_id="website_event.index_topbar" active="False" customize_show="True" name="Filter by Category">
+=======
+<template id="event_category_tag" inherit_id="website_event.index_topbar" active="False" customize_show="True" name="Filter by Tags">
+>>>>>>> 27cb059... [IMP] website_event, event: Add event.tag.category and event.tag + rename event.type display name
     <xpath expr="//ul[hasclass('o_wevent_index_topbar_filters')]" position="inside">
-        <li class="nav-item dropdown mr-2 my-1 my-lg-0">
-            <a href="#" role="button" class="btn dropdown-toggle" data-toggle="dropdown">
-                <i class="fa fa-folder-open"/>
-                <t t-if="current_type" t-esc="current_type.name"/>
-                <t t-else="">All Categories</t>
-            </a>
-            <div class="dropdown-menu">
-                <t t-foreach="types" t-as="type">
-                    <t t-if="type['event_type_id']">
-                        <a t-att-href="keep('/event', type=type['event_type_id'][0])" t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{searches.get('type') == str(type['event_type_id'] and type['event_type_id'][0]) and 'active'}">
-                            <t t-esc="type['event_type_id'][1]"/>
-                            <span t-esc="type['event_type_id_count']" class="badge badge-pill badge-primary ml-3"/>
+        <t t-foreach="categories" t-as="category">
+            <li t-if="category.tag_ids" class="nav-item dropdown mr-2 my-1">
+                <a href="#" role="button" class="btn dropdown-toggle" data-toggle="dropdown">
+                    <i class="fa fa-folder-open"/>
+                    <t t-esc="category.name"/>
+                </a>
+                <div class="dropdown-menu">
+                    <t t-foreach="category.tag_ids" t-as="tag">
+                        <a t-att-href="'/event?%s' % keep_query('*', tags=str((search_tags - tag).ids if tag in search_tags else (tag | search_tags).ids))"
+                             t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{'active' if tag in search_tags else ''}">
+                            <t t-esc="tag.name"/>
                         </a>
                     </t>
-                </t>
-            </div>
-        </li>
+                </div>
+            </li>
+        </t>
     </xpath>
 </template>
 
 <!-- Filter - Location -->
 <template id="event_location" inherit_id="website_event.index_topbar" active="False" customize_show="True" name="Filter by Country">
     <xpath expr="//ul[hasclass('o_wevent_index_topbar_filters')]" position="inside">
-        <li class="nav-item dropdown mr-2 my-1 my-lg-0">
+        <li class="nav-item dropdown mr-2 my-1">
             <a href="#" role="button" class="btn dropdown-toggle" data-toggle="dropdown">
                 <i class="fa fa-map-marker"/>
                 <t t-if="current_country" t-esc="current_country.name"/>
@@ -130,7 +156,7 @@
 <!-- Search Box -->
 <template id="events_search_box" inherit_id="website.website_search_box" primary="True">
     <xpath expr="//div[@role='search']" position="replace">
-        <form t-attf-class="o_wevent_event_searchbar_form o_wait_lazy_js my-1 my-lg-0 #{_classes}"
+        <form t-attf-class="o_wevent_event_searchbar_form o_wait_lazy_js w-100 my-1 my-lg-0 #{_classes}"
               t-att-action="action if action else '/event'" method="get">
             <t t-set="search" t-value="search or _searches and _searches['search']"/>
             <t>$0</t>
@@ -208,6 +234,14 @@
                         </div>
                         <!-- Location -->
                         <div t-if="not event.is_online" itemprop="location" t-field="event.address_id" t-options="{'widget': 'contact', 'fields': ['city'], 'no_marker': 'true'}"/>
+                        <div class="mt8 d-flex align-items-center">
+                            <t t-foreach="event.tag_ids" t-as="tag">
+                                <a t-att-href="'/event?%s' % keep_query('*', tags=str((search_tags - tag).ids if tag in search_tags else (tag | search_tags).ids))"
+                                    t-attf-class="badge mr8 #{'badge-primary' if tag in search_tags else 'badge-light'}">
+                                    <span t-esc="tag.name"/>
+                                </a>
+                            </t>
+                        </div>
                     </main>
                 </div>
                 <!-- Footer -->
@@ -231,7 +265,7 @@
 
 <template id="opt_events_list_cards" inherit_id="website_event.events_list" active="True" customize_show="True" name="'Cards' Design"/>
 
-<template id="opt_events_list_categories" inherit_id="website_event.events_list" active="True" customize_show="True" name="Show categories">
+<template id="opt_events_list_categories" inherit_id="website_event.events_list" active="True" customize_show="True" name="Show Templates">
     <xpath expr="//main/*" position="before">
         <a t-if="event.event_type_id" t-attf-href="/event?type=#{event.event_type_id.id}" t-attf-class="badge bg-secondary o_wevent_badge #{opt_events_list_columns and 'o_wevent_badge_event' or 'float-right'}" t-field="event.event_type_id"/>
     </xpath>
@@ -290,20 +324,6 @@
     </xpath>
 </template>
 
-<!-- Index - Sidebar - Categories -->
-<template id="index_sidebar_categories" inherit_id="website_event.index_sidebar" active="True" customize_show="True" name="Categories" priority="50">
-    <xpath expr="//div[@id='o_wevent_index_sidebar']" position="inside">
-        <div class="o_wevent_sidebar_block">
-            <h6 class="o_wevent_sidebar_title">Categories</h6>
-            <t t-foreach="types" t-as="type">
-                <t t-if="type['event_type_id']">
-                    <a t-att-href="keep('/event', type=type['event_type_id'][0])" class="badge badge-secondary o_wevent_badge mb-2"><t t-esc="type['event_type_id'][1]"/></a>
-                </t>
-            </t>
-        </div>
-    </xpath>
-</template>
-
 <!-- Index - Sidebar - Quotes -->
 <template id="index_sidebar_quotes" inherit_id="website_event.index_sidebar" active="True" customize_show="True" name="Quotes" priority="60">
     <xpath expr="//div[@id='o_wevent_index_sidebar']" position="inside">