{"version":3,"file":"ChatNotificationSettingsModal-c9193a95.js","sources":["../../../app/javascript/components/chat/ChatNotificationSettingsModal.vue"],"sourcesContent":["<template>\n  <BaseDialog :model-value=\"true\" size-class=\"!max-w-xl\" @update:model-value=\"$emit('close')\">\n    <template #header>\n      <div class=\"flex w-full items-center border-b border-gray-800 px-2 pb-3\">\n        Notifications\n        <div v-if=\"muted\" class=\"ml-1.5 text-xs font-medium text-gray-400\">(Chat is muted)</div>\n      </div>\n    </template>\n    <template #default>\n      <div class=\"flex-col items-center space-y-2 px-2\">\n        <div class=\"text-xs font-medium text-gray-300\">Receive notifications for</div>\n\n        <div class=\"mb-4 mt-3 flex\">\n          <input id=\"all\" type=\"radio\" v-model=\"notificationSelected\" value=\"all\" class=\"hidden\" :disabled=\"muted\" />\n          <label for=\"all\" class=\"flex cursor-pointer items-start text-sm font-medium text-gray-100\">\n            <span\n              class=\"border-grey flex-no-shrink mr-2 mt-1 inline-block h-3 w-3 rounded-full border-2\"\n              :class=\"muted ? 'bg-white' : notificationSelected == 'all' ? 'bg-blue-600' : 'bg-white'\"\n            ></span>\n            <div>\n              <div>All new messages</div>\n              <div class=\"text-xs font-medium leading-4 text-gray-400\">Get notifications for all messages</div>\n            </div>\n          </label>\n        </div>\n\n        <div class=\"mb-4 flex flex-wrap\">\n          <input id=\"none\" type=\"radio\" :disabled=\"muted\" v-model=\"notificationSelected\" value=\"none\" class=\"hidden\" />\n          <label for=\"none\" class=\"flex cursor-pointer items-start text-sm font-medium text-gray-100\">\n            <span\n              class=\"border-grey flex-no-shrink mr-2 mt-1 inline-block h-3 w-3 rounded-full border-2\"\n              :class=\"muted ? 'bg-gray-600' : notificationSelected == 'none' ? 'bg-blue-600' : 'bg-white'\"\n            ></span>\n            <div>\n              <div>Off</div>\n              <div class=\"cursor-pointer text-xs font-medium leading-4 text-gray-400\">Don't get any notifications</div>\n            </div>\n          </label>\n        </div>\n      </div>\n    </template>\n    <template #footer>\n      <div class=\"flex w-full justify-end space-x-2 px-2\">\n        <div class=\"flex items-center space-x-2\">\n          <BaseButton type=\"secondary\" @press=\"$emit('close')\">Cancel</BaseButton>\n          <BaseButton\n            :disabled=\"muted\"\n            @click=\"\n              saveNotificationPreference([client.user.id], channel, notificationSelected);\n              $emit('close');\n            \"\n          >\n            Save\n          </BaseButton>\n        </div>\n      </div>\n    </template>\n  </BaseDialog>\n</template>\n<script setup>\nimport { ref, computed } from 'vue';\nimport { useMapGetter } from '@/store/map-state';\nimport { saveNotificationPreference } from '@/composeables/chat';\nconst { client, streamUser, mutedChannels } = useMapGetter();\nconst $emit = defineEmits(['close']);\nconst props = defineProps({\n  channel: Object,\n  user: Object\n});\nconst notificationSelected = ref(\n  props.channel.data.notification_users && props.channel.data.notification_users.includes(props.user.id)\n    ? 'all'\n    : 'none'\n);\n\nconst muted = computed(() => {\n  return mutedChannels.value.includes(props.channel.cid);\n});\n</script>\n"],"names":["client","streamUser","mutedChannels","useMapGetter","notificationSelected","ref","props","muted","computed"],"mappings":"w2CA+DM,CAAE,OAAAA,EAAQ,WAAAC,EAAY,cAAAC,CAAe,EAAGC,EAAY,EAMpDC,EAAuBC,EAC3BC,EAAM,QAAQ,KAAK,oBAAsBA,EAAM,QAAQ,KAAK,mBAAmB,SAASA,EAAM,KAAK,EAAE,EACjG,MACA,MACN,EAEMC,EAAQC,EAAS,IACdN,EAAc,MAAM,SAASI,EAAM,QAAQ,GAAG,CACtD"}