Files
webapp/app/composables/useCatalogSuppliers.ts
Ruslan Bakiev 8c753edb28
All checks were successful
Build Docker Image / build (push) Successful in 3m34s
Add cascading filters for Explore mode
When a product is selected, hubs and suppliers are filtered
to show only those that are relevant to that product.
2026-01-24 11:58:56 +07:00

107 lines
3.0 KiB
TypeScript

import { GetSupplierProfilesDocument } from '~/composables/graphql/public/exchange-generated'
import { GetSuppliersForProductDocument } from '~/composables/graphql/public/geo-generated'
const PAGE_SIZE = 24
// Shared state across list and map views
const items = ref<any[]>([])
const total = ref(0)
const isLoading = ref(false)
const isLoadingMore = ref(false)
const isInitialized = ref(false)
const filterProductUuid = ref<string | null>(null)
export function useCatalogSuppliers() {
const { execute } = useGraphQL()
const itemsWithCoords = computed(() =>
items.value.filter(s => s.latitude && s.longitude)
)
const canLoadMore = computed(() => items.value.length < total.value)
const fetchPage = async (offset: number, replace = false) => {
if (replace) isLoading.value = true
try {
// If filtering by product, use specialized query
if (filterProductUuid.value) {
const data = await execute(
GetSuppliersForProductDocument,
{ productUuid: filterProductUuid.value },
'public',
'geo'
)
const supplierUuids = (data?.suppliersForProduct || []).map(s => s?.uuid).filter(Boolean)
// Fetch full profiles for these suppliers
if (supplierUuids.length > 0) {
const profilesData = await execute(
GetSupplierProfilesDocument,
{ limit: supplierUuids.length, offset: 0 },
'public',
'exchange'
)
// Filter to only include suppliers that match the product filter
const allProfiles = profilesData?.getSupplierProfiles || []
items.value = allProfiles.filter(p => supplierUuids.includes(p.uuid))
} else {
items.value = []
}
total.value = items.value.length
isInitialized.value = true
return
}
// Default: fetch all suppliers
const data = await execute(
GetSupplierProfilesDocument,
{ limit: PAGE_SIZE, offset },
'public',
'exchange'
)
const next = data?.getSupplierProfiles || []
items.value = replace ? next : items.value.concat(next)
total.value = data?.getSupplierProfilesCount ?? total.value
isInitialized.value = true
} finally {
isLoading.value = false
}
}
const loadMore = async () => {
if (isLoadingMore.value) return
isLoadingMore.value = true
try {
await fetchPage(items.value.length)
} finally {
isLoadingMore.value = false
}
}
// Initialize data if not already loaded
const init = async () => {
if (!isInitialized.value && items.value.length === 0) {
await fetchPage(0, true)
}
}
const setProductFilter = (uuid: string | null) => {
filterProductUuid.value = uuid
if (isInitialized.value) {
fetchPage(0, true)
}
}
return {
items,
total,
isLoading,
isLoadingMore,
itemsWithCoords,
canLoadMore,
fetchPage,
loadMore,
init,
setProductFilter
}
}