[IMP] mail: turn 'ComposerView/isCompact' into field

Task-2793280

closes odoo/odoo#86467

Signed-off-by: Ooming <wil@odoo.com>
This commit is contained in:
Alexandre Kühn
2022-03-16 17:04:38 +01:00
parent e8206b4dfa
commit 693f77c124
7 changed files with 34 additions and 26 deletions
@@ -15,7 +15,6 @@
classNameObj="{ 'o-bordered': chatter.hasExternalBorder }"
localId="chatter.composerView.localId"
hasMentionSuggestionsBelowPosition="true"
isCompact="false"
isExpandable="true"
/>
</t>
@@ -47,7 +47,7 @@ export class Composer extends Component {
this.props.hasThreadTyping ||
this.composerView.composer.attachments.length > 0 ||
this.composerView.messageViewInEditing ||
!this.props.isCompact
!this.composerView.isCompact
);
}
@@ -197,7 +197,6 @@ Object.assign(Composer, {
hasSendButton: true,
hasThreadName: false,
hasThreadTyping: false,
isCompact: true,
isExpandable: false,
},
props: {
@@ -234,10 +233,6 @@ Object.assign(Composer, {
type: Boolean,
optional: true,
},
isCompact: {
type: Boolean,
optional: true,
},
isExpandable: {
type: Boolean,
optional: true,
@@ -9,7 +9,7 @@
'o-has-footer': hasFooter,
'o-has-header': hasHeader,
'o-is-in-thread-view': composerView and composerView.threadView,
'o-is-compact': props.isCompact,
'o-is-compact': composerView and composerView.isCompact,
'o-messaging-in-editing': composerView and composerView.messageViewInEditing,
}"
t-attf-class="{{ className }}"
@@ -65,33 +65,32 @@
<div
class="o_Composer_coreMain"
t-att-class="{
'o-composer-is-compact': props.isCompact,
'o-composer-is-compact': composerView.isCompact,
}"
>
<ComposerTextInput
className="'o_Composer_textInput'"
classNameObj="{
'o-composer-is-compact': props.isCompact,
'o-composer-is-compact': composerView.isCompact,
'o_Composer_textInput-mobile': messaging.device.isMobile,
'o-has-current-partner-avatar': props.hasCurrentPartnerAvatar,
}"
localId="composerView.localId"
hasMentionSuggestionsBelowPosition="props.hasMentionSuggestionsBelowPosition"
isCompact="props.isCompact"
onComposerTextInputSendShortcut="_onComposerTextInputSendShortcut"
onPaste="_onPasteTextInput"
t-key="composerView.localId"
/>
<div class="o_Composer_buttons" t-att-class="{ 'o-composer-is-compact': props.isCompact, 'o-mobile': messaging.device.isMobile, 'o-messaging-in-editing': composerView and composerView.messageViewInEditing }">
<div class="o_Composer_buttons" t-att-class="{ 'o-composer-is-compact': composerView.isCompact, 'o-mobile': messaging.device.isMobile, 'o-messaging-in-editing': composerView and composerView.messageViewInEditing }">
<div class="o_Composer_toolButtons"
t-att-class="{
'o-composer-has-current-partner-avatar': props.hasCurrentPartnerAvatar,
'o-composer-is-compact': props.isCompact,
'o-composer-is-compact': composerView.isCompact,
}">
<t t-if="props.isCompact">
<t t-if="composerView.isCompact">
<div class="o_Composer_toolButtonSeparator"/>
</t>
<div class="o_Composer_primaryToolButtons" t-att-class="{ 'o-composer-is-compact': props.isCompact }">
<div class="o_Composer_primaryToolButtons" t-att-class="{ 'o-composer-is-compact': composerView.isCompact }">
<button class="o_Composer_button o_Composer_buttonEmojis o_Composer_toolButton btn btn-light"
t-att-class="{
'o-open': composerView.emojisPopoverView,
@@ -112,23 +111,23 @@
</div>
</t>
</div>
<t t-if="props.isCompact">
<t t-if="composerView.isCompact">
<t t-call="mail.Composer.actionButtons"/>
</t>
</div>
</div>
<t t-if="hasFooter">
<div class="o_Composer_coreFooter" t-att-class="{ 'o-composer-is-compact': props.isCompact }">
<div class="o_Composer_coreFooter" t-att-class="{ 'o-composer-is-compact': composerView.isCompact }">
<t t-if="props.hasThreadTyping">
<ThreadTextualTypingStatus className="'o_Composer_threadTextualTypingStatus'" threadLocalId="composerView.composer.activeThread.localId"/>
</t>
<AttachmentList
t-if="composerView.attachmentList"
className="'o_Composer_attachmentList'"
classNameObj="{ 'o-composer-is-compact': props.isCompact }"
classNameObj="{ 'o-composer-is-compact': composerView.isCompact }"
localId="composerView.attachmentList.localId"
/>
<t t-if="!props.isCompact">
<t t-if="!composerView.isCompact">
<t t-call="mail.Composer.actionButtons"/>
</t>
<t t-if="composerView.messageViewInEditing">
@@ -141,12 +140,12 @@
</t>
<t t-name="mail.Composer.actionButtons" owl="1">
<div class="o_Composer_actionButtons" t-att-class="{ 'o-composer-is-compact': props.isCompact }">
<div class="o_Composer_actionButtons" t-att-class="{ 'o-composer-is-compact': composerView.isCompact }">
<t t-if="props.hasSendButton">
<button class="o_Composer_actionButton o_Composer_button o_Composer_buttonSend btn btn-primary"
t-att-class="{
'o-last': messaging.device.isMobile or !props.hasDiscardButton,
'o-composer-is-compact': props.isCompact,
'o-composer-is-compact': composerView.isCompact,
'o-has-current-partner-avatar': props.hasCurrentPartnerAvatar,
}"
t-att-disabled="!composerView.composer.canPostMessage ? 'disabled' : ''"
@@ -158,7 +157,7 @@
</button>
</t>
<t t-if="!messaging.device.isMobile and props.hasDiscardButton">
<button class="o_Composer_actionButton o-last o_Composer_button o_Composer_buttonDiscard btn btn-secondary" t-att-class="{ 'o-composer-is-compact': props.isCompact, 'o-has-current-partner-avatar': props.hasCurrentPartnerAvatar }" type="button" t-on-click="_onClickDiscard">
<button class="o_Composer_actionButton o-last o_Composer_button o_Composer_buttonDiscard btn btn-secondary" t-att-class="{ 'o-composer-is-compact': composerView.isCompact, 'o-has-current-partner-avatar': props.hasCurrentPartnerAvatar }" type="button" t-on-click="_onClickDiscard">
Discard
</button>
</t>
@@ -386,7 +386,6 @@ Object.assign(ComposerTextInput, {
type: Boolean,
optional: true,
},
isCompact: Boolean,
onComposerTextInputSendShortcut: {
type: Function,
optional: true,
@@ -10,13 +10,13 @@
isBelow="props.hasMentionSuggestionsBelowPosition"
/>
</t>
<textarea class="o_ComposerTextInput_textarea o_ComposerTextInput_textareaStyle" t-att-class="{ 'o-composer-is-compact': props.isCompact }" t-esc="composerView.composer.textInputContent" t-att-placeholder="composerView.composer.placeholder" t-on-click="_onClickTextarea" t-on-focusin="_onFocusinTextarea" t-on-focusout="_onFocusoutTextarea" t-on-keydown="_onKeydownTextarea" t-on-keyup="_onKeyupTextarea" t-on-input="_onInputTextarea" t-ref="textarea"/>
<textarea class="o_ComposerTextInput_textarea o_ComposerTextInput_textareaStyle" t-att-class="{ 'o-composer-is-compact': composerView.isCompact }" t-esc="composerView.composer.textInputContent" t-att-placeholder="composerView.composer.placeholder" t-on-click="_onClickTextarea" t-on-focusin="_onFocusinTextarea" t-on-focusout="_onFocusoutTextarea" t-on-keydown="_onKeydownTextarea" t-on-keyup="_onKeyupTextarea" t-on-input="_onInputTextarea" t-ref="textarea"/>
<!--
This is an invisible textarea used to compute the composer
height based on the text content. We need it to downsize
the textarea properly without flicker.
-->
<textarea class="o_ComposerTextInput_mirroredTextarea o_ComposerTextInput_textareaStyle" t-att-class="{ 'o-composer-is-compact': props.isCompact }" t-esc="composerView.composer.textInputContent" t-ref="mirroredTextarea" disabled="1"/>
<textarea class="o_ComposerTextInput_mirroredTextarea o_ComposerTextInput_textareaStyle" t-att-class="{ 'o-composer-is-compact': composerView.isCompact }" t-esc="composerView.composer.textInputContent" t-ref="mirroredTextarea" disabled="1"/>
</t>
</div>
</t>
@@ -136,7 +136,6 @@
hasDiscardButton="false"
hasMentionSuggestionsBelowPosition="false"
hasSendButton="false"
isCompact="true"
/>
</t>
<t t-if="messageView.message.subtype_description and !messageView.message.isBodyEqualSubtypeDescription">
@@ -584,6 +584,19 @@ registerModel({
_computeHasSuggestions() {
return this.mainSuggestedRecords.length > 0 || this.extraSuggestedRecords.length > 0;
},
/**
* @private
* @returns {boolean|FieldCommand}
*/
_computeIsCompact() {
if (this.chatter) {
return false;
}
if (this.messageViewInEditing) {
return true;
}
return clear();
},
/**
* Clears the main suggested record on closing mentions.
*
@@ -1027,6 +1040,10 @@ registerModel({
hasToScrollToActiveSuggestion: attr({
default: false,
}),
isCompact: attr({
compute: '_computeIsCompact',
default: true,
}),
isFocused: attr({
default: false,
}),