fix: Resolve bot name if sender value is empty (#2283)

Co-authored-by: Pranav Raj S <pranav@chatwoot.com>
This commit is contained in:
Muhsin Keloth 2021-05-18 00:22:43 +05:30 committed by GitHub
parent 10f3d321de
commit 1290e32150
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 12 deletions

View file

@ -6,7 +6,7 @@
:src="avatarUrl" :src="avatarUrl"
size="20px" size="20px"
:username="agentName" :username="agentName"
:status="sender.availability_status" :status="availabilityStatus"
/> />
<span class="agent--name">{{ agentName }}</span> <span class="agent--name">{{ agentName }}</span>
<span class="company--name"> {{ companyName }}</span> <span class="company--name"> {{ companyName }}</span>
@ -46,34 +46,45 @@ export default {
}`; }`;
}, },
avatarUrl() { avatarUrl() {
const { avatar_url: avatarUrl } = this.sender;
// eslint-disable-next-line // eslint-disable-next-line
const BotImage = require('dashboard/assets/images/chatwoot_bot.png'); const BotImage = require('dashboard/assets/images/chatwoot_bot.png');
const displayImage = this.useInboxAvatarForBot const displayImage = this.useInboxAvatarForBot
? this.inboxAvatarUrl ? this.inboxAvatarUrl
: BotImage; : BotImage;
return !isEmptyObject(this.sender) ? avatarUrl : displayImage; if (this.isSenderExist(this.sender)) {
const { avatar_url: avatarUrl } = this.sender;
return avatarUrl;
}
return displayImage;
}, },
agentName() { agentName() {
if (this.isSenderExist(this.sender)) {
const { available_name: availableName, name } = this.sender; const { available_name: availableName, name } = this.sender;
if (!isEmptyObject(this.sender)) {
return availableName || name; return availableName || name;
} }
return this.$t('UNREAD_VIEW.BOT'); return this.$t('UNREAD_VIEW.BOT');
}, },
availabilityStatus() {
if (this.isSenderExist(this.sender)) {
const { availability_status: availabilityStatus } = this.sender;
return availabilityStatus;
}
return null;
},
},
methods: {
isSenderExist(sender) {
return sender && !isEmptyObject(sender);
},
}, },
}; };
</script> </script>
<style lang="scss" scoped>
<style lang="scss">
@import '~widget/assets/scss/variables.scss'; @import '~widget/assets/scss/variables.scss';
.chat-bubble { .chat-bubble {
max-width: 85%; max-width: 85%;
padding: $space-normal; padding: $space-normal;
} }
</style>
<style lang="scss" scoped>
@import '~widget/assets/scss/variables.scss';
.row--agent-block { .row--agent-block {
align-items: center; align-items: center;
display: flex; display: flex;
@ -81,7 +92,7 @@ export default {
padding-bottom: $space-small; padding-bottom: $space-small;
font-size: $font-size-small; font-size: $font-size-small;
.agent--name { .agent--name {
font-weight: $font-weight-bold; font-weight: $font-weight-medium;
margin-left: $space-smaller; margin-left: $space-smaller;
} }
.company--name { .company--name {

View file

@ -21,7 +21,8 @@
"UNREAD_VIEW": { "UNREAD_VIEW": {
"VIEW_MESSAGES_BUTTON": "See new messages", "VIEW_MESSAGES_BUTTON": "See new messages",
"CLOSE_MESSAGES_BUTTON": "Close", "CLOSE_MESSAGES_BUTTON": "Close",
"COMPANY_FROM": "from" "COMPANY_FROM": "from",
"BOT": "Bot"
}, },
"BUBBLE": { "BUBBLE": {
"LABEL": "Chat with us" "LABEL": "Chat with us"