[FIX] mail: various UI fixes/improvements

- don't print chat windows
- add missing 'width: 100%' on composer and Discuss sidebar inputs (required
  for community edition)
- center the Discuss sidebar inputs
- Discuss sidebar items layout: one line, text ellipsis if name is too long
- hide chatter in 'create' mode (messages wrote in the chatter need a res_model
  and a res_id, the latter is not yet existing if we are in 'create' mode)
- revert 2d2dacc: print chatter by default (classname 'hidden-print' can be
  used for specific models for which we don't want the chatter to be printed)
- thread: ensure the displayed message's date is in the past
- re-render threads every minutes to update dates
- don't squash messages in mass mailing channels

addons/mail/static/src/js/chatter.js

@@ -726,6 +726,16 @@ var Chatter = form_common.AbstractField.extend({
     start: function () {
         var self = this;
 
+        // Hide the chatter in 'create' mode
+        this.view.on("change:actual_mode", this, this.check_visibility);
+        this.check_visibility();
+        var $container = this.$el.parent();
+        if ($container.hasClass('oe_chatter')) {
+            this.$el
+                .addClass($container.attr("class"))
+                .unwrap();
+        }
+
         // Move the follower's widget (if any) inside the chatter
         this.followers = this.field_manager.fields.message_follower_ids;
         if (this.followers) {
@@ -759,6 +769,10 @@ var Chatter = form_common.AbstractField.extend({
         });
     },
 
+    check_visibility: function () {
+        this.set({"force_invisible": this.view.get("actual_mode") === "create"});
+    },
+
     fetch_and_render_thread: function (ids, options) {
         var self = this;
         options = options || {};

addons/mail/static/src/js/client_action.js

@@ -435,7 +435,7 @@ var ChatAction = Widget.extend(ControlPanelMixin, {
             display_load_more: !chat_manager.all_history_loaded(this.channel, this.domain),
             display_needactions: this.channel.display_needactions,
             messages_separator_position: this.messages_separator_position,
-            squash_close_messages: this.channel.type !== 'static',
+            squash_close_messages: this.channel.type !== 'static' && !this.channel.mass_mailing,
             display_empty_channel: !messages.length && !this.domain.length,
             display_no_match: !messages.length && this.domain.length,
             display_subject: this.channel.mass_mailing || this.channel.id === "channel_inbox",

addons/mail/static/src/js/thread.js

@@ -58,6 +58,8 @@ var Thread = Widget.extend({
     },
 
     render: function (messages, options) {
+        clearTimeout(this.auto_render_timeout);
+        var self = this;
         var msgs = _.map(messages, this._preprocess_message.bind(this));
         if (this.options.display_order === ORDER.DESC) {
             msgs.reverse();
@@ -83,6 +85,12 @@ var Thread = Widget.extend({
             options: options,
             ORDER: ORDER,
         }));
+
+        this.auto_render_timeout = setTimeout(function () {
+            if (!self.isDestroyed()) {
+                self.render(messages, options);
+            }
+        }, 1000*60); // re-render the thread every minute to update dates
     },
 
     on_click_redirect: function (event) {
@@ -110,7 +118,7 @@ var Thread = Widget.extend({
     _preprocess_message: function (message) {
         var msg = _.extend({}, message);
 
-        // Set the date in the browser timezone
+        msg.date = moment.min(msg.date, moment());
         var date = msg.date.format('YYYY-MM-DD');
 
         if (date === moment().format('YYYY-MM-DD')) {

addons/mail/static/src/less/chat_window.less

@@ -23,6 +23,10 @@
         }
     }
 
+    @media print {
+        display: none;
+    }
+
     .o_chat_header {
         .o-flex-display();
         .o-flex(0, 0, auto);

addons/mail/static/src/less/chatter.less

@@ -131,9 +131,3 @@
         list-style: none;
     }
 }
-
-@media print {
-    .oe_chatter {
-        display: none;
-    }
-}

addons/mail/static/src/less/client_action.less

@@ -67,10 +67,18 @@
             }
         }
         .o_mail_chat_channel_item {
+            .o-flex-display();
             width: 100%;
             padding: 2px 8px 2px 1.5*@odoo-horizontal-padding; // larger padding-left than titles
-            > .badge {
-                margin: 0;
+            .o_channel_name {
+                .o-flex(1, 1, auto);
+                .o-text-overflow();
+            }
+            .o_mail_sidebar_needaction, .o_mail_partner_unpin {
+                .o-flex(0, 0, auto);
+            }
+            .o_mail_sidebar_needaction {
+                margin: 0 0 0 5px;
             }
             .o_mail_partner_unpin {
                 padding: 2px 6px;
@@ -82,10 +90,11 @@
         }
         .o_mail_add_channel {
             width: 100%;
-            padding: 5px 8px 5px 1.5*@odoo-horizontal-padding; // larger padding-left than titles
+            padding: 5px 1.5*@odoo-horizontal-padding; // larger padding-left than titles
             position: relative;
 
             > input {
+                width: 100%;
                 padding: 2px 5px;
                 padding-left: 12px;
             }
@@ -172,8 +181,6 @@
         opacity: 0.9;
 
         .o_mail_chat_channel_item {
-            overflow: hidden;
-            text-overflow: ellipsis;
             cursor: pointer;
 
             &:hover {

addons/mail/static/src/less/composer.less

@@ -11,6 +11,7 @@
 
 .o_composer {
     .o_composer_input > textarea {
+        width: 100%;
         resize: none;
     }
 }

addons/mail/static/src/xml/client_action.xml

@@ -19,13 +19,13 @@
         <div class="o_mail_chat_sidebar">
             <div t-attf-class="o_mail_chat_channel_item #{(active_channel_id == 'channel_inbox') ? 'o_active': ''}"
                  data-channel-id="channel_inbox">
-                @ Inbox
+                <span class="o_channel_name"> <i class="fa fa-at"/> Inbox </span>
                 <t t-set="counter" t-value="needaction_counter"/>
                 <t t-call="mail.chat.SidebarNeedaction"/>
             </div>
             <div t-attf-class="o_mail_chat_channel_item #{(active_channel_id == 'channel_starred') ? 'o_active': ''}"
                  data-channel-id="channel_starred">
-                <span class="fa fa-star-o"/> Starred
+                <span class="o_channel_name"> <i class="fa fa-star-o"/> Starred </span>
             </div>
 
             <t t-set="channel_type" t-value="'public'"/>
@@ -57,7 +57,7 @@
         </div>
     </t>
     <t t-name="mail.chat.SidebarNeedaction">
-        <span t-attf-class="o_mail_sidebar_needaction badge pull-right #{(!counter ? 'hide' : '')}">
+        <span t-attf-class="o_mail_sidebar_needaction badge #{(!counter ? 'hide' : '')}">
             <t t-esc="counter"/>
         </span>
     </t>
@@ -82,18 +82,20 @@
     <t t-name="mail.chat.SidebarItems">
         <t t-foreach="channels" t-as="channel">
             <t t-set="counter" t-value="channel.is_chat ? channel.unread_counter : channel.needaction_counter"/>
-            <div t-if="channel.type === channel_type" t-att-data-channel-id="channel.id"
+            <div t-if="channel.type === channel_type" t-att-data-channel-id="channel.id" t-att-title="channel.name"
                  t-attf-class="o_mail_chat_channel_item #{channel.unread_counter ? ' o_unread_message' : ''} #{(active_channel_id == channel.id) ? 'o_active': ''}">
-                <span t-if="display_status">
-                    <t t-call="mail.chat.UserStatus">
-                        <t t-set="status" t-value="channel.status"/>
-                    </t>
+                <span class="o_channel_name">
+                    <span t-if="display_status">
+                        <t t-call="mail.chat.UserStatus">
+                            <t t-set="status" t-value="channel.status"/>
+                        </t>
+                    </span>
+                    <span t-if="display_hash" class="o_mail_hash">#</span>
+                    <t t-esc="channel.name"/>
+                    <i t-if="channel.mass_mailing" class="fa fa-envelope-o" title="Sends messages by email"/>
                 </span>
-                <span t-if="display_hash" class="o_mail_hash">#</span>
-                <t t-esc="channel.name"/>
-                <i t-if="channel.mass_mailing" class="fa fa-envelope-o" title="Sends messages by email"/>
                 <t t-call="mail.chat.SidebarNeedaction"/>
-                <span t-attf-class="fa fa-times pull-right o_mail_partner_unpin #{counter ? 'hide' : ''}"
+                <span t-attf-class="fa fa-times o_mail_partner_unpin #{counter ? 'hide' : ''}"
                       title="Leave this channel" t-att-data-channel-id="channel.id"/>
             </div>
         </t>