edr-platform/apps/edr-freight-web/backoffice/src/components/warehouses/WarehouseInquiryTable.tsx

import { ActionIcon, Badge, Stack, Table, Text, Tooltip } from '@mantine/core';
import { Eye } from 'lucide-react';

import type { InventoryInquiryResult } from '@/types/warehouse';
import { InventoryStatusBadge } from './badges';
import { formatDate, formatNumber } from './options';

interface WarehouseInquiryTableProps {
  results: InventoryInquiryResult[];
  onView?: (result: InventoryInquiryResult) => void;
}

const dash = '-';

const itemDescriptor = (result: InventoryInquiryResult) => {
  if (result.containerNumber) return `Container ${result.containerNumber}`;
  if (result.cargoType) return `Cargo - ${result.cargoType}`;
  if (result.cargoDescription) return `Cargo - ${result.cargoDescription}`;
  if (result.goodsId) return 'Goods';
  return dash;
};

export function WarehouseInquiryTable({ results, onView }: WarehouseInquiryTableProps) {
  if (results.length === 0) {
    return (
      <Text c="dimmed" ta="center" py="xl">
        No matching items. Adjust your search to locate cargo, containers or goods.
      </Text>
    );
  }

  return (
    <Table.ScrollContainer minWidth={1100}>
      <Table highlightOnHover verticalSpacing="sm" striped>
        <Table.Thead>
          <Table.Tr>
            <Table.Th>Booking</Table.Th>
            <Table.Th>Customer</Table.Th>
            <Table.Th>Item</Table.Th>
            <Table.Th>Warehouse</Table.Th>
            <Table.Th>Yard</Table.Th>
            <Table.Th>Zone</Table.Th>
            <Table.Th>Location</Table.Th>
            <Table.Th>Status</Table.Th>
            <Table.Th>Qty</Table.Th>
            <Table.Th>Weight</Table.Th>
            <Table.Th>Arrived</Table.Th>
            <Table.Th>Ready</Table.Th>
            {onView ? <Table.Th ta="right">Actions</Table.Th> : null}
          </Table.Tr>
        </Table.Thead>
        <Table.Tbody>
          {results.map((result) => (
            <Table.Tr key={result.id}>
              <Table.Td>
                <Text size="sm" fw={600}>
                  {result.bookingReference ?? result.bookingNumber ?? result.bookingId?.slice(0, 8) ?? dash}
                </Text>
              </Table.Td>
              <Table.Td>{result.customerName ?? dash}</Table.Td>
              <Table.Td>{itemDescriptor(result)}</Table.Td>
              <Table.Td>
                <Stack gap={0}>
                  <Text size="sm">{result.warehouse?.name ?? dash}</Text>
                  {result.warehouse?.code ? (
                    <Text size="xs" c="dimmed">
                      {result.warehouse.code}
                    </Text>
                  ) : null}
                </Stack>
              </Table.Td>
              <Table.Td>{result.yard?.name ?? dash}</Table.Td>
              <Table.Td>{result.zone?.name ?? dash}</Table.Td>
              <Table.Td>
                <Stack gap={0}>
                  <Text size="sm">{result.locationSummary ?? dash}</Text>
                  {result.trainNumber ? (
                    <Text size="xs" c="dimmed">
                      {result.trainNumber}
                      {result.route ? ` - ${result.route}` : ''}
                    </Text>
                  ) : null}
                </Stack>
              </Table.Td>
              <Table.Td>
                {result.status ? (
                  <InventoryStatusBadge status={result.status} />
                ) : (
                  <Badge variant="light" color={result.trainStatus === 'ARRIVED' ? 'orange' : 'blue'} size="sm">
                    {result.trainStatus ?? result.bookingStatus ?? 'Not in warehouse'}
                  </Badge>
                )}
              </Table.Td>
              <Table.Td>{formatNumber(result.quantity)}</Table.Td>
              <Table.Td>{formatNumber(result.weight)}</Table.Td>
              <Table.Td>
                <Text size="xs">{formatDate(result.arrivedAt)}</Text>
              </Table.Td>
              <Table.Td>
                <Text size="xs">{formatDate(result.readyForLoadingAt)}</Text>
              </Table.Td>
              {onView ? (
                <Table.Td>
                  <Tooltip label="View details" withArrow>
                    <ActionIcon variant="subtle" color="gray" onClick={() => onView(result)} ml="auto">
                      <Eye size={16} />
                    </ActionIcon>
                  </Tooltip>
                </Table.Td>
              ) : null}
            </Table.Tr>
          ))}
        </Table.Tbody>
      </Table>
    </Table.ScrollContainer>
  );
}