Browse by Category / Platform

# All Instagram creators (default recent sort)
curl 'https://api.bio.re/api/v1/discover/category/instagram'

# Popular fitness creators on TikTok with paid DMs
curl 'https://api.bio.re/api/v1/discover/category/tiktok?category=fitness&sort=popular&dmType=SINGLE_PAY&limit=20'

type BrowseFilter = {
  platform: string;
  category?: string;
  sort?: 'recent' | 'popular' | 'rating';
  dmType?: 'FREE' | 'SINGLE_PAY' | 'PER_MESSAGE';
  cursor?: string;
  limit?: number;
};

async function browseByCategory(f: BrowseFilter): Promise<CursorPage<CreatorCard>> {
  const url = new URL(`https://api.bio.re/api/v1/discover/category/${encodeURIComponent(f.platform)}`);
  if (f.category) url.searchParams.set('category', f.category);
  if (f.sort) url.searchParams.set('sort', f.sort);
  if (f.dmType) url.searchParams.set('dmType', f.dmType);
  if (f.cursor) url.searchParams.set('cursor', f.cursor);
  if (f.limit) url.searchParams.set('limit', String(f.limit));
  const res = await fetch(url);
  const json = await res.json();
  if (!res.ok || !json.success) {
    throw Object.assign(new Error(json?.error?.message ?? 'Browse failed'), {
      code: json?.error?.code,
    });
  }
  return json.data;
}

import { useInfiniteQuery } from '@tanstack/react-query';

export const discoverKeys = {
  byCategory: (f: Omit<BrowseFilter, 'cursor'>) => ['discover', 'category', f] as const,
};

export function useByCategoryInfinite(f: Omit<BrowseFilter, 'cursor'>) {
  return useInfiniteQuery({
    queryKey: discoverKeys.byCategory(f),
    initialPageParam: undefined as string | undefined,
    queryFn: async ({ pageParam }) => {
      const url = new URL(`/api/v1/discover/category/${encodeURIComponent(f.platform)}`, window.location.origin);
      if (f.category) url.searchParams.set('category', f.category);
      if (f.sort) url.searchParams.set('sort', f.sort);
      if (f.dmType) url.searchParams.set('dmType', f.dmType);
      if (f.limit) url.searchParams.set('limit', String(f.limit));
      if (pageParam) url.searchParams.set('cursor', pageParam);
      const res = await fetch(url);
      const json = await res.json();
      if (!res.ok || !json.success) {
        throw Object.assign(new Error(json?.error?.message ?? 'Browse failed'), {
          code: json?.error?.code,
          i18nKey: json?.error?.i18nKey,
        });
      }
      return json.data as CursorPage<CreatorCard>;
    },
    getNextPageParam: (last) => (last.hasMore ? last.nextCursor ?? undefined : undefined),
    enabled: Boolean(f.platform),
  });
}