[12.0][MIG] base_tier_validation: adapt systray to v12.

base_tier_validation/models/tier_definition.py

@@ -18,9 +18,9 @@ class TierDefinition(models.Model):
         return res
 
     name = fields.Char(
-        string='Description',
+        string="Description",
         required=True,
-        default=_get_default_name,
+        default=lambda self: self._get_default_name(),
         translate=True,
     )
     model_id = fields.Many2one(

base_tier_validation/models/tier_validation.py

@@ -23,10 +23,6 @@ class TierValidation(models.AbstractModel):
         domain=lambda self: [('model', '=', self._name)],
         auto_join=True,
     )
-    review_ids_dropdown = fields.One2many(
-        related='review_ids',
-        help="Field needed to display the dropdown menu correctly"
-    )
     validated = fields.Boolean(
         compute="_compute_validated_rejected",
         search="_search_validated",
@@ -174,6 +170,7 @@ class TierValidation(models.AbstractModel):
     def validate_tier(self):
         for rec in self:
             rec._validate_tier()
+        self._update_counter()
 
     @api.multi
     def reject_tier(self):
@@ -188,6 +185,7 @@ class TierValidation(models.AbstractModel):
                 'reviewed_date': fields.Datetime.now(),
             })
             rec._notify_rejected_review()
+        self._update_counter()
 
     def _notify_rejected_review_body(self):
         return _('A review was rejected by %s.') % (self.env.user.name)
@@ -230,6 +228,7 @@ class TierValidation(models.AbstractModel):
                 rec.mapped('review_ids').unlink()
                 self._update_counter()
 
+    @api.model
     def _update_counter(self):
         notifications = []
         channel = 'base.tier.validation'

base_tier_validation/static/src/js/systray.js

