initial commit 2

3 files changed, 119 insertions, 0 deletions

diff --git a/addons/mail/static/src/components/notification_popover/notification_popover.js b/addons/mail/static/src/components/notification_popover/notification_popover.js
new file mode 100644
index 00000000..6be3647e
--- /dev/null
+++ b/addons/mail/static/src/components/notification_popover/notification_popover.js
@@ -0,0 +1,95 @@
+odoo.define('mail/static/src/components/notification_popover/notification_popover.js', function (require) {
+'use strict';
+
+const { Component } = owl;
+const useShouldUpdateBasedOnProps = require('mail/static/src/component_hooks/use_should_update_based_on_props/use_should_update_based_on_props.js');
+const useStore = require('mail/static/src/component_hooks/use_store/use_store.js');
+
+class NotificationPopover extends Component {
+
+    /**
+     * @override
+     */
+    constructor(...args) {
+        super(...args);
+        useShouldUpdateBasedOnProps({
+            compareDepth: {
+                notificationLocalIds: 1,
+            },
+        });
+        useStore(props => {
+            const notifications = props.notificationLocalIds.map(
+                notificationLocalId => this.env.models['mail.notification'].get(notificationLocalId)
+            );
+            return {
+                notifications: notifications.map(notification => notification ? notification.__state : undefined),
+            };
+        }, {
+            compareDepth: {
+                notifications: 1,
+            },
+        });
+    }
+
+    /**
+     * @returns {string}
+     */
+    get iconClass() {
+        switch (this.notification.notification_status) {
+            case 'sent':
+                return 'fa fa-check';
+            case 'bounce':
+                return 'fa fa-exclamation';
+            case 'exception':
+                return 'fa fa-exclamation';
+            case 'ready':
+                return 'fa fa-send-o';
+            case 'canceled':
+                return 'fa fa-trash-o';
+        }
+        return '';
+    }
+
+    /**
+     * @returns {string}
+     */
+    get iconTitle() {
+        switch (this.notification.notification_status) {
+            case 'sent':
+                return this.env._t("Sent");
+            case 'bounce':
+                return this.env._t("Bounced");
+            case 'exception':
+                return this.env._t("Error");
+            case 'ready':
+                return this.env._t("Ready");
+            case 'canceled':
+                return this.env._t("Canceled");
+        }
+        return '';
+    }
+
+    /**
+     * @returns {mail.notification[]}
+     */
+    get notifications() {
+        return this.props.notificationLocalIds.map(
+            notificationLocalId => this.env.models['mail.notification'].get(notificationLocalId)
+        );
+    }
+
+}
+
+Object.assign(NotificationPopover, {
+    props: {
+        notificationLocalIds: {
+            type: Array,
+            element: String,
+        },
+    },
+    template: 'mail.NotificationPopover',
+});
+
+return NotificationPopover;
+
+});
diff --git a/addons/mail/static/src/components/notification_popover/notification_popover.scss b/addons/mail/static/src/components/notification_popover/notification_popover.scss
new file mode 100644
index 00000000..06b4201c
--- /dev/null
+++ b/addons/mail/static/src/components/notification_popover/notification_popover.scss
@@ -0,0 +1,7 @@
+// -----------------------------------------------------------------------------
+// Layout
+// -----------------------------------------------------------------------------
+
+.o_NotificationPopover_notificationIcon {
+    margin-inline-end: map-get($spacers, 2);
+}
diff --git a/addons/mail/static/src/components/notification_popover/notification_popover.xml b/addons/mail/static/src/components/notification_popover/notification_popover.xml
new file mode 100644
index 00000000..cf5aa027
--- /dev/null
+++ b/addons/mail/static/src/components/notification_popover/notification_popover.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+
+    <t t-name="mail.NotificationPopover" owl="1">
+        <div class="o_NotificationPopover">
+            <t t-foreach="notifications" t-as="notification" t-key="notification.localId">
+                <div class="o_NotificationPopover_notification">
+                    <i class="o_NotificationPopover_notificationIcon" t-att-class="iconClass" t-att-title="iconTitle" role="img"/>
+                    <t t-if="notification.partner">
+                        <span class="o_NotificationPopover_notificationPartnerName" t-esc="notification.partner.nameOrDisplayName"/>
+                    </t>
+                </div>
+            </t>
+        </div>
+    </t>
+
+</templates>