Files
Portalweb/src/components/orders/OrdersTableBody.tsx
JuruSysadmin 85d202298f feat: implementa busca de produtos com API externa e corrige URL base
- Adiciona integração com API de produtos em http://10.1.1.212:8805/api/v1/data-consult/products/{id}
- Corrige mapeamento de resposta da API para formato Product interface
- Atualiza ProductSearchInput para usar description como nome do produto
- Corrige API_BASE_URL adicionando protocolo http:// para evitar URLs relativas
- Resolve erro 404 causado por URLs malformadas em requisições de API
2025-07-25 15:17:36 -03:00

119 lines
3.4 KiB
TypeScript

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 }) => (
<TableRow>
<TableCell colSpan={colSpan} className="h-24 text-center text-xs">
Nenhum pedido encontrado com os filtros informados.
</TableCell>
</TableRow>
));
/**
* 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 (
<OrderRowExpandable
key={order.orderId}
order={orderWithStore}
isSelected={isSelected}
onSelect={onSelect}
orderItems={[]}
loadingItems={false}
itemsError={null}
visibleColumns={visibleColumns}
/>
);
});
/**
* 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 <EmptyRow colSpan={visibleColumns.length} />;
}
return currentOrders.map((order) => (
<OrderRow
key={order.orderId}
order={order}
isSelected={selectedOrderId === order.orderId}
visibleColumns={visibleColumns}
onSelect={handleRowClick}
getStoreName={getStoreName}
/>
));
}, [orders.length, currentOrders, selectedOrderId, visibleColumns, getStoreName, handleRowClick]);
return <TableBody>{content}</TableBody>;
}
/**
* Exporta o componente memoizado do corpo da tabela de pedidos
* @type {React.NamedExoticComponent<OrdersTableBodyProps>}
*/
export const OrdersTableBody = memo(OrdersTableBodyComponent);