{"version":3,"file":"Home-B0uc_YgW.js","sources":["../../../app/javascript/widget/components/GroupedAvatars.vue","../../../app/javascript/widget/components/TeamAvailability.vue","../../../app/javascript/widget/components/pageComponents/Home/Article/ArticleListItem.vue","../../../app/javascript/widget/components/pageComponents/Home/Article/ArticleBlock.vue","../../../app/javascript/widget/components/pageComponents/Home/Article/SkeletonLoader.vue","../../../app/javascript/widget/components/pageComponents/Home/Article/ArticleContainer.vue","../../../app/javascript/widget/views/Home.vue"],"sourcesContent":["<script setup>\nimport Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';\nimport { defineProps, computed } from 'vue';\n\nconst props = defineProps({\n  users: {\n    type: Array,\n    default: () => [],\n  },\n  limit: {\n    type: Number,\n    default: 4,\n  },\n});\n\nconst usersToDisplay = computed(() => props.users.slice(0, props.limit));\n</script>\n\n<template>\n  <div class=\"flex\">\n    <span\n      v-for=\"(user, index) in usersToDisplay\"\n      :key=\"user.id\"\n      :class=\"index ? 'ltr:-ml-4 rtl:-mr-4' : ''\"\n      class=\"inline-block rounded-full text-white shadow-solid\"\n    >\n      <Thumbnail\n        size=\"36px\"\n        :username=\"user.name\"\n        :src=\"user.avatar_url\"\n        has-border\n      />\n    </span>\n  </div>\n</template>\n","<script>\nimport { mapGetters } from 'vuex';\nimport { getContrastingTextColor } from '@chatwoot/utils';\nimport nextAvailabilityTime from 'widget/mixins/nextAvailabilityTime';\nimport configMixin from 'widget/mixins/configMixin';\nimport availabilityMixin from 'widget/mixins/availability';\nimport { IFrameHelper } from 'widget/helpers/utils';\nimport { CHATWOOT_ON_START_CONVERSATION } from '../constants/sdkEvents';\nimport GroupedAvatars from 'widget/components/GroupedAvatars.vue';\n\nexport default {\n  name: 'TeamAvailability',\n  components: {\n    GroupedAvatars,\n  },\n  mixins: [configMixin, nextAvailabilityTime, availabilityMixin],\n  props: {\n    availableAgents: {\n      type: Array,\n      default: () => {},\n    },\n    hasConversation: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  emits: ['startConversation'],\n\n  computed: {\n    ...mapGetters({\n      widgetColor: 'appConfig/getWidgetColor',\n    }),\n    textColor() {\n      return getContrastingTextColor(this.widgetColor);\n    },\n    agentAvatars() {\n      return this.availableAgents.map(agent => ({\n        name: agent.name,\n        avatar: agent.avatar_url,\n        id: agent.id,\n      }));\n    },\n    isOnline() {\n      const { workingHoursEnabled } = this.channelConfig;\n      const anyAgentOnline = this.availableAgents.length > 0;\n\n      if (workingHoursEnabled) {\n        return this.isInBetweenTheWorkingHours;\n      }\n      return anyAgentOnline;\n    },\n  },\n  methods: {\n    startConversation() {\n      this.$emit('startConversation');\n      if (!this.hasConversation) {\n        IFrameHelper.sendMessage({\n          event: 'onEvent',\n          eventIdentifier: CHATWOOT_ON_START_CONVERSATION,\n          data: { hasConversation: false },\n        });\n      }\n    },\n  },\n};\n</script>\n\n<template>\n  <div\n    class=\"flex flex-col gap-3 w-full shadow outline-1 outline outline-n-container rounded-xl bg-n-background dark:bg-n-solid-2 px-5 py-4\"\n  >\n    <div class=\"flex items-center justify-between gap-2\">\n      <div class=\"flex flex-col gap-1\">\n        <div class=\"font-medium text-n-slate-12\">\n          {{\n            isOnline\n              ? $t('TEAM_AVAILABILITY.ONLINE')\n              : $t('TEAM_AVAILABILITY.OFFLINE')\n          }}\n        </div>\n        <div class=\"text-n-slate-11\">\n          {{ replyWaitMessage }}\n        </div>\n      </div>\n      <GroupedAvatars v-if=\"isOnline\" :users=\"availableAgents\" />\n    </div>\n    <button\n      class=\"inline-flex items-center gap-1 font-medium text-n-slate-12\"\n      :style=\"{ color: widgetColor }\"\n      @click=\"startConversation\"\n    >\n      <span>\n        {{\n          hasConversation\n            ? $t('CONTINUE_CONVERSATION')\n            : $t('START_CONVERSATION')\n        }}\n      </span>\n      <i class=\"i-lucide-chevron-right size-5 mt-px\" />\n    </button>\n  </div>\n</template>\n","<script setup>\nimport { defineProps, defineEmits } from 'vue';\nconst props = defineProps({\n  link: {\n    type: String,\n    default: '',\n  },\n  title: {\n    type: String,\n    default: '',\n  },\n});\nconst emit = defineEmits(['selectArticle']);\nconst onClick = () => {\n  emit('selectArticle', props.link);\n};\n</script>\n\n<template>\n  <div\n    class=\"flex items-center justify-between rounded cursor-pointer text-n-slate-11 hover:text-n-slate-12 gap-2\"\n    role=\"button\"\n    @click=\"onClick\"\n  >\n    <button\n      class=\"underline-offset-2 leading-6 ltr:text-left rtl:text-right text-base\"\n    >\n      {{ title }}\n    </button>\n    <span class=\"i-lucide-chevron-right text-base shrink-0\" />\n  </div>\n</template>\n","<script setup>\nimport { defineProps, defineEmits, computed } from 'vue';\nimport ArticleListItem from './ArticleListItem.vue';\nimport { useMapGetter } from 'dashboard/composables/store';\n\nconst props = defineProps({\n  articles: {\n    type: Array,\n    default: () => [],\n  },\n});\n\nconst emit = defineEmits(['view', 'viewAll']);\n\nconst widgetColor = useMapGetter('appConfig/getWidgetColor');\n\nconst articlesToDisplay = computed(() => props.articles.slice(0, 6));\n\nconst onArticleClick = link => {\n  emit('view', link);\n};\n</script>\n\n<template>\n  <div class=\"flex flex-col gap-3\">\n    <h3 class=\"font-medium text-n-slate-12\">\n      {{ $t('PORTAL.POPULAR_ARTICLES') }}\n    </h3>\n    <div class=\"flex flex-col gap-4\">\n      <ArticleListItem\n        v-for=\"article in articlesToDisplay\"\n        :key=\"article.slug\"\n        :link=\"article.link\"\n        :title=\"article.title\"\n        @select-article=\"onArticleClick\"\n      />\n    </div>\n    <div>\n      <button\n        class=\"font-medium tracking-wide inline-flex\"\n        :style=\"{ color: widgetColor }\"\n        @click=\"$emit('viewAll')\"\n      >\n        <span>{{ $t('PORTAL.VIEW_ALL_ARTICLES') }}</span>\n      </button>\n    </div>\n  </div>\n</template>\n","<template>\n  <div class=\"py-4 space-y-4\">\n    <div class=\"space-y-2 animate-pulse\">\n      <div class=\"h-6 bg-n-slate-5 dark:bg-n-alpha-black1 rounded w-2/5\" />\n    </div>\n    <div class=\"space-y-2 animate-pulse\">\n      <div class=\"h-4 bg-n-slate-5 dark:bg-n-alpha-black1 rounded\" />\n      <div class=\"h-4 bg-n-slate-5 dark:bg-n-alpha-black1 rounded\" />\n      <div class=\"h-4 bg-n-slate-5 dark:bg-n-alpha-black1 rounded\" />\n    </div>\n    <div class=\"space-y-2 animate-pulse\">\n      <div class=\"h-4 bg-n-slate-5 dark:bg-n-alpha-black1 rounded w-1/5\" />\n    </div>\n  </div>\n</template>\n","<script setup>\nimport { computed, onMounted } from 'vue';\nimport ArticleBlock from 'widget/components/pageComponents/Home/Article/ArticleBlock.vue';\nimport ArticleCardSkeletonLoader from 'widget/components/pageComponents/Home/Article/SkeletonLoader.vue';\nimport { useI18n } from 'vue-i18n';\nimport { useRouter } from 'vue-router';\nimport { useStore } from 'dashboard/composables/store';\nimport { useMapGetter } from 'dashboard/composables/store.js';\nimport { useDarkMode } from 'widget/composables/useDarkMode';\n\nconst store = useStore();\nconst router = useRouter();\nconst i18n = useI18n();\nconst { prefersDarkMode } = useDarkMode();\n\nconst portal = computed(() => window.chatwootWebChannel.portal);\n\nconst popularArticles = useMapGetter('article/popularArticles');\nconst articleUiFlags = useMapGetter('article/uiFlags');\n\nconst locale = computed(() => {\n  const { locale: selectedLocale } = i18n;\n  const {\n    allowed_locales: allowedLocales,\n    default_locale: defaultLocale = 'en',\n  } = portal.value.config;\n  // IMPORTANT: Variation strict locale matching, Follow iso_639_1_code\n  // If the exact match of a locale is available in the list of portal locales, return it\n  // Else return the default locale. Eg: `es` will not work if `es_ES` is available in the list\n  if (allowedLocales.includes(selectedLocale)) {\n    return locale;\n  }\n  return defaultLocale;\n});\n\nconst fetchArticles = () => {\n  if (portal.value && !popularArticles.value.length) {\n    store.dispatch('article/fetch', {\n      slug: portal.value.slug,\n      locale: locale.value,\n    });\n  }\n};\n\nconst openArticleInArticleViewer = link => {\n  const params = new URLSearchParams({\n    show_plain_layout: 'true',\n    theme: prefersDarkMode.value ? 'dark' : 'light',\n  });\n\n  // Combine link with query parameters\n  const linkToOpen = `${link}?${params.toString()}`;\n  router.push({ name: 'article-viewer', query: { link: linkToOpen } });\n};\n\nconst viewAllArticles = () => {\n  const {\n    portal: { slug },\n  } = window.chatwootWebChannel;\n  openArticleInArticleViewer(`/hc/${slug}/${locale.value}`);\n};\n\nconst hasArticles = computed(\n  () =>\n    !articleUiFlags.value.isFetching &&\n    !articleUiFlags.value.isError &&\n    !!popularArticles.value.length\n);\nonMounted(() => fetchArticles());\n</script>\n\n<template>\n  <div\n    v-if=\"portal && (articleUiFlags.isFetching || !!popularArticles.length)\"\n    class=\"w-full shadow outline-1 outline outline-n-container rounded-xl bg-n-background dark:bg-n-solid-2 px-5 py-4\"\n  >\n    <ArticleBlock\n      v-if=\"hasArticles\"\n      :articles=\"popularArticles\"\n      @view=\"openArticleInArticleViewer\"\n      @view-all=\"viewAllArticles\"\n    />\n    <ArticleCardSkeletonLoader v-if=\"articleUiFlags.isFetching\" />\n  </div>\n  <div v-else class=\"hidden\" />\n</template>\n","<script>\nimport TeamAvailability from 'widget/components/TeamAvailability.vue';\nimport { mapGetters } from 'vuex';\nimport routerMixin from 'widget/mixins/routerMixin';\nimport configMixin from 'widget/mixins/configMixin';\nimport ArticleContainer from '../components/pageComponents/Home/Article/ArticleContainer.vue';\nexport default {\n  name: 'Home',\n  components: {\n    ArticleContainer,\n    TeamAvailability,\n  },\n  mixins: [configMixin, routerMixin],\n  computed: {\n    ...mapGetters({\n      availableAgents: 'agent/availableAgents',\n      conversationSize: 'conversation/getConversationSize',\n      unreadMessageCount: 'conversation/getUnreadMessageCount',\n    }),\n  },\n  methods: {\n    startConversation() {\n      if (this.preChatFormEnabled && !this.conversationSize) {\n        return this.replaceRoute('prechat-form');\n      }\n      return this.replaceRoute('messages');\n    },\n  },\n};\n</script>\n\n<template>\n  <div class=\"z-50 flex flex-col justify-end flex-1 w-full p-4 gap-4\">\n    <TeamAvailability\n      :available-agents=\"availableAgents\"\n      :has-conversation=\"!!conversationSize\"\n      :unread-count=\"unreadMessageCount\"\n      @start-conversation=\"startConversation\"\n    />\n\n    <ArticleContainer />\n  </div>\n</template>\n"],"names":["props","__props","usersToDisplay","computed","_sfc_main","GroupedAvatars","configMixin","nextAvailabilityTime","availabilityMixin","mapGetters","getContrastingTextColor","agent","workingHoursEnabled","anyAgentOnline","IFrameHelper","CHATWOOT_ON_START_CONVERSATION","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_openBlock","_createElementBlock","_createElementVNode","_toDisplayString","$options","_ctx","_createBlock","_component_GroupedAvatars","$props","_createCommentVNode","_normalizeStyle","args","emit","__emit","onClick","widgetColor","useMapGetter","articlesToDisplay","onArticleClick","link","_sfc_render","_cache","store","useStore","router","useRouter","i18n","useI18n","prefersDarkMode","useDarkMode","portal","popularArticles","articleUiFlags","locale","selectedLocale","allowedLocales","defaultLocale","fetchArticles","openArticleInArticleViewer","params","linkToOpen","viewAllArticles","slug","hasArticles","onMounted","ArticleContainer","TeamAvailability","routerMixin","_createVNode","_component_TeamAvailability","_component_ArticleContainer"],"mappings":"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"}