Chatwoot/app/javascript/widget/views/Router.vue
Pranav Raj S 45cd949c40
feat: Add a popout option on webwidget (#1174)
* feat: Add a popout option on webwidget
2020-08-28 17:39:46 +05:30

91 lines
1.9 KiB
Vue

<template>
<div
id="app"
class="woot-widget-wrap"
:class="{ 'is-mobile': isMobile, 'is-widget-right': !isLeftAligned }"
>
<home
v-if="!showUnreadView"
:grouped-messages="groupedMessages"
:conversation-size="conversationSize"
:available-agents="availableAgents"
:has-fetched="hasFetched"
:conversation-attributes="conversationAttributes"
:unread-message-count="unreadMessageCount"
:show-popout-button="showPopoutButton"
/>
<unread
v-else
:unread-messages="unreadMessages"
:conversation-size="conversationSize"
:available-agents="availableAgents"
:has-fetched="hasFetched"
:conversation-attributes="conversationAttributes"
:unread-message-count="unreadMessageCount"
:hide-message-bubble="hideMessageBubble"
/>
</div>
</template>
<script>
import Home from './Home';
import Unread from './Unread';
export default {
name: 'Router',
components: {
Home,
Unread,
},
props: {
groupedMessages: {
type: Array,
default: () => [],
},
unreadMessages: {
type: Array,
default: () => [],
},
conversationSize: {
type: Number,
default: 0,
},
availableAgents: {
type: Array,
default: () => [],
},
hasFetched: {
type: Boolean,
default: false,
},
isMobile: {
type: Boolean,
default: false,
},
isLeftAligned: {
type: Boolean,
default: false,
},
showUnreadView: {
type: Boolean,
default: false,
},
hideMessageBubble: {
type: Boolean,
default: false,
},
conversationAttributes: {
type: Object,
default: () => {},
},
unreadMessageCount: {
type: Number,
default: 0,
},
showPopoutButton: {
type: Boolean,
default: false,
},
},
};
</script>