<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">
    <t t-inherit="mail.AvatarCardPopover" t-inherit-mode="extension">
        <xpath expr="//a[hasclass('o-mail-avatar-card-tel')]" position="after">
            <span t-if="employee?.work_location_id" class="text-muted" data-tooltip="Work Location">
                <i t-if="employee.work_location_id.location_type === 'office'" class="me-1 fa fa-fw fa-building-o"/>
                <i t-elif="employee.work_location_id.location_type === 'home'" class="me-1 fa fa-fw fa-home"/>
                <i t-else="" class="me-1 fa fa-fw fa-map-marker"/>
                <t t-esc="employee.work_location_id.name"/>
            </span>
        </xpath>
        <xpath expr="//button[@t-ref='viewProfileBtn']" position="after">
            <Dropdown t-if="canActivateEmployeeCompany" position="'bottom-start'">
                <button class="btn btn-secondary btn-sm dropdown-toggle">View Profile<i class="fa fa-fw fa-caret-down ms-1"/></button>
                <t t-set-slot="content">
                    <DropdownItem onSelected="() => this.onClickViewEmployeeProfile()">Open Employee Profile (activates company)</DropdownItem>
                    <DropdownItem onSelected="() => this.onClickViewProfile()">Open Contact Profile</DropdownItem>
                </t>
            </Dropdown>
        </xpath>
    </t>

    <t t-name="hr.avatarCardUserInfos">
        <small class="text-muted text-truncate" t-if="employee?.job_title" t-att-title="employee.job_title" t-esc="employee.job_title"/>
        <span class="text-muted text-truncate" t-if="employee?.department_id" data-tooltip="Department" t-att-title="employee.department_id.name" t-esc="employee.department_id.name"/>
    </t>
</templates>
