import React, { memo, useMemo } from "react";
import {
TableBody,
TableCell,
TableRow,
} from "@/src/components/ui/table";
import { OrderRowExpandable } from "./tabela-pedidos/components/OrderRowExpandable";
import { Order } from "@/src/components/types";
/**
* Propriedades para o componente OrdersTableBody
* @typedef {Object} OrdersTableBodyProps
* @property {Order[]} orders - Lista completa de pedidos
* @property {Order[]} currentOrders - Lista de pedidos filtrados/paginados
* @property {string|null} selectedOrderId - ID do pedido selecionado
* @property {string[]} visibleColumns - Colunas visíveis na tabela
* @property {(storeId?: string) => string} getStoreName - Função para obter o nome da loja
* @property {(orderId: string) => void} handleRowClick - Função chamada ao clicar em uma linha
*/
interface OrdersTableBodyProps {
orders: Order[];
currentOrders: Order[];
selectedOrderId: string | null;
visibleColumns: string[];
getStoreName: (storeId?: string) => string;
handleRowClick: (orderId: string) => void;
}
/**
* Linha vazia exibida quando não há pedidos
* @param {{ colSpan: number }} props
* @returns {JSX.Element}
*/
const EmptyRow = memo(({ colSpan }: { colSpan: number }) => (
Nenhum pedido encontrado com os filtros informados.
));
/**
* Linha de pedido individual, expansível
* @param {{ order: Order, isSelected: boolean, visibleColumns: string[], onSelect: (orderId: string) => void, getStoreName: (storeId?: string) => string }} props
* @returns {JSX.Element}
*/
const OrderRow = memo(({
order,
isSelected,
visibleColumns,
onSelect,
getStoreName
}: {
order: Order;
isSelected: boolean;
visibleColumns: string[];
onSelect: (orderId: string) => void;
getStoreName: (storeId?: string) => string;
}) => {
// Cria um novo objeto de pedido com o nome da loja
const orderWithStore = {
...order,
store: getStoreName(order.storeId),
storeId: order.storeId, // Mantém o storeId original
};
return (
);
});
/**
* Corpo da tabela de pedidos, renderiza linhas de pedidos ou linha vazia
* @param {OrdersTableBodyProps} props
* @returns {JSX.Element}
*/
function OrdersTableBodyComponent({
orders,
currentOrders,
selectedOrderId,
visibleColumns,
getStoreName,
handleRowClick,
}: OrdersTableBodyProps) {
// Renderização condicional baseada na presença de pedidos
const content = useMemo(() => {
if (orders.length === 0) {
return ;
}
return currentOrders.map((order) => (
));
}, [orders.length, currentOrders, selectedOrderId, visibleColumns, getStoreName, handleRowClick]);
return {content};
}
/**
* Exporta o componente memoizado do corpo da tabela de pedidos
* @type {React.NamedExoticComponent}
*/
export const OrdersTableBody = memo(OrdersTableBodyComponent);