{"version":3,"file":"video.f868239f.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 }}\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 }}\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 }}\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 font-normal !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  <LayoutColumns :loading=\"!categories\">\n    <template #leftSidebar>\n      <SidebarMenu\n        :top-list=\"sorts\"\n        :bottom-list=\"categories\"\n        :is-active-item-hidden=\"isActiveCategoryHidden\"\n      >\n        <template v-if=\"isShowEventsFilter\">\n          <VideoEventsFilter\n            :items=\"videoStore.eventsFilterItems\"\n            :is-active-item-hidden=\"isActiveEventsHidden\"\n            class=\"border-t-2 border-ocean pl-4 pt-6 mt-4\"\n          />\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 { useEvents } from '~/stores/events'\nimport { useAuth } from '~/stores/auth'\nimport { useVideo } from '~/stores/video'\nimport { NavigationSortType } from '~/models/navigation'\nimport { EventsListTypeMap } from '~/models/events'\n\nconst router = useRouter()\nconst { t } = useI18n()\nconst authStore = useAuth()\nconst { getSortItems, getCategoryItems, isCategoryHidden, fetchCategories } =\n  useNavigation()\n\nconst navStore = useNavigation()\nconst { getEventsByType } = useEvents()\nconst videoStore = useVideo()\nconst topbar = ref<HTMLElement | null>(null)\n\nconst fetchEventsFilterItems = async () => {\n  if (!videoStore.eventsFilterItems.length) {\n    const events = await getEventsByType(EventsListTypeMap.Me)\n    const filterItems = events\n      ? events.map(({ id, name }) => ({\n          id,\n          label: name,\n          value: false,\n        }))\n      : []\n    videoStore.setEventsFilterItems(filterItems)\n  }\n}\n\n// we use process.server instead of onServerPrefetch to wait fetchCategories before further steps\nif (process.server) {\n  await fetchCategories()\n  authStore.auth && (await fetchEventsFilterItems())\n} else {\n  await fetchCategories()\n  authStore.auth && fetchEventsFilterItems()\n}\n\nconst sorts = getSortItems('video', [\n  NavigationSortType.Popular,\n  NavigationSortType.New,\n])\n\nconst categories = getCategoryItems('video')\n\nconst currentCategorySlug = 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 category\n})\n\nconst isActiveCategoryHidden = computed(\n  () => isCategoryHidden(currentCategorySlug.value).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: categories.value,\n    style: 'raw',\n    width: 'xl',\n  },\n])\n\nconst isVideoItemPage = computed(() =>\n  router.currentRoute.value.name?.toString().includes('item-id')\n)\n\nconst isShowEventsFilter = computed(() => {\n  return (\n    authStore.auth &&\n    !isVideoItemPage.value &&\n    videoStore.eventsFilterItems.length\n  )\n})\n\nwatch(\n  () => !!authStore.auth,\n  () => {\n    if (authStore.auth) {\n      fetchEventsFilterItems()\n    }\n  }\n)\n</script>\n"],"names":["props","__props","isExpandedByUser","ref","isExpanded","computed","toggle","isHasExpansion","sidebarBottomListMaxLength","router","useRouter","t","useI18n","authStore","useAuth","getSortItems","getCategoryItems","isCategoryHidden","fetchCategories","useNavigation","navStore","getEventsByType","useEvents","videoStore","useVideo","topbar","fetchEventsFilterItems","events","EventsListTypeMap","filterItems","id","name","__temp","__restore","_withAsyncContext","sorts","NavigationSortType","categories","currentCategorySlug","category","useCreateScreenError","isActiveCategoryHidden","isActiveEventsHidden","bottomPartIds","topbarMenu","isVideoItemPage","_a","isShowEventsFilter","watch"],"mappings":"yxCAmEA,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,4sCC7BD,MAAMC,EAASC,KACT,CAAE,EAAAC,GAAMC,KACRC,EAAYC,KACZ,CAAE,aAAAC,EAAc,iBAAAC,EAAkB,iBAAAC,EAAkB,gBAAAC,CAAA,EACxDC,IAEIC,EAAWD,IACX,CAAE,gBAAAE,GAAoBC,KACtBC,EAAaC,KACbC,EAAStB,EAAwB,IAAI,EAErCuB,EAAyB,SAAY,CACrC,GAAA,CAACH,EAAW,kBAAkB,OAAQ,CACxC,MAAMI,EAAS,MAAMN,EAAgBO,GAAkB,EAAE,EACnDC,EAAcF,EAChBA,EAAO,IAAI,CAAC,CAAE,GAAAG,EAAI,KAAAC,MAAY,CAC5B,GAAAD,EACA,MAAOC,EACP,MAAO,EAAA,EACP,EACF,CAAA,EACJR,EAAW,qBAAqBM,CAAW,CAC7C,CAAA,EAQA,CAAAG,EAAAC,CAAA,EAAAC,GAAA,IAAMhB,EAAA,CAAgB,cACtBL,EAAU,MAAQa,IAGd,MAAAS,EAAQpB,EAAa,QAAS,CAClCqB,EAAmB,QACnBA,EAAmB,GAAA,CACpB,EAEKC,EAAarB,EAAiB,OAAO,EAErCsB,EAAsBjC,EAAS,IAAM,CACzC,MAAMkC,EAAW9B,EAAO,aAAa,MAAM,OAAO,SAGhD,GAAA8B,GACA,OAAO,KAAKnB,EAAS,iBAAiB,EAAE,QACxC,CAACA,EAAS,kBAAkBmB,CAAQ,EAEpC,MAAMC,GAAqB,CACzB,QAAS,YAAYD,CAAQ,wBAAA,CAC9B,EAGI,OAAAA,CAAA,CACR,EAEKE,EAAyBpC,EAC7B,IAAMY,EAAiBqB,EAAoB,KAAK,EAAE,KAAA,EAG9CI,EAAuBrC,EAAS,IAAM,CACpC,MAAAsC,EAAgBpB,EAAW,kBAC9B,MAAMf,CAA0B,EAChC,IAAI,CAAC,CAAE,GAAAsB,CAAG,IAAMA,CAAE,EAErB,OAAOP,EAAW,sBAAsB,KAAMO,GAC5Ca,EAAc,SAASb,CAAE,CAAA,CAC3B,CACD,EAEKc,EAAiDvC,EAAS,IAAM,CACpE,CACE,MAAOM,EAAE,iBAAiB,EAC1B,MAAOwB,EAAM,MACb,MAAO,KACT,EACA,CACE,MAAOxB,EAAE,mBAAmB,EAC5B,MAAO0B,EAAW,MAClB,MAAO,MACP,MAAO,IACT,CAAA,CACD,EAEKQ,EAAkBxC,EAAS,IAC/B,OAAA,OAAAyC,EAAArC,EAAO,aAAa,MAAM,OAA1B,YAAAqC,EAAgC,WAAW,SAAS,WAAS,EAGzDC,EAAqB1C,EAAS,IAEhCQ,EAAU,MACV,CAACgC,EAAgB,OACjBtB,EAAW,kBAAkB,MAEhC,EAED,OAAAyB,GACE,IAAM,CAAC,CAACnC,EAAU,KAClB,IAAM,CACAA,EAAU,MACWa,GAE3B,CAAA"}