pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] mail: make thread topbar icons reflect active state

Browse Source 
task-3251550

closes odoo/odoo#116863

Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
This commit is contained in:
tsm-odoo
2023-03-29 13:06:49 +02:00
parent 6371565e69
commit ce135776be
3 changed files with 25 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/mail/static/src/discuss/discuss.js
+8 -2
View File
@@ -59,10 +59,10 @@ export class Discuss extends Component {
this.contentRef = useRef("content");
this.popover = usePopover();
this.closePopover = null;
this.settingsRef = useRef("settings");
this.addUsersRef = useRef("addUsers");
this.state = useState({
activeMode: this.MODES.NONE,
isAddingUsers: false,
});
this.orm = useService("orm");
this.effect = useService("effect");
@@ -104,11 +104,17 @@ export class Discuss extends Component {
this.closePopover = null;
} else {
const el = this.addUsersRef.el;
this.state.isAddingUsers = true;
this.closePopover = this.popover.add(
el,
ChannelInvitation,
{ thread: this.thread },
{ onClose: () => (this.closePopover = null) }
{
onClose: () => {
this.state.isAddingUsers = false;
this.closePopover = null;
},
}
);
}
}
addons/mail/static/src/discuss/discuss.scss
+12
View File
@@ -24,3 +24,15 @@
.o-mail-Discuss-threadName {
max-width: 75%;
}
.o-mail-Discuss-header button {
&:not(.o-isActive):hover {
background-color: $gray-300;
}
&.o-isActive {
background-color: $gray-300;
}
&.o-isActive:hover {
background-color: $gray-400;
}
}
addons/mail/static/src/discuss/discuss.xml
+5 -5
View File
@@ -25,19 +25,19 @@
/>
</t>
</div>
<div class="flex-shrink-0 d-flex align-items-center ms-1">
<div class="o-mail-Discuss-header flex-shrink-0 d-flex align-items-center ms-1">
<button t-if="thread.id === 'inbox'" class="btn btn-secondary" t-att-disabled="thread.isEmpty" t-on-click="markAllAsRead">Mark all read</button>
<button t-if="thread.id === 'starred'" class="btn btn-secondary" t-att-disabled="thread.isEmpty" t-on-click="messageService.unstarAll">Unstar all</button>
<button t-if="thread.allowCalls and thread.type !== 'mailbox' and thread !== rtc.state.channel" class="btn" title="Start a Call" t-on-click="() => this.rtc.toggleCall(this.thread)">
<button t-if="thread.allowCalls and thread.type !== 'mailbox' and thread !== rtc.state.channel" class="btn rounded px-2 shadow-none" title="Start a Call" t-on-click="() => this.rtc.toggleCall(this.thread)">
<i class="fa fa-lg fa-phone text-700"/>
</button>
<button t-if="thread.model === 'mail.channel'" class="btn" t-ref="addUsers" title="Add Users" t-on-click.stop="toggleInviteForm">
<button t-if="thread.model === 'mail.channel'" t-att-class="{ 'o-isActive': state.isAddingUsers }" class="btn rounded px-2 shadow-none" t-ref="addUsers" title="Add Users" t-on-click.stop="toggleInviteForm">
<i class="fa fa-lg fa-user-plus text-700"/>
</button>
<button t-if="thread.hasMemberList" class="btn" t-att-title="state.activeMode === MODES.MEMBER_LIST ? 'Hide Member List' : 'Show Member List'" t-on-click.stop="toggleMemberList">
<button t-if="thread.hasMemberList" class="btn rounded px-2 shadow-none" t-att-class="{ 'o-isActive': state.activeMode === MODES.MEMBER_LIST }" t-att-title="state.activeMode === MODES.MEMBER_LIST ? 'Hide Member List' : 'Show Member List'" t-on-click.stop="toggleMemberList">
<i class="fa fa-lg fa-users text-700"/>
</button>
<button t-if="thread.allowCalls" class="btn" t-ref="settings" t-att-title="state.activeMode === MODES.SETTINGS ? 'Hide Call Settings' : 'Show Call Settings'" t-on-click="toggleSettings">
<button t-if="thread.allowCalls" class="btn rounded px-2 shadow-none" t-att-class="{ 'o-isActive': state.activeMode === MODES.SETTINGS }" t-att-title="state.activeMode === MODES.SETTINGS ? 'Hide Call Settings' : 'Show Call Settings'" t-on-click="toggleSettings">
<i class="fa fa-lg fa-gear text-700"/>
</button>
<div t-if="props.public and !store.isSmall" class="d-flex align-items-center">