@@ -6,24 +6,24 @@ odoo.define('tier_validation.systray', function (require) {
     var session = require('web.session');
     var SystrayMenu = require('web.SystrayMenu');
     var Widget = require('web.Widget');
-    var bus = require('bus.bus').bus;
-
-    var chat_manager = require('mail.chat_manager');
+    var BusService = require('bus.BusService');
 
     var QWeb = core.qweb;
 
     var ReviewMenu = Widget.extend({
         template:'tier.validation.ReviewMenu',
         events: {
-            "click": "_onReviewMenuClick",
-            "click .o_mail_channel_preview": "_onReviewFilterClick",
+            "show.bs.dropdown": "_onReviewMenuShow",
+            'click .o_mail_activity_action': '_onReviewActionClick',
+            'click .o_mail_preview': '_onReviewFilterClick',
         },
         start: function () {
-            this.$reviews_preview = this.$('.o_mail_navbar_dropdown_channels');
+            this.$reviews_preview = this.$('.o_mail_systray_dropdown_items');
             this._updateReviewPreview();
             var channel = 'base.tier.validation';
-            bus.add_channel(channel);
-            bus.on('notification', this, this._updateReviewPreview);
+            this.call('bus_service', 'addChannel', channel);
+            this.call('bus_service', 'startPolling');
+            this.call('bus_service', 'onNotification', this, this._updateReviewPreview);
             return this._super();
         },
 
@@ -50,12 +50,15 @@ odoo.define('tier_validation.systray', function (require) {
             });
         },
         /**
-         * Check wether activity systray dropdown is open or not
+         * Get particular model view to redirect on click of review on that model.
          * @private
-         * @returns {boolean}
+         * @param {string} model
          */
-        _isOpen: function () {
-            return this.$el.hasClass('open');
+        _getReviewModelViewID: function (model) {
+            return this._rpc({
+                model: model,
+                method: 'get_activity_view_id'
+            });
         },
         /**
          * Update(render) activity system tray view on activity updation.
@@ -90,8 +93,20 @@ odoo.define('tier_validation.systray', function (require) {
             }
         },
 
-
+        //------------------------------------------------------------
         // Handlers
+        //------------------------------------------------------------
+
+        /**
+         * Redirect to specific action given its xml id
+         * @private
+         * @param {MouseEvent} ev
+         */
+        _onReviewActionClick: function (ev) {
+            ev.stopPropagation();
+            var actionXmlid = $(ev.currentTarget).data('action_xmlid');
+            this.do_action(actionXmlid);
+        },
 
         /**
          * Redirect to particular model view
@@ -118,18 +133,13 @@ odoo.define('tier_validation.systray', function (require) {
          * @private
          * @param {MouseEvent} event
          */
-        _onReviewMenuClick: function () {
-            if (!this._isOpen()) {
-                this._updateReviewPreview();
-            }
+        _onReviewMenuShow: function () {
+            this._updateReviewPreview();
         },
 
     });
 
     SystrayMenu.Items.push(ReviewMenu);
 
-    // to test activity menu in qunit test cases we need it
-    return {
-        ReviewMenu: ReviewMenu,
-    };
+    return ReviewMenu;
 });

base_tier_validation/static/src/less/systray.less

@@ -1,113 +0,0 @@
-// Navbar icon and dropdown
-.o_tier_navbar_item {
-    > a {
-        opacity: 1;
-        > i {
-            font-size: larger;
-        }
-    }
-    &.o_no_notification > a {
-        opacity: 0.5;
-        > i {
-            .o-transform(translateY(0px));
-        }
-        .o_notification_counter {
-            display: none;
-        }
-    }
-    &.open .o_tier_navbar_dropdown {
-        .o-flex-display();
-        .o-flex-flow(column, nowrap);
-    }
-    .o_notification_counter {
-        .o-position-absolute(@top: 20%, @right: 1px);
-        background: @odoo-brand-optional;
-        color: white;
-        padding: 0em 0.3em;
-        font-size: 0.7em;
-    }
-    .o_tier_navbar_dropdown {
-        width: 350px;
-        padding: 0;
-
-        .o_spinner {
-            .o-flex-display();
-            .o-align-items(center);
-            .o-justify-content(center);
-            color: @odoo-main-text-color;
-            height: 50px;
-        }
-
-        .o_tier_navbar_dropdown_channels {
-            .o-flex(0, 1, auto);
-            max-height: 400px;
-            min-height: 50px;
-            overflow-y: auto;
-
-            @media (min-width: @screen-sm-min) {
-                .o_tier_channel_preview {
-                    height: 50px;
-                    padding: 5px;
-                    .o_tier_channel_image {
-                        width: 40px;
-                    }
-                    .o_channel_info {
-                        margin-left: 10px;
-                        .o_channel_title {
-                            .o_last_message_date {
-                                padding-top: 2px;
-                                font-size: x-small;
-                                margin-left: 10px;
-                            }
-                        }
-                    }
-                }
-            }
-        }
-        .o_no_review {
-            cursor: initial;
-            .o-align-items(center);
-            color: grey;
-            opacity: 0.5;
-            padding: 3px;
-        }
-    }
-}
-
-.o_no_chat_window .o_tier_navbar_dropdown .o_new_message {
-    display: none;  // hide 'new message' button if chat windows are disabled
-}
-
-// Mobile rules
-// Goal: mock the design of Discuss in mobile
-@media (max-width: @screen-xs-max) {
-    .o_tier_navbar_item {
-        .o_notification_counter {
-            top: 10%;
-        }
-        .o_tier_navbar_dropdown {
-            position: relative;
-            .o_tier_navbar_dropdown_top {
-                padding: 5px;
-            }
-            .o_tier_navbar_mobile_header {
-                padding: 5px;
-                height: 44px;
-                border-bottom: 1px solid #ebebeb;
-                box-shadow: 0 0 2px @gray-lighter-darker;
-            }
-            .o_tier_navbar_dropdown_channels {
-                max-height: none;
-                padding-bottom: 52px; // leave space for tabs
-            }
-            .o_tier_mobile_tabs {
-                position: fixed;
-                bottom: 0px;
-                left: 0px;
-                right: 0px;
-                background-color: white;
-                color: @odoo-main-text-color;
-            }
-        }
-    }
-}

base_tier_validation/static/src/scss/systray.scss

@@ -0,0 +1,141 @@
+// Navbar icon and dropdown
+.o_tier_navbar_item {
+    > a {
+        opacity: 1;
+        > i {
+            font-size: larger;
+        }
+    }
+    &.o_no_notification > a {
+        opacity: 0.5;
+        > i {
+            transform: translateY(0px);
+        }
+        .o_notification_counter {
+            display: none;
+        }
+    }
+    &.show .o_tier_systray_dropdown {
+        display: flex;
+        flex-flow: column nowrap;
+    }
+    .o_notification_counter {
+        margin-top: -0.8rem;
+        margin-right: 0;
+        margin-left: -0.6rem;
+        background: #00A09D;
+        color: white;
+        vertical-align: super;
+        font-size: 0.7em;
+    }
+    .o_tier_systray_dropdown {
+        direction: ltr;
+        width: 350px;
+        padding: 0;
+
+        .o_spinner {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: $o-main-text-color;
+            height: 50px;
+        }
+
+        .o_tier_systray_dropdown_top {
+            display: flex;
+            flex: 0 0 auto;
+            justify-content: space-between;
+            border-bottom: 1px solid gray('400');
+            box-shadow: 0 0 2px gray('400');
+            .o_filter_button, .o_new_message {
+                padding: 5px;
+            }
+            .o_filter_button {
+                color: $o-main-color-muted;
+                &:hover, &.active {
+                    color: $o-brand-primary;
+                }
+                &.active {
+                    cursor: default;
+                    font-weight: bold;
+                }
+            }
+        }
+
+        .o_tier_systray_dropdown_items {
+            flex: 0 1 auto;
+            max-height: 400px;
+            min-height: 50px;
+            overflow-y: auto;
+
+            @include media-breakpoint-up(md) {
+                .o_tier_preview {
+                    min-height: 50px;
+                    padding: 5px;
+                    .o_tier_preview_image {
+                        width: 40px;
+                        height: 40px;
+                    }
+                    .o_preview_info {
+                        margin-left: 10px;
+                        .o_preview_title {
+                            .o_last_message_date {
+                                padding-top: 2px;
+                                font-size: x-small;
+                                margin-left: 10px;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        .o_activity_filter_button {
+            padding: 2px;
+        }
+        .o_no_activity {
+            cursor: initial;
+            align-items: center;
+            color: grey;
+            opacity: 0.5;
+            padding: 3px;
+        }
+    }
+}
+
+.o_no_thread_window .o_tier_systray_dropdown .o_new_message {
+    display: none;  // hide 'new message' button if chat windows are disabled
+}
+
+// Mobile rules
+// Goal: mock the design of Discuss in mobile
+@include media-breakpoint-down(sm) {
+    .o_tier_systray_item {
+        .o_notification_counter {
+            top: 10%;
+        }
+        .o_tier_systray_dropdown {
+            position: relative;
+            .o_tier_systray_dropdown_top {
+                padding: 5px;
+            }
+            .o_tier_systray_mobile_header {
+                padding: 5px;
+                height: 44px;
+                border-bottom: 1px solid #ebebeb;
+                box-shadow: 0 0 2px gray('400');
+            }
+            .o_tier_systray_dropdown_items {
+                max-height: none;
+                padding-bottom: 52px; // leave space for tabs
+            }
+            .o_tier_mobile_tabs {
+                position: fixed;
+                bottom: 0px;
+                left: 0px;
+                right: 0px;
+                background-color: white;
+                color: $o-main-text-color;
+            }
+        }
+    }
+}

base_tier_validation/static/src/xml/systray.xml

@@ -3,38 +3,50 @@
 
     <t t-name="tier.validation.ReviewMenuPreview">
         <t t-if="_.isEmpty(reviews)">
-            <li class="text-center o_no_review">
+            <div class="dropdown-item-text text-center o_no_activity">
                 <span>No reviews to do.</span>
-            </li>
+            </div>
         </t>
         <t t-foreach="reviews" t-as="review">
-            <div class="o_mail_channel_preview" t-att-data-res_model="review.model" t-att-data-model_name="review.name">
-                <div class="o_mail_channel_image o_mail_channel_app">
-                    <img t-att-src="review.icon"/>
+            <div class="o_mail_preview" t-att-data-res_model="review.model" t-att-data-model_name="review.name">
+                <div class="o_mail_preview_image o_mail_preview_app">
+                    <img t-att-src="review.icon" alt="Review"/>
                 </div>
-                <div class="o_channel_info">
-                    <div class="o_channel_title">
-                        <span class="o_channel_name">
+                <div class="o_preview_info">
+                    <div class="o_preview_title">
+                        <span class="o_preview_name">
                             <t t-esc="review.name"/>
                         </span>
+                        <div t-if="review.actions" class="o_mail_activity_action_buttons">
+                            <t t-foreach="review.actions" t-as="action">
+                                <button type="button"
+                                    t-att-title="action.name"
+                                    t-att-class="'o_mail_activity_action btn btn-link fa ' + action.icon"
+                                    t-att-data-action_xmlid="action.action_xmlid"
+                                    t-att-data-res_model="review.model"
+                                    t-att-data-model_name="review.name">
+                                </button>
+                            </t>
+                        </div>
                     </div>
                     <div>
                         <button t-if="review.pending_count" type="button" class="btn btn-link o_activity_filter_button mr16" t-att-data-res_model="review.model" t-att-data-model_name="review.name" data-filter='pending_count'><t t-esc="review.pending_count"/> Pending </button>
-                        <span t-if="!review.pending_count" class="o_no_review mr16">0 Pending </span>
+                        <span t-if="!review.pending_count" class="o_no_activity mr16">0 Pending </span>
                     </div>
                 </div>
             </div>
         </t>
     </t>
 
+
     <t t-name="tier.validation.ReviewMenu">
-        <li class="o_mail_navbar_item">
-            <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" title="Reviews" href="#">
-                <i class="fa fa-pencil-square-o"/> <span class="o_notification_counter badge"/>
+        <li class="o_mail_systray_item">
+            <a class="dropdown-toggle o-no-caret" data-toggle="dropdown" data-display="static" aria-expanded="false" title="Reviews" href="#" role="button">
+                <i class="fa fa-pencil-square-o" role="img" aria-label="Activities"/> <span class="o_notification_counter badge badge-pill"/>
             </a>
-            <ul class="o_mail_navbar_dropdown dropdown-menu" role="menu">
-                <li class="o_mail_navbar_dropdown_channels"/>
-            </ul>
+            <div class="o_mail_systray_dropdown dropdown-menu dropdown-menu-right" role="menu">
+                <div class="o_mail_systray_dropdown_items"/>
+            </div>
         </li>
     </t>
 

base_tier_validation/static/src/xml/tier_review_template.xml

@@ -3,7 +3,7 @@
 
     <t t-name="tier.review.ReviewPopUp">
         <div class="dropdown btn btn-sm oe_stat_button">
-            <div class="dropdown-toggle o_info_btn" data-toggle="dropdown" style="height:100%;width:100%;display:table">
+            <div class="o_info_btn" data-toggle="dropdown" style="height:100%;width:100%;display:table">
                 <div style="display:table-cell;vertical-align:middle">
                     <div class="fa fa-fw o_button_icon fa-pencil-square-o"/>
                     <div class="o_field_widget o_stat_info o_readonly_modifier">

base_tier_validation/views/assets_backend.xml

@@ -6,8 +6,8 @@
             <script type="text/javascript" src="/base_tier_validation/static/src/js/systray.js"/>
             <script type="text/javascript" src="/base_tier_validation/static/src/js/review_widget.js"/>
 
-            <link rel="stylesheet" href="/base_tier_validation/static/src/less/systray.less" type="text/less"/>
-            <link rel="stylesheet" href="/base_tier_validation/static/src/less/review.less" type="text/less"/>
+            <link rel="stylesheet" href="/base_tier_validation/static/src/scss/systray.scss" type="text/scss"/>
+            <link rel="stylesheet" href="/base_tier_validation/static/src/scss/review.scss" type="text/scss"/>
         </xpath>
     </template>
 </odoo>