Files
webapp/app/composables/useCatalogSuppliers.ts
Ruslan Bakiev 9b99d8981c
All checks were successful
Build Docker Image / build (push) Successful in 4m12s
Optimize catalog loading: backend bounds filtering + early returns
- Add bounds (west/south/east/north) parameters to GetNodes query
- Add setBoundsFilter to useCatalogHubs, useCatalogSuppliers, useCatalogProducts
- Replace client-side bounds filtering with backend query
- Add early return to setProductFilter to avoid redundant fetches
- Watch filterByBounds to trigger backend refetch when checkbox changes
2026-01-24 12:19:00 +07:00

133 lines
4.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)
const filterBounds = ref<{ west: number; south: number; east: number; north: number } | 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
// If bounds filter is active, fetch more and filter client-side
// TODO: Add bounds support to exchange backend for proper server-side filtering
const bounds = filterBounds.value
const fetchLimit = bounds ? 500 : PAGE_SIZE
const data = await execute(
GetSupplierProfilesDocument,
{ limit: fetchLimit, offset: bounds ? 0 : offset },
'public',
'exchange'
)
let next = data?.getSupplierProfiles || []
// Client-side bounds filtering (until exchange backend supports it)
if (bounds) {
next = next.filter((s: any) => {
if (!s.latitude || !s.longitude) return false
const lat = Number(s.latitude)
const lng = Number(s.longitude)
return lat >= bounds.south && lat <= bounds.north
&& lng >= bounds.west && lng <= bounds.east
})
}
items.value = replace ? next : items.value.concat(next)
total.value = bounds ? next.length : (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) => {
if (filterProductUuid.value === uuid) return // Early return if unchanged
filterProductUuid.value = uuid
if (isInitialized.value) {
fetchPage(0, true)
}
}
const setBoundsFilter = (bounds: { west: number; south: number; east: number; north: number } | null) => {
filterBounds.value = bounds
if (isInitialized.value) {
fetchPage(0, true)
}
}
return {
items,
total,
isLoading,
isLoadingMore,
itemsWithCoords,
canLoadMore,
fetchPage,
loadMore,
init,
setProductFilter,
setBoundsFilter
}
}