diff --git a/src/components/PaginationControls.tsx b/src/components/PaginationControls.tsx index c459dd0..cc9c109 100644 --- a/src/components/PaginationControls.tsx +++ b/src/components/PaginationControls.tsx @@ -13,6 +13,7 @@ type PaginationControlsProps = { onPageChange: (page: number) => void; onPageSizeChange: (pageSize: number) => void; className?: string; + stacked?: boolean; }; const clampPage = (page: number, totalPages: number) => { @@ -32,7 +33,8 @@ const PaginationControls = ({ endIndex, onPageChange, onPageSizeChange, - className = 'px-6 py-4 border-t border-zinc-100 dark:border-dark-border' + className = 'px-6 py-4 border-t border-zinc-100 dark:border-dark-border', + stacked = false }: PaginationControlsProps) => { const safeTotalPages = Math.max(1, totalPages); const safeCurrentPage = clampPage(currentPage, safeTotalPages); @@ -44,7 +46,7 @@ const PaginationControls = ({ }; return ( -
+
Mostrar { + setReferenceSearch(event.target.value); + updatePagination('references', { page: 1 }); + }} + placeholder="Buscar por produto, SKU ou material..." + className={`${inputClassName} pl-9`} + /> + +
{paginatedReferences.map(reference => (
@@ -1054,14 +1079,14 @@ const Registrations = () => {
))} - {!catalog.consumptionReferences.length && ( + {!filteredReferences.length && (
- Nenhuma referencia cadastrada. + {referenceSearch ? 'Nenhuma referência encontrada.' : 'Nenhuma referencia cadastrada.'}
)}
{ itemLabel="referências" pageSizeLabel="por página" startIndex={referenceStartIndex} - endIndex={Math.min(referenceStartIndex + pagination.references.pageSize, catalog.consumptionReferences.length)} + endIndex={Math.min(referenceStartIndex + pagination.references.pageSize, filteredReferences.length)} onPageChange={(page) => updatePagination('references', { page })} onPageSizeChange={(pageSize) => updatePagination('references', { page: 1, pageSize })} + stacked />