import { HydrationBoundary, dehydrate } from '@tanstack/react-query';
import { getQueryClient } from '@/lib/query-client';
import { organizersQueryOptions } from '../api/queries';
import { OrganizersPage } from './organizers-page';

interface OrganizerListingProps {
  canManage: boolean;
}

export async function OrganizerListing({ canManage }: OrganizerListingProps) {
  const queryClient = getQueryClient();
  await queryClient.fetchQuery(organizersQueryOptions({ status: 'active' }));

  return (
    <HydrationBoundary state={dehydrate(queryClient)}>
      <OrganizersPage canManage={canManage} />
    </HydrationBoundary>
  );
}
