WIP

frontend/pages/vendors/index.js

@@ -1,5 +1,5 @@
 import { Link } from '@chakra-ui/next-js'
-import { Card, CardBody, Heading, Image, LinkBox, LinkOverlay, SimpleGrid, Text, Skeleton } from '@chakra-ui/react'
+import { Card, CardBody, Heading, Image, LinkBox, LinkOverlay, SimpleGrid, Skeleton } from '@chakra-ui/react'
 import { useQuery } from '@tanstack/react-query'
 import { useRouter } from 'next/router'
 import Pagination from '~/components/pagination'
@@ -15,13 +15,16 @@ export default function VendorsPage() {
   const { data, isFetching } = useQuery({
     queryKey: ['vendors', page],
     queryFn: async (...props2) => {
-      await new Promise((r) => setTimeout(r, 2000))
+      const url = new URL(`${process.env.NEXT_PUBLIC_DIRECTUS_API_URL}/items/vendors`)
+      url.searchParams.append('fields[]', '*')
+      url.searchParams.append('limit', PER_PAGE)
+      url.searchParams.append('page', page)
+      url.searchParams.append('sort', 'name')
+      url.searchParams.append('meta[]', 'filter_count')
 
-      const res = await fetch(
-        `${process.env.NEXT_PUBLIC_DIRECTUS_API_URL}/items/vendors?fields[]=*&limit=12&page=${page}&meta[]=filter_count&sort=name`
-      )
+      const res = await fetch(url.toString())
       if (!res.ok) {
-        throw new Error('wrong')
+        throw new Error('Oops')
       }
 
       return res.json()