// features/{{kebabCase featureName}}/components/{{kebabCase featureName}}-list.tsx
'use client';

import { use{{pascalCase featureName}}s } from '@/features/{{kebabCase featureName}}/hooks/use-{{kebabCase featureName}}s';
import { DataTable } from '@/components/data-table';
import type { {{pascalCase featureName}} } from '@/features/{{kebabCase featureName}}/types/{{kebabCase featureName}}.types';
import type { ColumnDef } from '@tanstack/react-table';

const columns: ColumnDef<{{pascalCase featureName}}>[] = [
  { accessorKey: 'id', header: 'ID' },
  { accessorKey: 'name', header: 'Name' },
];

interface {{pascalCase featureName}}ListProps {
  initialData?: {{pascalCase featureName}}[];
}

export function {{pascalCase featureName}}List({ initialData }: {{pascalCase featureName}}ListProps) {
  const { data = initialData ?? [], isLoading } = use{{pascalCase featureName}}s();

  if (isLoading) {
    return <div className="flex items-center justify-center h-32">Loading...</div>;
  }

  return <DataTable columns={columns} data={data} />;
}