import Card from '@/components/Card';
import Table from '@/components/Table';
import { formatDate, formatNumber, formatTitleCase } from '@/lib/helper';
import { StockLog } from '@/types/api/inventory/product';

const StockLogTable = ({
  stockLogs,
}: {
  stockLogs: (StockLog & { warehouse_name: string; warehouse_id: number })[];
}) => {
  return (
    <Card
      title='Informasi Stock Produk'
      collapsible
      variant='bordered'
      className={{
        wrapper: 'w-full',
      }}
    >
      <Table<StockLog>
        data={stockLogs}
        columns={[
          {
            header: 'ID',
            accessorKey: 'id',
          },
          {
            header: 'Tanggal',
            accessorKey: 'created_at',
            cell: (props) => {
              return formatDate(props.row.original.created_at, 'DD-MMM-yyyy');
            },
          },
          {
            header: 'Gudang',
            accessorKey: 'warehouse_name',
          },
          {
            header: 'Peningkatan',
            accessorKey: 'increase',
            cell: (props) => {
              return formatNumber(props.row.original.increase);
            },
          },
          {
            header: 'Penurunan',
            accessorKey: 'decrease',
            cell: (props) => {
              return formatNumber(props.row.original.decrease);
            },
          },
          {
            header: 'Jenis Transaksi',
            accessorKey: 'loggable_type',
            cell: (props) => {
              return props.row.original.loggable_type
                ? formatTitleCase(props.row.original.loggable_type)
                : '-';
            },
          },
          {
            header: 'Catatan',
            accessorKey: 'notes',
            cell: (props) => {
              return props.row.original.notes ? props.row.original.notes : '-';
            },
          },
          {
            header: 'Oleh',
            accessorKey: 'created_user.name',
          },
        ]}
        className={{
          containerClassName: 'mt-6',
          tableWrapperClassName: 'overflow-x-auto min-h-full!',
          tableClassName: 'font-inter w-full table-auto min-h-full!',
          headerRowClassName: 'border-b border-b-gray-200',
          headerColumnClassName:
            'px-6 py-3 text-xs font-semibold text-gray-500 last:flex last:flex-row last:justify-end',
          bodyRowClassName: 'border-b border-b-gray-200',
          bodyColumnClassName:
            'px-6 py-3 last:flex last:flex-row last:justify-end',
        }}
      />
    </Card>
  );
};

export default StockLogTable;
