import { SponsorshipRequestsPanel } from '@/components/profile/SponsorshipRequestsPanel';
import type { SponsorshipRequestsViewData } from '@/lib/view-data/SponsorshipRequestsViewData';
import { Box } from '@/ui/Box';
import { Heading } from '@/ui/Heading';
import { Stack } from '@/ui/Stack';

export interface SponsorshipRequestsTemplateProps {
  viewData: SponsorshipRequestsViewData;
  onAccept: (requestId: string) => Promise<void>;
  onReject: (requestId: string, reason?: string) => Promise<void>;
  processingId?: string | null;
}

export function SponsorshipRequestsTemplate({
  viewData,
  onAccept,
  onReject,
  processingId,
}: SponsorshipRequestsTemplateProps) {
  return (
    <Stack gap={8}>
      <Box as="header">
        <Heading level={1}>Sponsorship Requests</Heading>
      </Box>

      <Box as="main">
        <SponsorshipRequestsPanel 
          sections={viewData.sections}
          onAccept={onAccept}
          onReject={onReject}
          processingId={processingId}
        />
      </Box>
    </Stack>
  );
}