'use client';
import { DataTable } from '@repo/shadcn/table/data-table';
import { DataTableSkeleton } from '@repo/shadcn/table/data-table-skeleton';
import { useTrainingQuery } from '../hooks/use-training';
import { columns } from './training-tables/columns';

interface TrainingListProps {
  initialPage: number;
  initialSearch?: string | null;
  initialLimit: number;
  apiUrl: string;
}

export default function TrainingList({
  initialPage,
  initialSearch,
  initialLimit,
  apiUrl,
}: TrainingListProps) {
  const filters = {
    page: initialPage,
    limit: initialLimit,
    ...(initialSearch && { search: initialSearch }),
  };

  const { data, isLoading } = useTrainingQuery(filters);

  if (isLoading) {
    return <DataTableSkeleton columnCount={5} rowCount={initialLimit} />;
  }

  const transformedData =
    data?.data?.map((item) => ({
      ...item,
      communeRif: item.communeRif || '',
      communeSpokespersonName: item.communeSpokespersonName || '',
      communalCouncilRif: item.communalCouncilRif || '',
    })) || [];

  return (
    <DataTable
      columns={columns({ apiUrl })}
      data={transformedData}
      totalItems={data?.meta.totalCount || 0}
      pageSizeOptions={[10, 20, 30, 40, 50]}
    />
  );
}