import React from 'react'

import type { TableHeaderBlockProps } from '../types'

import { TableHeader, TableRow, TableHead } from './TableComponents'

// Компонент заголовка таблицы
export const TableHeaderBlock = React.memo(function TableHeaderBlock({ 
  userRole, 
}: TableHeaderBlockProps) {
  return (
    <TableHeader>
      <TableRow className="border-white/20 bg-gray-800/50">
        <TableHead className="font-semibold text-white/90">Поставка</TableHead>
        <TableHead className="font-semibold text-white/90">Партнер</TableHead>
        <TableHead className="font-semibold text-white/90">Кол-во</TableHead>
        <TableHead className="font-semibold text-white/90">Дата доставки</TableHead>
        <TableHead className="font-semibold text-white/90">Статус</TableHead>
        <TableHead className="font-semibold text-white/90">Сумма</TableHead>
        {userRole !== 'WHOLESALE' && (
          <>
            <TableHead className="hidden lg:table-cell font-semibold text-white/90">Объем (м³)</TableHead>
            <TableHead className="hidden lg:table-cell font-semibold text-white/90">Упаковки</TableHead>
            <TableHead className="hidden lg:table-cell font-semibold text-white/90">Услуги ФФ</TableHead>
            <TableHead className="hidden lg:table-cell font-semibold text-white/90">Ответственный</TableHead>
            <TableHead className="font-semibold text-white/90">Логистика</TableHead>
          </>
        )}
        <TableHead className="font-semibold text-white/90">Действия</TableHead>
      </TableRow>
    </TableHeader>
  )
})