{"version":3,"file":"video.HsNosIgK.js","sources":["../../../../components/video/VideoEventsFilter.vue","../../../../pages/video.vue"],"sourcesContent":["<template>\n  <div>\n    <div\n      v-if=\"isScrollView\"\n      class=\"flex flex-col gap-y-3 max-h-[140px] overflow-y-scroll scrollbar pr-2\"\n    >\n      <template v-for=\"item in items\" :key=\"item.id\">\n        <BaseCheckbox v-model=\"item.value\" background-class=\"bg-white\">\n          <template #label>\n            <div class=\"font-normal\">\n              {{ item.label }}&nbsp;&nbsp;<span\n                v-if=\"item.count\"\n                class=\"text-gray-700 text-nowrap\"\n                >({{ item.count }})\n              </span>\n            </div>\n          </template>\n        </BaseCheckbox>\n      </template>\n    </div>\n\n    <div v-else class=\"flex flex-col gap-y-3\">\n      <template\n        v-for=\"item in items.slice(0, sidebarBottomListMaxLength)\"\n        :key=\"item.id\"\n      >\n        <BaseCheckbox v-model=\"item.value\" background-class=\"bg-white\">\n          <template #label>\n            <div class=\"font-normal\">\n              {{ item.label }}&nbsp;&nbsp;<span\n                v-if=\"item.count\"\n                class=\"text-gray-700 text-nowrap\"\n                >({{ item.count }})\n              </span>\n            </div>\n          </template>\n        </BaseCheckbox>\n      </template>\n      <template v-if=\"isExpanded && isHasExpansion\">\n        <template\n          v-for=\"item in items.slice(sidebarBottomListMaxLength)\"\n          :key=\"item.id\"\n        >\n          <BaseCheckbox v-model=\"item.value\" background-class=\"bg-white\">\n            <template #label>\n              <div class=\"font-normal\">\n                {{ item.label }}&nbsp;&nbsp;<span\n                  v-if=\"item.count\"\n                  class=\"text-gray-700 text-nowrap\"\n                  >({{ item.count }})\n                </span>\n              </div>\n            </template>\n          </BaseCheckbox>\n        </template>\n      </template>\n      <BaseButton\n        v-if=\"isHasExpansion && !isActiveItemHidden\"\n        look=\"none\"\n        justify=\"start\"\n        class=\"font-normal text-primary hover:text-primary-500 transition duration-150 ease-in-out !pl-0\"\n        @click=\"toggle\"\n      >\n        {{ isExpanded ? $t('common.less') : $t('common.more') }}\n      </BaseButton>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { sidebarBottomListMaxLength } from '~/models/menu'\nimport type { CheckboxFilterItem } from '~/models/common'\n\ninterface PropsInterface {\n  items: CheckboxFilterItem[]\n  isScrollView?: boolean\n  isActiveItemHidden?: boolean\n}\n\nconst props = withDefaults(defineProps<PropsInterface>(), {\n  isScrollView: false,\n  isActiveItemHidden: false,\n})\n\nconst isExpandedByUser = ref(false)\n\nconst isExpanded = computed(() => {\n  return isExpandedByUser.value || props.isActiveItemHidden\n})\n\nconst toggle = () => {\n  isExpandedByUser.value = !isExpandedByUser.value\n}\n\nconst isHasExpansion = computed(() => {\n  return props.items && props.items.length > sidebarBottomListMaxLength\n})\n</script>\n\n<style scoped>\n.scrollbar::-webkit-scrollbar {\n  width: 4px;\n}\n\n.scrollbar::-webkit-scrollbar-track {\n  background: #d2d2d2;\n}\n\n.scrollbar::-webkit-scrollbar-thumb {\n  background-color: #909090;\n  border-radius: 2px;\n}\n</style>\n","<template>\n  <!-- TODO: consider to refactor: move sidebar to specific pages -->\n  <LayoutColumns :loading=\"!navStore.categoriesList.length\">\n    <template #leftSidebar>\n      <SidebarMenu\n        :top-list=\"sorts\"\n        :bottom-list=\"categoryMenuItems\"\n        :is-active-item-hidden=\"isActiveCategoryHidden\"\n        show-bottom-loading\n      >\n        <template v-if=\"isShowEventsFilter\">\n          <VideoEventsFilter\n            v-if=\"\n              !videoStore.isFiltersLoading && !videoStore.isCategoryChanging\n            \"\n            :items=\"videoStore.eventsFilterItems\"\n            :is-active-item-hidden=\"isActiveEventsHidden\"\n            class=\"border-t-2 border-ocean pl-4 pt-6 mt-4\"\n            :class=\"\n              showEventsFilterLoader &&\n              'pointer-events-none opacity-80 transition-all'\n            \"\n          />\n          <div\n            v-else\n            class=\"border-t-2 border-ocean pt-6 mt-4 flex justify-center\"\n          >\n            <BaseSpinner size=\"sm\" />\n          </div>\n        </template>\n      </SidebarMenu>\n    </template>\n    <LayoutWithRightSidebar>\n      <template v-if=\"!isVideoItemPage\" #rightSidebar>\n        <NewsRightSidebar />\n      </template>\n      <div ref=\"topbar\">\n        <TopbarMenu :menu-list=\"topbarMenu\">\n          <template v-if=\"isShowEventsFilter\">\n            <TopbarDropdown\n              :title=\"t('menu.events')\"\n              :hide-on-click=\"false\"\n              width=\"xl\"\n            >\n              <VideoEventsFilter\n                :items=\"videoStore.eventsFilterItems\"\n                is-scroll-view\n                class=\"p-1\"\n              />\n            </TopbarDropdown>\n          </template>\n        </TopbarMenu>\n        <NuxtPage />\n      </div>\n    </LayoutWithRightSidebar>\n  </LayoutColumns>\n</template>\n\n<script setup lang=\"ts\">\nimport { useI18n } from 'vue-i18n'\nimport type { ComputedRef } from 'vue'\nimport { useNavigation } from '~/stores/navigation'\nimport type { TopbarMenuInterface } from '~/models/menu'\nimport { sidebarBottomListMaxLength } from '~/models/menu'\nimport { useVideo } from '~/stores/video'\nimport { NavigationSortType } from '~/models/navigation'\n\nconst router = useRouter()\nconst { t } = useI18n()\nconst { getSortItems, isCategoryHidden, fetchCategories } = useNavigation()\n\nconst navStore = useNavigation()\nconst videoStore = useVideo()\nconst topbar = ref<HTMLElement | null>(null)\n\nconst categoryMenuItems = computed(() =>\n  videoStore.filters?.categories.map((category) => {\n    return navStore.getCategoryFilterItem('video', category)\n  })\n)\n\nonServerPrefetch(async () => {\n  await fetchCategories()\n  // on server we need to fetch correct filters on initial loading to avoid SSR rehydration issues\n  await videoStore.fetchFilters(\n    currentCategory.value ? [currentCategory.value.id] : undefined\n  )\n  // we have to do it here due to nuxt issue on SSR render:\n  // updates made after the onServerPrefetch complete not cause rerender VideoEventsFilter component\n  videoStore.setEventsFilterItemsValue(videoStore.getEventIdsFromQuery())\n})\n\nonMounted(async () => {\n  // for some reason isHydrating is true here despite SSR false\n  if (!useNuxtApp().isHydrating || useRuntimeConfig().public.isApp) {\n    await fetchCategories()\n    // we need to load filters only for single video item on client otherwise it is on VideoListPageContent.vue\n    isVideoItemPage.value &&\n      (await videoStore.fetchFilters(\n        currentCategory.value ? [currentCategory.value.id] : undefined\n      ))\n  }\n})\n\nconst sorts = getSortItems('video', [\n  NavigationSortType.Popular,\n  NavigationSortType.All,\n])\n\nconst currentCategory = computed(() => {\n  const category = router.currentRoute.value.params.category as string\n\n  if (\n    category &&\n    Object.keys(navStore.categoriesSlugMap).length &&\n    !navStore.categoriesSlugMap[category]\n  ) {\n    throw useCreateScreenError({\n      message: `category ${category} is not found on video`,\n    })\n  }\n\n  return navStore.categoriesSlugMap[category]\n})\n\nconst isActiveCategoryHidden = computed(\n  () => isCategoryHidden(currentCategory.value?.slug).value\n)\n\nconst isActiveEventsHidden = computed(() => {\n  const bottomPartIds = videoStore.eventsFilterItems\n    .slice(sidebarBottomListMaxLength)\n    .map(({ id }) => id)\n\n  return videoStore.eventsFilterActiveIds.some((id) =>\n    bottomPartIds.includes(id)\n  )\n})\n\nconst topbarMenu: ComputedRef<TopbarMenuInterface[]> = computed(() => [\n  {\n    title: t('menu.all_videos'),\n    items: sorts.value,\n    style: 'col',\n  },\n  {\n    title: t('common.categories'),\n    items: categoryMenuItems.value || [],\n    style: 'row',\n    width: 'xl',\n  },\n])\n\nconst isVideoItemPage = computed(() =>\n  router.currentRoute.value.name?.toString().includes('item-id')\n)\n\nconst showEventsFilterLoader = computed(\n  () =>\n    (videoStore.isFiltersLoading && categoryMenuItems !== undefined) ||\n    (!videoStore.list.loaded && !isVideoItemPage.value && process.client)\n)\n\nconst isShowEventsFilter = computed(() => {\n  return !isVideoItemPage.value && videoStore.eventsFilterItems.length\n})\n</script>\n"],"names":["props","__props","isExpandedByUser","ref","isExpanded","computed","toggle","isHasExpansion","sidebarBottomListMaxLength","router","useRouter","t","useI18n","getSortItems","isCategoryHidden","fetchCategories","useNavigation","navStore","videoStore","useVideo","topbar","categoryMenuItems","_a","category","onMounted","useNuxtApp","useRuntimeConfig","isVideoItemPage","currentCategory","sorts","NavigationSortType","useCreateScreenError","isActiveCategoryHidden","isActiveEventsHidden","bottomPartIds","id","topbarMenu","showEventsFilterLoader","isShowEventsFilter"],"mappings":"sqCA+EA,MAAMA,EAAQC,EAKRC,EAAmBC,EAAI,EAAK,EAE5BC,EAAaC,EAAS,IACnBH,EAAiB,OAASF,EAAM,kBACxC,EAEKM,EAAS,IAAM,CACFJ,EAAA,MAAQ,CAACA,EAAiB,KAAA,EAGvCK,EAAiBF,EAAS,IACvBL,EAAM,OAASA,EAAM,MAAM,OAASQ,CAC5C,i8CC7BD,MAAMC,EAASC,IACT,CAAE,EAAAC,GAAMC,IACR,CAAE,aAAAC,EAAc,iBAAAC,EAAkB,gBAAAC,GAAoBC,EAAc,EAEpEC,EAAWD,IACXE,EAAaC,KACbC,EAASjB,EAAwB,IAAI,EAErCkB,EAAoBhB,EAAS,IAAA,OACjC,OAAAiB,EAAAJ,EAAW,UAAX,YAAAI,EAAoB,WAAW,IAAKC,GAC3BN,EAAS,sBAAsB,QAASM,CAAQ,GACxD,EAcHC,EAAU,SAAY,EAEhB,CAACC,EAAW,EAAE,aAAeC,GAAiB,EAAE,OAAO,SACzD,MAAMX,EAAgB,EAENY,EAAA,OACb,MAAMT,EAAW,aAChBU,EAAgB,MAAQ,CAACA,EAAgB,MAAM,EAAE,EAAI,MAAA,EAE3D,CACD,EAEK,MAAAC,EAAQhB,EAAa,QAAS,CAClCiB,EAAmB,QACnBA,EAAmB,GAAA,CACpB,EAEKF,EAAkBvB,EAAS,IAAM,CACrC,MAAMkB,EAAWd,EAAO,aAAa,MAAM,OAAO,SAGhD,GAAAc,GACA,OAAO,KAAKN,EAAS,iBAAiB,EAAE,QACxC,CAACA,EAAS,kBAAkBM,CAAQ,EAEpC,MAAMQ,GAAqB,CACzB,QAAS,YAAYR,CAAQ,wBAAA,CAC9B,EAGI,OAAAN,EAAS,kBAAkBM,CAAQ,CAAA,CAC3C,EAEKS,EAAyB3B,EAC7B,IAAA,OAAM,OAAAS,GAAiBQ,EAAAM,EAAgB,QAAhB,YAAAN,EAAuB,IAAI,EAAE,MAAA,EAGhDW,EAAuB5B,EAAS,IAAM,CACpC,MAAA6B,EAAgBhB,EAAW,kBAC9B,MAAMV,CAA0B,EAChC,IAAI,CAAC,CAAE,GAAA2B,CAAG,IAAMA,CAAE,EAErB,OAAOjB,EAAW,sBAAsB,KAAMiB,GAC5CD,EAAc,SAASC,CAAE,CAAA,CAC3B,CACD,EAEKC,EAAiD/B,EAAS,IAAM,CACpE,CACE,MAAOM,EAAE,iBAAiB,EAC1B,MAAOkB,EAAM,MACb,MAAO,KACT,EACA,CACE,MAAOlB,EAAE,mBAAmB,EAC5B,MAAOU,EAAkB,OAAS,CAAC,EACnC,MAAO,MACP,MAAO,IACT,CAAA,CACD,EAEKM,EAAkBtB,EAAS,IAC/B,OAAA,OAAAiB,EAAAb,EAAO,aAAa,MAAM,OAA1B,YAAAa,EAAgC,WAAW,SAAS,WAAS,EAGzDe,EAAyBhC,EAC7B,IACGa,EAAW,kBAAoBG,IAAsB,QACrD,CAACH,EAAW,KAAK,QAAU,CAACS,EAAgB,OAAS,EAAA,EAGpDW,EAAqBjC,EAAS,IAC3B,CAACsB,EAAgB,OAAST,EAAW,kBAAkB,MAC/D"}