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);