{"version":3,"file":"NavigationNotificationItem-fcb6b11f.js","sources":["../../../app/javascript/components/navigation/NavigationNotificationItem.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"notificationObj\"\n    :class=\"[!notificationObj.read ? 'border-blue-500 bg-blue-900/25' : 'border-gray-500 bg-gray-900/25']\"\n    class=\"flex h-16 flex-col justify-center border-l-2 p-1\"\n  >\n    <div class=\"flex items-center justify-between px-1\">\n      <div class=\"flex flex-col items-baseline\">\n        <a\n          class=\"line-clamp-2 break-all text-xs text-white\"\n          :href=\"notification.url\"\n          :title=\"notification.message\"\n          :target=\"['News', 'SEC'].includes(notification.alert.entity) ? '_blank' : ''\"\n        >\n          {{ notification.message }}\n        </a>\n        <span class=\"mt-px text-[0.6rem] text-gray-400\">\n          {{ minimalTimeWithinToday(notification.created_at) }}\n        </span>\n      </div>\n      <div class=\"flex items-center space-x-0.5\">\n        <DropdownTableCell\n          :items=\"dropdownItems\"\n          :cell-info=\"notification\"\n          :x-anchor=\"'left'\"\n          :global-emit=\"false\"\n          @read=\"markNotificationRead()\"\n          @delete=\"deleteNotification()\"\n        />\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport DropdownTableCell from '@/components/dropdown/DropdownTableCell.vue';\nimport { minimalTimeWithinToday } from '@/composeables/filters';\nimport useHttp from '@/composeables/http';\nimport { ref, onMounted, computed } from 'vue';\nimport { useStore } from 'vuex';\n\nconst $store = useStore();\nconst $http = useHttp();\nconst $emit = defineEmits(['markAsRead']);\n\nconst props = defineProps({\n  notification: {\n    type: Object\n  }\n});\n\nonMounted(() => {\n  notificationObj.value = props.notification;\n});\n\nconst notificationObj = ref({});\n\nconst dropdownItems = computed(() => {\n  let items = [];\n  if (props.notification.read) {\n    items.push({ id: 'unread', text: 'Mark Unread', event: 'read' });\n  } else {\n    items.push({ id: 'read', text: 'Mark Read', event: 'read' });\n  }\n  items.push({ id: 'delete', text: 'Delete', event: 'delete' });\n  return items;\n});\n\nfunction markNotificationRead() {\n  $http\n    .post('/notifications/mark_read', {\n      id: props.notification.id\n    })\n    .then(() => {\n      $store.commit('changeUserNotificationStatus', {\n        id: props.notification.id,\n        status: !props.notification.read\n      });\n      $emit('markAsRead', false);\n    });\n}\n\nfunction deleteNotification() {\n  $http.post('/notifications/delete', { id: props.notification.id }).then(() => {\n    $store.commit('removeUserNotification', props.notification.id);\n  });\n}\n</script>\n"],"names":["$store","useStore","$http","useHttp","onMounted","notificationObj","props","ref","dropdownItems","computed","items","markNotificationRead","$emit","deleteNotification"],"mappings":"miCAyCMA,EAASC,EAAQ,EACjBC,EAAQC,EAAO,EASrBC,EAAU,IAAM,CACdC,EAAgB,MAAQC,EAAM,YAChC,CAAC,EAED,MAAMD,EAAkBE,EAAI,CAAA,CAAE,EAExBC,EAAgBC,EAAS,IAAM,CACnC,IAAIC,EAAQ,CAAA,EACZ,OAAIJ,EAAM,aAAa,KACrBI,EAAM,KAAK,CAAE,GAAI,SAAU,KAAM,cAAe,MAAO,MAAM,CAAE,EAE/DA,EAAM,KAAK,CAAE,GAAI,OAAQ,KAAM,YAAa,MAAO,MAAM,CAAE,EAE7DA,EAAM,KAAK,CAAE,GAAI,SAAU,KAAM,SAAU,MAAO,QAAQ,CAAE,EACrDA,CACT,CAAC,EAED,SAASC,GAAuB,CAC9BT,EACG,KAAK,2BAA4B,CAChC,GAAII,EAAM,aAAa,EAC7B,CAAK,EACA,KAAK,IAAM,CACVN,EAAO,OAAO,+BAAgC,CAC5C,GAAIM,EAAM,aAAa,GACvB,OAAQ,CAACA,EAAM,aAAa,IACpC,CAAO,EACDM,EAAM,aAAc,EAAK,CAC/B,CAAK,CACL,CAEA,SAASC,GAAqB,CAC5BX,EAAM,KAAK,wBAAyB,CAAE,GAAII,EAAM,aAAa,EAAE,CAAE,EAAE,KAAK,IAAM,CAC5EN,EAAO,OAAO,yBAA0BM,EAAM,aAAa,EAAE,CACjE,CAAG,CACH"}