{"version":3,"mappings":"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","names":["props","__props","parsedDescription","ref","memberCount","mapEl","onMounted","leaflet","__vitePreload","__vite_default__","n","branchMap","icon","branch","popupContent","latlng","_a","toRaw","pageSize","route","useRoute","router","useRouter","useHead","isMapView","currentPage","computed","searchFilter","s","searchValue","searchField","submitSearch","clearSearch","categoryFilter","v","categories","categoryValue","setCategory","clearCategory","filter","totalCount","useAsyncData","useDirectus","results","branches","pending","__temp","__restore","_withAsyncContext","readItems"],"ignoreList":[],"sources":["../../../../components/Branch/SmallPreview.vue","../../../../components/Branch/Map.client.vue","../../../../pages/groups/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Branches } from \"~/types/directus-collections.d.ts\";\n\nconst props = defineProps<{\n  branch: Branches;\n}>();\n\nconst parsedDescription = ref<string | null>(null);\nconst memberCount = ref<number | null>(null);\n\nif (props.branch.description) {\n  // Remove HTML tags from description\n  parsedDescription.value = props.branch.description.replace(/<\\/?[^>]+(>|$)/g, \"\");\n\n  // Trim description to 150 characters\n  if (parsedDescription.value.length > 150) {\n    parsedDescription.value = parsedDescription.value.slice(0, 150) + \"[...]\";\n  }\n}\n\nif (props.branch.branch_members_count) {\n  memberCount.value = props.branch.branch_members_count;\n}\n</script>\n\n<template>\n  <div class=\"space-y-4 rounded-lg bg-white px-12 py-10\">\n    <div class=\"flex flex-col items-start justify-between gap-4 md:flex-row\">\n      <NuxtLink :to=\"{ name: 'groups-slug', params: { slug: branch.slug } }\">\n        <h3 class=\"text-2xl\">{{ branch.title }}</h3>\n      </NuxtLink>\n      <div class=\"shrink-0 rounded-md bg-primary p-2 text-white\">{{ branch.category }} - {{ memberCount }} Members</div>\n    </div>\n    <p class=\"text-lg\">{{ parsedDescription }}</p>\n    <div class=\"flex flex-wrap items-center gap-4 pt-4\">\n      <CommonButtonNuxtLink class=\"grow\" :to=\"{ name: 'groups-slug', params: { slug: branch.slug } }\">Group Details</CommonButtonNuxtLink>\n      <CommonButtonNuxtLink\n        v-if=\"branch.accept_donation && branch.stripe_id\"\n        class=\"grow\"\n        icon=\"fa-solid fa-hand-holding-dollar\"\n        btn-style=\"secondary\"\n        btn-hover-style=\"primary\"\n        :to=\"{ name: 'groups-slug', params: { slug: branch.slug } }\"\n        >Support</CommonButtonNuxtLink\n      >\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport \"leaflet/dist/leaflet.css\";\nimport type { Branches } from \"~/types/directus-collections.d.ts\";\n\nconst props = defineProps<{\n  branches: Branches[];\n}>();\n\nconst mapEl = ref<HTMLDivElement | null>(null);\n\nonMounted(async () => {\n  const leaflet = (await import(\"leaflet\")).default;\n\n  const branchMap = ref<leaflet.Map | null>(null);\n  // Fix default icon base path\n  const icon = leaflet.icon({\n    iconUrl: \"/map-marker-custom.svg\",\n    iconSize: [16, 21],\n    iconAnchor: [8, 0],\n  });\n\n  if (!mapEl.value) {\n    console.warn(\"Leaflet map element not found\");\n    return;\n  }\n\n  branchMap.value = leaflet.map(mapEl.value, {\n    center: [-42.17560998930404, 146.60608410768896],\n    maxBounds: [\n      [-44.3359, 143.3863],\n      [-39.2197, 149.0662],\n    ],\n    zoom: 7,\n    minZoom: 7,\n    zoomControl: false,\n  });\n\n  leaflet\n    .tileLayer(\"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\", {\n      attribution:\n        'Map data &copy; <a href=\"https://www.openstreetmap.org/\">OpenStreetMap</a> contributors, <a href=\"https://creativecommons.org/licenses/by-sa/2.0/\">CC-BY-SA</a>',\n    })\n    .addTo(branchMap.value);\n\n  if (props.branches.length) {\n    props.branches.forEach((branch) => {\n      if (!branch.location) return;\n\n      const popupContent = `\n        <div class=\"text-center space-y-3\">\n          <div class=\"text-lg font-semibold\">${branch.title}</div>\n          <div class=\"text-sm text-accentDark\">${\n            branch.description && branch.description.length > 200 ? branch.description.slice(0, 200) + \"...\" : branch.description\n          }</div>\n        </div>\n      `;\n      const latlng = leaflet.latLng(branch.location?.coordinates.reverse());\n      if (latlng) {\n        const marker = leaflet.marker(latlng, { icon }).addTo(toRaw(branchMap.value));\n        marker.bindPopup(popupContent, {\n          maxWidth: 250,\n          className: \"rounded-lg\",\n        });\n      }\n    });\n  }\n});\n</script>\n\n<template>\n  <div id=\"map\" ref=\"mapEl\" class=\"relative z-0 aspect-[8/9] w-full bg-tertiary\"></div>\n</template>\n","<script setup lang=\"ts\">\nimport { Listbox, ListboxButton, ListboxOptions, ListboxOption } from \"@headlessui/vue\";\nimport type { Branches } from \"~/types/directus-collections.d.ts\";\nconst route = useRoute();\nconst router = useRouter();\n\nuseHead({\n  title: \"Groups\",\n});\n\nconst isMapView = ref(true);\n\n// Pagination\nconst pageSize = 7;\nconst currentPage = computed({\n  get: () => (typeof route.query.page === \"string\" && !isNaN(parseInt(route.query.page, 10)) ? parseInt(route.query.page, 10) : 1),\n  set: (i) => router.replace({ query: { ...route.query, page: i } }),\n});\n\n// Search Filter\nconst searchFilter = computed({\n  get: () => (typeof route.query.search === \"string\" ? route.query.search : undefined),\n  set: (s) => router.replace({ query: { ...route.query, search: s, page: 1 } }),\n});\n\nconst searchValue = ref(searchFilter.value || \"\");\nconst searchField = ref<HTMLElement>();\nfunction submitSearch() {\n  searchFilter.value = searchValue.value;\n  searchField.value?.focus();\n}\nfunction clearSearch() {\n  searchFilter.value = searchValue.value = \"\";\n  searchField.value?.focus();\n}\n\n// Category filter\nconst categoryFilter = computed({\n  get: () => (typeof route.query.category === \"string\" ? route.query.category : undefined),\n  set: (v) => {\n    router.replace({ query: { ...route.query, category: v, page: 1 } });\n  },\n});\nconst categories = [\"Coastal\", \"Community\", \"Education\", \"Flora\", \"Heritage\", \"Islands\", \"Karst\", \"Marine\", \"Whales\", \"Wildlife\"];\nconst categoryValue = ref(categoryFilter.value || \"\");\n\nfunction setCategory() {\n  categoryFilter.value = categoryValue.value;\n}\n\nfunction clearCategory() {\n  categoryFilter.value = categoryValue.value = \"\";\n}\n\n// Filter for query\n\nconst filter = computed(() => {\n  const filter: Record<string, unknown> = {\n    status: { _eq: \"published\" },\n  };\n  if (categoryFilter.value && categoryFilter.value.length) {\n    filter.category = { _eq: categoryFilter.value };\n  }\n  if (isMapView.value) {\n    filter.location = { _neq: null };\n  }\n  return filter;\n});\n\nconst { data: totalCount } = useAsyncData(\n  () =>\n    useDirectus(() => ({\n      path: `/count-collections/branches`,\n      method: \"GET\",\n      params: {\n        filter: filter.value,\n        search: searchFilter.value || \"\",\n      },\n    })).then((results: any) => results.count),\n  {\n    watch: [currentPage, searchFilter, filter],\n    default: () => 0,\n  }\n);\n\n// Fetching branch data\nconst { data: branches, pending } = await useAsyncData(\n  () =>\n    useDirectus(\n      readItems(\"branches\", {\n        fields: [\"*\", \"count(branch_members)\"],\n        filter: filter.value,\n        sort: \"title\",\n        search: searchFilter.value || \"\",\n        limit: isMapView.value ? -1 : pageSize,\n        page: isMapView.value ? 1 : currentPage.value,\n      })\n    ),\n  {\n    watch: [currentPage, searchFilter, filter, isMapView],\n    default: () => [] as Branches[],\n  }\n);\n</script>\n\n<template>\n  <div class=\"bg-gray\">\n    <CommonPageBanner :local-asset=\"true\" image=\"/banner-tasmanian-beach.jpg\" size=\"small\">\n      <p class=\"font-script text-xl md:text-2xl xl:text-3xl\">Discover and Join</p>\n      <h1 class=\"text-4xl font-semibold md:text-6xl xl:text-banner\">Wildcare Groups</h1>\n    </CommonPageBanner>\n    <div class=\"bg-primary\">\n      <CommonContainer>\n        <div class=\"flex flex-col items-center justify-between space-y-8 py-6 text-white md:flex-row md:space-x-8 md:space-y-0\">\n          <form class=\"relative max-w-[300px] grow xl:max-w-[400px]\" @submit.prevent=\"submitSearch\">\n            <input\n              ref=\"searchField\"\n              v-model=\"searchValue\"\n              name=\"search\"\n              type=\"text\"\n              placeholder=\"Begin your search\"\n              class=\"w-full rounded-full bg-white/5 py-3 pl-8 pr-12 text-white placeholder:text-white\"\n              @keyup.esc=\"clearSearch\"\n            />\n            <div class=\"absolute inset-y-0 right-3 flex\">\n              <button type=\"submit\" class=\"flex w-9 items-center justify-center\">\n                <font-awesome-icon icon=\"fa-solid fa-search\" />\n              </button>\n              <button v-if=\"searchFilter\" class=\"flex w-9 items-center justify-center\" @click=\"clearSearch\">\n                <font-awesome-icon icon=\"fa-solid fa-close\" />\n              </button>\n            </div>\n          </form>\n          <div class=\"mx-auto flex h-8 items-center gap-8 border-x-2 border-x-white/50 px-8 font-semibold text-white\">\n            <button :class=\"[isMapView ? 'text-secondary' : '']\" @click=\"isMapView = true\">Map</button>\n            <button :class=\"[isMapView ? '' : 'text-secondary']\" @click=\"isMapView = false\">List</button>\n          </div>\n          <Listbox v-model=\"categoryValue\">\n            <div class=\"relative mt-1 flex max-w-[300px] grow items-center justify-end gap-4 xl:max-w-[400px]\">\n              <button\n                v-if=\"categoryValue\"\n                class=\"mx-2 flex w-9 items-center justify-center gap-x-2 text-sm uppercase\"\n                @click=\"clearCategory\"\n              >\n                <font-awesome-icon icon=\"fa-solid fa-close\" size=\"xl\" />\n                clear\n              </button>\n              <ListboxButton class=\"flex w-fit items-center gap-x-3 rounded-full bg-white/5 px-8 py-5 text-sm uppercase md:text-base\">\n                <font-awesome-icon icon=\"fa-solid fa-angle-down\" />\n                {{ categoryValue ? categoryValue : \"Pick Category\" }}\n              </ListboxButton>\n              <Transition leave-active-class=\"transition duration-100 ease-in\" leave-from-class=\"opacity-100\" leave-to-class=\"opacity-0\">\n                <ListboxOptions class=\"absolute z-50 mt-1 w-full overflow-auto rounded-md bg-primary\">\n                  <ListboxOption\n                    v-for=\"category in categories\"\n                    :key=\"category\"\n                    :value=\"category\"\n                    class=\"bg-white/5 p-2 text-sm uppercase transition hover:cursor-pointer hover:bg-secondary hover:text-black md:text-base\"\n                    @click=\"setCategory()\"\n                  >\n                    {{ category }}\n                  </ListboxOption>\n                </ListboxOptions>\n              </Transition>\n            </div>\n          </Listbox>\n        </div>\n      </CommonContainer>\n    </div>\n    <div v-if=\"pending\" class=\"flex items-center justify-center py-[--y-margin]\">\n      <font-awesome-icon class=\"mr-3 text-primary\" icon=\"fa-solid fa-spinner\" size=\"xl\" spin-pulse></font-awesome-icon>\n    </div>\n    <div v-else>\n      <div v-if=\"isMapView\" class=\"relative py-8 xl:py-16\">\n        <ClientOnly fallback-tag=\"div\">\n          <div class=\"flex flex-col items-center gap-8 lg:flex-row lg:items-start lg:gap-0\">\n            <BranchMapList class=\"grow basis-1/2 px-[--x-margin] lg:px-12\" :branches=\"branches\" />\n            <BranchMap class=\"order-first grow basis-1/2 lg:sticky lg:top-8 lg:order-none xl:top-16\" :branches=\"branches\" />\n          </div>\n          <template #fallback>\n            <!-- this will be rendered on server side -->\n            <font-awesome-icon class=\"mr-3 text-primary\" icon=\"fa-solid fa-spinner\" size=\"xl\" spin-pulse></font-awesome-icon>\n          </template>\n        </ClientOnly>\n      </div>\n      <div v-else>\n        <CommonContainer class=\"relative py-[--y-margin]\">\n          <div v-if=\"branches.length\">\n            <CommonCommentTag class=\"branch-page\" tag-class=\"branch-page\"> Join as many groups as you like </CommonCommentTag>\n            <div class=\"space-y-7\">\n              <BranchPreview v-for=\"branch in branches\" :key=\"branch.id\" :branch=\"branch\" />\n            </div>\n            <CommonPagination\n              v-if=\"totalCount > pageSize\"\n              v-model:page=\"currentPage\"\n              :page-size=\"pageSize\"\n              :total-count=\"totalCount\"\n              :disabled=\"pending\"\n              class=\"mt-8 xl:mt-16\"\n            ></CommonPagination>\n          </div>\n          <div v-else class=\"text-2xl\">\n            <h3>No groups match your search.</h3>\n          </div>\n        </CommonContainer>\n      </div>\n    </div>\n  </div>\n</template>\n"],"file":"_nuxt/DebwAG2t.js"}