{"version":3,"file":"NotificationAvailableChats-40dd258a.js","sources":["../../../app/javascript/components/notification/NotificationAvailableChats.vue"],"sourcesContent":["<template>\n  <div class=\"mx-4 mt-4 cursor-pointer overflow-hidden bg-gray-800 shadow-lg\">\n    <div class=\"flex w-full flex-col justify-center border-l-4 border-l-blue-600 p-3 pr-5 pt-2\">\n      <div class=\"flex w-full justify-end\">\n        <button @click.stop=\"close(notification.id)\" class=\"flex text-gray-400 hover:text-gray-100 focus:outline-none\">\n          <XMarkIcon class=\"h-4 w-4\"></XMarkIcon>\n        </button>\n      </div>\n      <div class=\"mb-1 flex items-center space-x-2\" @click=\"openChatroom()\">\n        <div class=\"flex items-center justify-center\" :class=\"notificationChannels.length == 1 ? 'w-1/9' : 'w-1/5'\">\n          <ChatImage\n            v-if=\"remainingChannels > 0\"\n            :item=\"{ name: '+' + remainingChannels }\"\n            class=\"avatar cursor-pointer border border-gray-500\"\n            size=\"sm\"\n          />\n          <ChatImage\n            v-for=\"channel in filteredChannels\"\n            :key=\"channel.id\"\n            :item=\"channel\"\n            :is-channel=\"true\"\n            :channel-name=\"getChannelName(channel)\"\n            size=\"sm\"\n            class=\"avatar cursor-pointer border border-gray-500\"\n          />\n        </div>\n        <div class=\"flex flex-1 flex-col\">\n          <div class=\"line-clamp-1 text-xs font-medium uppercase tracking-wider text-gray-400\">\n            {{ notification.payload.title }}\n          </div>\n          <div class=\"mb-0.5 flex items-center justify-between\">\n            <span class=\"line-clamp-1 w-5/6 text-xs font-medium leading-4\">{{ channelNames.join(', ') }}</span>\n            <span class=\"whitespace-nowrap text-xs font-medium leading-4\"> Just now </span>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n<script setup>\nimport { ref, onMounted } from 'vue';\nimport ChatImage from '../chat/ChatImage.vue';\nimport useEmitter from '../../composeables/emitter';\nimport { getChannelName } from '@/composeables/chat';\nimport { XMarkIcon } from '@heroicons/vue/20/solid';\nconst emitter = useEmitter();\n\nconst props = defineProps({\n  notification: {\n    type: Object\n  },\n  close: {\n    type: Function\n  }\n});\nconst notificationChannels = ref(props.notification.payload.channels);\nconst channelNames = ref([]);\nconst filteredChannels = ref([]);\nconst remainingChannels = ref(0);\n\nonMounted(() => {\n  notificationChannels.value.forEach(async channel => {\n    let channelName = await getChannelName(channel);\n    channelNames.value.push(channelName);\n  });\n  if (notificationChannels.value.length > 3) {\n    remainingChannels.value = notificationChannels.value.length - 2;\n    filteredChannels.value = notificationChannels.value.slice(0, 2);\n  } else {\n    remainingChannels.value = notificationChannels.value.length - 3;\n    filteredChannels.value = notificationChannels.value.slice(0, 3);\n  }\n});\n\n// methods\nasync function openChatroom() {\n  if (!window.location.pathname.includes('/messenger')) {\n    if (props.notification.payload.message) {\n      window.open(`/messenger?channel=${notificationChannels.value[0].id}`);\n    }\n  } else {\n    emitter.$emit('channel:change', notificationChannels.value[0]);\n  }\n  props.close(props.notification.id);\n}\n</script>\n"],"names":["emitter","useEmitter","notificationChannels","ref","props","channelNames","filteredChannels","remainingChannels","onMounted","channel","channelName","getChannelName","openChatroom"],"mappings":"8iCA6CMA,EAAUC,EAAU,EAUpBC,EAAuBC,EAAIC,EAAM,aAAa,QAAQ,QAAQ,EAC9DC,EAAeF,EAAI,CAAA,CAAE,EACrBG,EAAmBH,EAAI,CAAA,CAAE,EACzBI,EAAoBJ,EAAI,CAAC,EAE/BK,EAAU,IAAM,CACdN,EAAqB,MAAM,QAAQ,MAAMO,GAAW,CAClD,IAAIC,EAAc,MAAMC,EAAeF,CAAO,EAC9CJ,EAAa,MAAM,KAAKK,CAAW,CACvC,CAAG,EACGR,EAAqB,MAAM,OAAS,GACtCK,EAAkB,MAAQL,EAAqB,MAAM,OAAS,EAC9DI,EAAiB,MAAQJ,EAAqB,MAAM,MAAM,EAAG,CAAC,IAE9DK,EAAkB,MAAQL,EAAqB,MAAM,OAAS,EAC9DI,EAAiB,MAAQJ,EAAqB,MAAM,MAAM,EAAG,CAAC,EAElE,CAAC,EAGD,eAAeU,GAAe,CACvB,OAAO,SAAS,SAAS,SAAS,YAAY,EAKjDZ,EAAQ,MAAM,iBAAkBE,EAAqB,MAAM,CAAC,CAAC,EAJzDE,EAAM,aAAa,QAAQ,SAC7B,OAAO,KAAK,sBAAsBF,EAAqB,MAAM,CAAC,EAAE,EAAE,EAAE,EAKxEE,EAAM,MAAMA,EAAM,aAAa,EAAE,CACnC"}