{"version":3,"file":"AddToFavorites-C4g_RVWy.js","sources":["../../Vue/src/components/AboveFoldSplash/AddToFavorites.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport Dropdown from \"../Dropdown/Dropdown.vue\";\r\nimport { RaygunFunctions } from \"@/config/RayGun\";\r\n\r\nconst fav = useFavStore();\r\nconst profile = useProfileStore();\r\nconst route = useRoute();\r\nconst modals = useModalStore();\r\nconst props = defineProps<{\r\n  showId?: string;\r\n  songNumber: string;\r\n  title: string | null;\r\n  fitToContainer?: boolean;\r\n  onBusyBg?: boolean;\r\n}>();\r\nconst toast = useToastStore();\r\nconst favorite = ref(false);\r\nconst { t } = useI18n();\r\nconst id = computed(() => (route.params.id as string) || \"\");\r\n\r\nasync function onRemoveSongFromCurrentList() {\r\n  await fav.removeSongFromList(id.value, props.songNumber);\r\n  toast.successToast(\r\n    t(\"SV._LIT_SongRemovedFromCurrentList\", {\r\n      title: props.title,\r\n    }),\r\n  );\r\n  emitter.emit(\"songListUpdated\", id.value);\r\n  trackDropdownAction(\"remove from current list\");\r\n}\r\nonMounted(() => checkFavStatus());\r\nwatch(\r\n  () => props.songNumber,\r\n  () => checkFavStatus(),\r\n);\r\n\r\nfunction checkFavStatus() {\r\n  if (!props.songNumber) {\r\n    return;\r\n  }\r\n  if (!profile.profile?.signedIn) {\r\n    favorite.value = false;\r\n    return;\r\n  }\r\n  favorite.value = false;\r\n  if (fav.favSongNumbers?.includes) {\r\n    favorite.value = fav.favSongNumbers?.includes(props.songNumber);\r\n  } else if (fav.favSongNumbers && !fav.favSongNumbers.includes) {\r\n    RaygunFunctions.sendSilentError(\"favSongNumbers doesn't have 'include'\", {\r\n      favSongNumbers: fav.favSongNumbers,\r\n      typeofFavSongNumbers: typeof fav.favSongNumbers,\r\n      songNumber: props.songNumber,\r\n    });\r\n  }\r\n}\r\n\r\nconst onCurrentListView = computed(() => route.name === \"favorites-list\");\r\nasync function toggleFavorite() {\r\n  if (!profile.profile?.signedIn) {\r\n    modals.showModal(\"SubscriberFeatureModal\");\r\n  } else {\r\n    favorite.value = !favorite.value;\r\n    if (!favorite.value) {\r\n      await fav.removeFromFavorites(props.songNumber);\r\n      toast.successToast(\r\n        t(\"SV.MES_RemovedFromFavoritesSuccess\", {\r\n          title: props.title,\r\n        }),\r\n      );\r\n      trackDropdownAction(\"remove from personal favorites\");\r\n    } else {\r\n      await fav.addToFavorites(props.songNumber);\r\n      toast.successToast(\r\n        t(\"SV.MES_AddedToFavoritesSuccess\", { title: props.title }),\r\n      );\r\n      trackDropdownAction(\"add to personal favorites\");\r\n    }\r\n    checkFavStatus();\r\n  }\r\n}\r\n\r\nfunction addToSharedList(songNumber: string) {\r\n  fav.addSongToSharedList(songNumber);\r\n  trackDropdownAction(\"add to shared list\");\r\n}\r\n\r\nfunction trackDropdownAction(action: string) {\r\n  // GTM Tracking\r\n  (window as any).dataLayer.push({\r\n    event: \"favoritesDropdownAction\",\r\n    dropdown_action_type: action,\r\n    song_number: props.songNumber,\r\n  });\r\n  // Clear song_number\r\n  (window as any).dataLayer.push({\r\n    song_number: undefined,\r\n  });\r\n}\r\n\r\nconst dropdown = ref<InstanceType<typeof Dropdown>>();\r\n\r\nwatch(\r\n  () => dropdown.value?.enableDOM,\r\n  (value) => {\r\n    props.showId && emitter.emit(\"alwaysShowId\", props.showId);\r\n  },\r\n);\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    v-if=\"songNumber && title\"\r\n    class=\"add-to-favorites\"\r\n    :class=\"{ 'fit-to-container': fitToContainer, 'on-busy-bg': onBusyBg }\"\r\n  >\r\n    <Dropdown\r\n      v-if=\"fav.enableSharedFavorites && profile.profile?.isAdmin\"\r\n      ref=\"dropdown\"\r\n      :class=\"{ 'favorite-active': favorite || onCurrentListView }\"\r\n      class=\"favorite dropdown-end\"\r\n      @click.stop.prevent\r\n    >\r\n      <template #btn-label>\r\n        <FAIcon class=\"fa-solid fa-heart\" />\r\n        <span\r\n          v-if=\"favorite\"\r\n          class=\"sr-only\"\r\n          >{{ $t(\"S.LIT_RemoveFromFavorites\") }}</span\r\n        ><span\r\n          v-else\r\n          class=\"sr-only\"\r\n          >{{ $t(\"S.LIT_AddToFavorites\") }}</span\r\n        >\r\n      </template>\r\n\r\n      <DropdownItem\r\n        v-if=\"!favorite\"\r\n        icon-before=\"fa-light fa-plus\"\r\n        class=\"ga-favorites-dropdown\"\r\n        @click=\"toggleFavorite\"\r\n        >{{ $t(\"SV.LIT_AddToPersonalList\") }}</DropdownItem\r\n      >\r\n      <DropdownItem\r\n        v-else\r\n        icon-before=\"fa-light fa-minus-circle\"\r\n        class=\"ga-favorites-dropdown\"\r\n        @click=\"toggleFavorite\"\r\n        >{{ $t(\"SV.LIT_RemoveFromPersonalList\") }}</DropdownItem\r\n      >\r\n\r\n      <DropdownItem\r\n        v-if=\"onCurrentListView\"\r\n        icon-before=\"fa-light fa-minus-circle\"\r\n        class=\"ga-favorites-dropdown\"\r\n        @click=\"onRemoveSongFromCurrentList\"\r\n        >{{ $t(\"SV.LIT_RemoveFromCurrentSharedList\") }}</DropdownItem\r\n      >\r\n      <DropdownItem\r\n        icon-before=\"fa-light fa-album-collection-circle-plus\"\r\n        class=\"ga-favorites-dropdown\"\r\n        @click=\"addToSharedList(songNumber)\"\r\n        >{{ $t(\"SV.LIT_AddToSharedList\") }}</DropdownItem\r\n      >\r\n    </Dropdown>\r\n    <div\r\n      v-else\r\n      class=\"favorite\"\r\n      :class=\"{ 'favorite-active': favorite }\"\r\n    >\r\n      <button\r\n        type=\"button\"\r\n        class=\"btn\"\r\n        @click.stop.prevent=\"toggleFavorite\"\r\n      >\r\n        <FAIcon class=\"fa-solid fa-heart\" />\r\n        <span\r\n          v-if=\"favorite\"\r\n          class=\"sr-only\"\r\n          >{{ $t(\"S.LIT_RemoveFromFavorites\") }}</span\r\n        ><span\r\n          v-else\r\n          class=\"sr-only\"\r\n          >{{ $t(\"S.LIT_AddToFavorites\") }}</span\r\n        >\r\n      </button>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\">\r\n.favorite {\r\n  @apply block;\r\n}\r\n.favorite:deep() {\r\n  .btn {\r\n    min-height: unset;\r\n    height: 100%;\r\n    @apply rounded border-none bg-transparent p-2 text-gray-300 shadow-none transition-all;\r\n    &:hover {\r\n      @apply bg-white  text-gray-400;\r\n    }\r\n  }\r\n}\r\n.add-to-favorites.on-busy-bg:deep() {\r\n  .btn {\r\n    @apply h-8 w-8 rounded-full bg-white/25 text-white transition-all;\r\n    &:hover,\r\n    &:focus-visible {\r\n      @apply brightness-90;\r\n    }\r\n  }\r\n}\r\n\r\n.favorite.favorite-active {\r\n  &:deep() {\r\n    .btn {\r\n      i,\r\n      svg {\r\n        @apply text-red-500;\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\n.fit-to-container {\r\n  @apply h-full w-full;\r\n  :deep() {\r\n    .dropdown {\r\n      @apply h-full w-full;\r\n      .btn {\r\n        @apply flex h-full w-full items-center justify-center;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n"],"names":["fav","useFavStore","profile","useProfileStore","route","useRoute","modals","useModalStore","props","__props","toast","useToastStore","favorite","ref","t","useI18n","id","computed","onRemoveSongFromCurrentList","emitter","trackDropdownAction","onMounted","checkFavStatus","watch","_a","_b","_c","RaygunFunctions","onCurrentListView","toggleFavorite","addToSharedList","songNumber","action","dropdown","value"],"mappings":"wiBAIA,MAAMA,EAAMC,IACNC,EAAUC,IACVC,EAAQC,IACRC,EAASC,IACTC,EAAQC,EAORC,EAAQC,IACRC,EAAWC,EAAI,EAAK,EACpB,CAAE,EAAAC,GAAMC,EAAAA,UACRC,EAAKC,EAAS,IAAOb,EAAM,OAAO,IAAiB,EAAE,EAE3D,eAAec,GAA8B,CAC3C,MAAMlB,EAAI,mBAAmBgB,EAAG,MAAOR,EAAM,UAAU,EACjDE,EAAA,aACJI,EAAE,qCAAsC,CACtC,MAAON,EAAM,KAAA,CACd,CAAA,EAEKW,EAAA,KAAK,kBAAmBH,EAAG,KAAK,EACxCI,EAAoB,0BAA0B,CAChD,CACUC,EAAA,IAAMC,GAAgB,EAChCC,EACE,IAAMf,EAAM,WACZ,IAAMc,EAAe,CAAA,EAGvB,SAASA,GAAiB,WACpB,GAACd,EAAM,WAGP,IAAA,GAACgB,EAAAtB,EAAQ,UAAR,MAAAsB,EAAiB,UAAU,CAC9BZ,EAAS,MAAQ,GACjB,MACF,CACAA,EAAS,MAAQ,IACba,EAAAzB,EAAI,iBAAJ,MAAAyB,EAAoB,SACtBb,EAAS,OAAQc,EAAA1B,EAAI,iBAAJ,YAAA0B,EAAoB,SAASlB,EAAM,YAC3CR,EAAI,gBAAkB,CAACA,EAAI,eAAe,UACnD2B,EAAgB,gBAAgB,wCAAyC,CACvE,eAAgB3B,EAAI,eACpB,qBAAsB,OAAOA,EAAI,eACjC,WAAYQ,EAAM,UAAA,CACnB,EAEL,CAEA,MAAMoB,EAAoBX,EAAS,IAAMb,EAAM,OAAS,gBAAgB,EACxE,eAAeyB,GAAiB,QACzBL,EAAAtB,EAAQ,UAAR,MAAAsB,EAAiB,UAGXZ,EAAA,MAAQ,CAACA,EAAS,MACtBA,EAAS,OASN,MAAAZ,EAAI,eAAeQ,EAAM,UAAU,EACnCE,EAAA,aACJI,EAAE,iCAAkC,CAAE,MAAON,EAAM,MAAO,CAAA,EAE5DY,EAAoB,2BAA2B,IAZzC,MAAApB,EAAI,oBAAoBQ,EAAM,UAAU,EACxCE,EAAA,aACJI,EAAE,qCAAsC,CACtC,MAAON,EAAM,KAAA,CACd,CAAA,EAEHY,EAAoB,gCAAgC,GAQvCE,KAlBfhB,EAAO,UAAU,wBAAwB,CAoB7C,CAEA,SAASwB,EAAgBC,EAAoB,CAC3C/B,EAAI,oBAAoB+B,CAAU,EAClCX,EAAoB,oBAAoB,CAC1C,CAEA,SAASA,EAAoBY,EAAgB,CAE1C,OAAe,UAAU,KAAK,CAC7B,MAAO,0BACP,qBAAsBA,EACtB,YAAaxB,EAAM,UAAA,CACpB,EAEA,OAAe,UAAU,KAAK,CAC7B,YAAa,MAAA,CACd,CACH,CAEA,MAAMyB,EAAWpB,IAEjB,OAAAU,EACE,IAAM,OAAA,OAAAC,EAAAS,EAAS,QAAT,YAAAT,EAAgB,WACrBU,GAAU,CACT1B,EAAM,QAAUW,EAAQ,KAAK,eAAgBX,EAAM,MAAM,CAC3D,CAAA"}