[IMP] * : redesign employee kanban card (master version)

* = hr, hr_holidays, hr_homeworking

Changes the hover on plane icon for leave. In public employee the hover is : "on leave" and in private employee the hover is the name of type's leave

task : 3527398

closes odoo/odoo#137741

Signed-off-by: Sofie Gvaladze (sgv) <sgv@odoo.com>
Co-authored-by: Xavier Bol <xbo@odoo.com>

addons/hr/static/src/components/hr_presence_status_private/hr_presence_status_private.js

@@ -0,0 +1,13 @@
+/** @odoo-module */
+
+import { registry } from "@web/core/registry";
+import { HrPresenceStatus, hrPresenceStatus } from "../hr_presence_status/hr_presence_status";
+
+export class HrPresenceStatusPrivate extends HrPresenceStatus { }
+
+export const hrPresenceStatusPrivate = {
+    ...hrPresenceStatus,
+    component: HrPresenceStatusPrivate,
+};
+
+registry.category("fields").add("hr_presence_status_private", hrPresenceStatusPrivate);

addons/hr/views/hr_employee_public_views.xml

@@ -158,9 +158,6 @@
                                     </div>
                                 </div>
                                 <ul>
-                                    <li t-if="record.show_hr_icon_display.raw_value">
-                                        <field name="hr_icon_display" class="o_employee_availability align-items-center" widget="hr_presence_status" />
-                                    </li>
                                     <li t-if="record.work_email.raw_value">
                                         <i class="fa fa-fw me-2 fa-envelope text-primary" title="Email"/>
                                         <field name="work_email"/>

addons/hr_holidays/static/src/components/hr_presence_status/hr_presence_status.js

@@ -3,8 +3,9 @@
 import { patch } from "@web/core/utils/patch";
 
 import { HrPresenceStatus } from "@hr/components/hr_presence_status/hr_presence_status";
+import { HrPresenceStatusPrivate, hrPresenceStatusPrivate } from "@hr/components/hr_presence_status_private/hr_presence_status_private";
 
-patch(HrPresenceStatus.prototype, {
+const patchHrPresenceStatus = () => ({
     get icon() {
         if (this.value.startsWith("presence_holiday")) {
             return "fa-plane";
@@ -19,3 +20,23 @@ patch(HrPresenceStatus.prototype, {
         return super.color;
     },
 });
+
+// Applies common patch on both components
+patch(HrPresenceStatus.prototype, patchHrPresenceStatus());
+patch(HrPresenceStatusPrivate.prototype, patchHrPresenceStatus());
+
+// Applies patch to hr_presence_status_private to display the time off type instead of default label
+patch(HrPresenceStatusPrivate.prototype, {
+    get label() {
+        return this.props.record.data.current_leave_id
+            ? this.props.record.data.current_leave_id[1]
+            : super.label;
+    }
+});
+
+Object.assign(hrPresenceStatusPrivate, {
+    fieldDependencies: [
+        ...(hrPresenceStatusPrivate.fieldDependencies || []),
+        { name: "current_leave_id", type:"many2one"}
+    ],
+});

addons/hr_holidays/views/hr_views.xml

@@ -109,6 +109,9 @@
                 <field name="leave_date_to"/>
                 <field name="is_absent"/>
             </xpath>
+            <xpath expr="//field[@name='hr_icon_display'][hasclass('o_employee_availability')]" position="attributes">
+                <attribute name="widget">hr_presence_status_private</attribute>
+            </xpath>
         </field>
     </record>
 

addons/hr_homeworking/static/src/components/hr_presence_status/hr_presence_status.js

@@ -1,11 +1,11 @@
 /** @odoo-module **/
 
-import { _t } from "@web/core/l10n/translation";
 import { patch } from "@web/core/utils/patch";
 
 import { HrPresenceStatus, hrPresenceStatus } from "@hr/components/hr_presence_status/hr_presence_status";
+import { HrPresenceStatusPrivate, hrPresenceStatusPrivate } from "@hr/components/hr_presence_status_private/hr_presence_status_private";
 
-patch(HrPresenceStatus.prototype, {
+const patchHrPresenceStatus = () => ({
     get color() {
         if (this.location) {
             let color = "text-muted";
@@ -31,13 +31,6 @@ patch(HrPresenceStatus.prototype, {
         return super.icon;
     },
 
-    get label() {
-        if (this.location) {
-            return _t("Working from %s", this.location);
-        }
-        return super.label;
-    },
-
     get location() {
         let location = this.value?.split("_")[1] || "";
         if (location && !['home', 'office', 'other'].includes(location)) {
@@ -45,10 +38,22 @@ patch(HrPresenceStatus.prototype, {
         }
         return location;
     },
+
+    get label() {
+        if (this.location) {
+            return this.props.record.data.name_work_location_display;
+        }
+        return super.label;
+    },
 });
 
+// for the both components: first applies the common patch and then applies patch for label
+patch(HrPresenceStatus.prototype, patchHrPresenceStatus());
+patch(HrPresenceStatusPrivate.prototype, patchHrPresenceStatus());
+
 const additionalFieldDependencies = [
     { name: "hr_presence_state", type: "selection" },
+    { name: "name_work_location_display", type: "char" }
 ];
 if (typeof hrPresenceStatus.fieldDependencies === "function") {
     const oldFieldDependencies = hrPresenceStatus.fieldDependencies;
@@ -63,3 +68,7 @@ if (typeof hrPresenceStatus.fieldDependencies === "function") {
         ...additionalFieldDependencies,
     ];
 }
+hrPresenceStatusPrivate.fieldDependencies = [
+    ...(hrPresenceStatusPrivate.fieldDependencies || []),
+    ...additionalFieldDependencies,
+];