{"version":3,"file":"NotificationChat-baf7951a.js","sources":["../../../app/javascript/components/notification/NotificationChat.vue"],"sourcesContent":["<template>\n  <div class=\"mx-4 mt-4 cursor-pointer overflow-hidden bg-gray-800 shadow-lg\" @click=\"openChatroom()\">\n    <!-- this is to avoid purging of classes DO NOT REMOVE -->\n    <!-- <div class=\"border-yellow-400 border-red-400 border-green-400 border-blue-400\"/> -->\n    <div class=\"flex w-full flex-col justify-center border-l-4 border-l-blue-600 p-3 pr-5\">\n      <div class=\"flex items-center justify-between\">\n        <span class=\"line-clamp-1 text-xs font-medium uppercase tracking-wider text-gray-400\">\n          {{ notification.payload.title }}\n        </span>\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 v-if=\"notification.payload.channel\" class=\"mb-1 mt-2 flex items-center space-x-2\">\n        <ChatImage size=\"md\" :show-online=\"true\" :item=\"invitor\">\n          <template #status>\n            <div class=\"absolute bottom-0 right-0\">\n              <div\n                class=\"h-2.5 w-2.5 rounded-full border\"\n                :class=\"invitor.online ? 'bg-green-600' : 'bg-gray-600'\"\n              ></div>\n            </div>\n          </template>\n        </ChatImage>\n        <div class=\"flex flex-1 flex-col\">\n          <div class=\"mb-0.5 flex items-center justify-between\">\n            <div\n              v-if=\"channelName\"\n              class=\"line-clamp-1 text-sm font-semibold leading-4 text-gray-100\"\n              :title=\"channelName.length > 40 ? channelName : null\"\n            >\n              {{ channelName }}\n            </div>\n            <span class=\"whitespace-nowrap text-xs font-medium leading-4 text-gray-400\"> Just now </span>\n          </div>\n\n          <div v-if=\"notification.payload.channel.note\" class=\"line-clamp-1 text-sm leading-4 text-gray-400\">\n            <span v-if=\"invitedBy\">{{ invitedBy.name }}:</span>\n            {{ notification.payload.channel.note }}\n          </div>\n          <span v-else-if=\"streamChannel.direct_messaging\" class=\"line-clamp-1 text-sm text-gray-400\">\n            wants to send you a message\n          </span>\n          <span v-else-if=\"invitedBy\" class=\"line-clamp-1 text-sm text-gray-400\">\n            <span class=\"font-semibold\">{{ invitedBy.name }}</span> wants to add you to the chat\n          </span>\n        </div>\n      </div>\n      <div v-else-if=\"notification.payload.message\">\n        <span class=\"mt-2 text-sm font-medium text-gray-300\">\n          {{ notification.payload.member.name }}\n        </span>\n        <span v-if=\"notification.payload.message\" class=\"line-clamp-1 text-xs text-white\" style=\"white-space: pre-line\">\n          <span>{{ notification.payload.message.text }}</span>\n        </span>\n      </div>\n    </div>\n  </div>\n</template>\n<script setup>\nimport { ref, onMounted, computed } from 'vue';\nimport { useMapGetter } from '@/store/map-state';\nimport ChatImage from '../chat/ChatImage.vue';\nimport useEmitter from '../../composeables/emitter';\nimport { getChannelName, getUserByName } from '@/composeables/chat';\nimport { usePage } from '@inertiajs/vue3';\nimport { XMarkIcon } from '@heroicons/vue/20/solid';\nconst page = usePage();\nconst emitter = useEmitter();\nconst { client, streamUser, channels } = useMapGetter();\nconst props = defineProps({\n  notification: {\n    type: Object\n  },\n  close: {\n    type: Function\n  }\n});\nconst streamChannel = ref(props.notification.payload.channel || null);\nconst invitedBy = ref(null);\nconst channelName = ref(null);\n\nonMounted(() => {\n  if (streamChannel.value) {\n    fetchChannelName();\n    if (streamChannel.value.direct_messaging || streamChannel.value.direct_group_messaging) {\n      invitedBy.value = streamChannel.value.created_by;\n    } else {\n      let invitedUsers = streamChannel.value.invited_users || [];\n      let invitedUser = invitedUsers.find(x => x.invited_users.includes(streamUser.value.id));\n      invitedBy.value = getUserByName(invitedUser.invited_by);\n    }\n  }\n});\n\n//computed\nconst invitor = computed(() => {\n  return streamChannel.value.direct_messaging ? invitedBy.value : streamChannel.value;\n});\n// methods\n\nasync function fetchChannelName() {\n  channelName.value = streamChannel.value.direct_messaging\n    ? streamChannel.value.created_by.name\n    : await getChannelName(streamChannel.value);\n}\nasync function openChatroom() {\n  props.close(props.notification.id);\n  let channelId = props.notification.payload.channel_id || props.notification.payload.channel.id;\n  if (!page.url.includes('messenger')) {\n    const channel = channels.value.find(c => c.id == channelId);\n    if (channel) {\n      emitter.$emit('channel:change', channel);\n    }\n  } else {\n    const streamChannel = client.value.channel('messaging', channelId);\n    emitter.$emit('channel:change', streamChannel);\n  }\n}\n</script>\n"],"names":["page","usePage","emitter","useEmitter","client","streamUser","channels","useMapGetter","streamChannel","ref","props","invitedBy","channelName","onMounted","fetchChannelName","invitedUser","x","getUserByName","invitor","computed","getChannelName","openChatroom","channelId","channel","c"],"mappings":"s5CAmEMA,EAAOC,EAAO,EACdC,EAAUC,EAAU,EACpB,CAAE,OAAAC,EAAQ,WAAAC,EAAY,SAAAC,CAAU,EAAGC,EAAY,EAS/CC,EAAgBC,EAAIC,EAAM,aAAa,QAAQ,SAAW,IAAI,EAC9DC,EAAYF,EAAI,IAAI,EACpBG,EAAcH,EAAI,IAAI,EAE5BI,EAAU,IAAM,CACd,GAAIL,EAAc,MAEhB,GADAM,IACIN,EAAc,MAAM,kBAAoBA,EAAc,MAAM,uBAC9DG,EAAU,MAAQH,EAAc,MAAM,eACjC,CAEL,IAAIO,GADeP,EAAc,MAAM,eAAiB,CAAA,GACzB,KAAKQ,GAAKA,EAAE,cAAc,SAASX,EAAW,MAAM,EAAE,CAAC,EACtFM,EAAU,MAAQM,EAAcF,EAAY,UAAU,CACvD,CAEL,CAAC,EAGD,MAAMG,EAAUC,EAAS,IAChBX,EAAc,MAAM,iBAAmBG,EAAU,MAAQH,EAAc,KAC/E,EAGD,eAAeM,GAAmB,CAChCF,EAAY,MAAQJ,EAAc,MAAM,iBACpCA,EAAc,MAAM,WAAW,KAC/B,MAAMY,EAAeZ,EAAc,KAAK,CAC9C,CACA,eAAea,GAAe,CAC5BX,EAAM,MAAMA,EAAM,aAAa,EAAE,EACjC,IAAIY,EAAYZ,EAAM,aAAa,QAAQ,YAAcA,EAAM,aAAa,QAAQ,QAAQ,GAC5F,GAAKV,EAAK,IAAI,SAAS,WAAW,EAK3B,CACL,MAAMQ,EAAgBJ,EAAO,MAAM,QAAQ,YAAakB,CAAS,EACjEpB,EAAQ,MAAM,iBAAkBM,CAAa,CAC9C,KARoC,CACnC,MAAMe,EAAUjB,EAAS,MAAM,KAAKkB,GAAKA,EAAE,IAAMF,CAAS,EACtDC,GACFrB,EAAQ,MAAM,iBAAkBqB,CAAO,CAE7C,CAIA"}