'use client';

import type { ColumnDef } from '@tanstack/react-table';
import { Edit3, Trash2 } from 'lucide-react';

import { DataTable } from '@/components/data-table';
import type { Chainage } from '@/types';

interface SegmentTableProps {
  columns: ColumnDef<Chainage>[];
  segments: Chainage[];
  isLoading: boolean;
  skip: number;
  limit: number;
  total: number;
  onPageChange: (skip: number) => void;
  onLimitChange: (limit: number) => void;
  onEdit: (segment: Chainage) => void;
  onDelete: (segment: Chainage) => void;
}

export function SegmentTable({
  columns,
  segments,
  isLoading,
  skip,
  limit,
  total,
  onPageChange,
  onLimitChange,
  onEdit,
  onDelete,
}: SegmentTableProps) {
  return (
    <DataTable
      title="Segments"
      data={segments}
      columns={columns}
      actions={[
        {
          label: 'Edit',
          icon: <Edit3 className="size-4" />,
          onClick: onEdit,
        },
        {
          label: 'Delete',
          icon: <Trash2 className="size-4" />,
          className: 'text-destructive',
          onClick: onDelete,
        },
      ]}
      isLoading={isLoading}
      emptyTitle="No segments found."
      pagination={{
        skip,
        limit,
        totalItems: total,
        onPageChange,
        onLimitChange,
      }}
      actionsSticky
    />
  );
}
