diff --git a/src/Walrhouse.Web/App/WebClient/src/features/receive/components/BatchMasterList.tsx b/src/Walrhouse.Web/App/WebClient/src/features/receive/components/BatchMasterList.tsx index b43c13c..cbff2fb 100644 --- a/src/Walrhouse.Web/App/WebClient/src/features/receive/components/BatchMasterList.tsx +++ b/src/Walrhouse.Web/App/WebClient/src/features/receive/components/BatchMasterList.tsx @@ -49,7 +49,7 @@ import { parseISO } from 'date-fns'; export const BatchMasterList = () => { const [page, setPage] = useState(1); - const pageSize = 10; + const pageSize = 50; const { data, isLoading } = useBatches({ pageNumber: page, diff --git a/src/Walrhouse.Web/App/WebClient/src/features/receive/components/incoming-orders/ItemCodeSelectionSheet.tsx b/src/Walrhouse.Web/App/WebClient/src/features/receive/components/incoming-orders/ItemCodeSelectionSheet.tsx index a831bbd..42b5c31 100644 --- a/src/Walrhouse.Web/App/WebClient/src/features/receive/components/incoming-orders/ItemCodeSelectionSheet.tsx +++ b/src/Walrhouse.Web/App/WebClient/src/features/receive/components/incoming-orders/ItemCodeSelectionSheet.tsx @@ -1,4 +1,12 @@ import { Search, Loader2 } from 'lucide-react'; +import { + Pagination, + PaginationContent, + PaginationItem, + PaginationLink, + PaginationNext, + PaginationPrevious, +} from '@/components/ui/pagination'; import { Sheet, SheetContent, @@ -31,13 +39,17 @@ export function ItemCodeSelectionSheet({ onSelect, }: ItemCodeSelectionSheetProps) { const [searchTerm, setSearchTerm] = useState(''); + const [page, setPage] = useState(1); + const pageSize = 50; const { data, isLoading } = useItems({ - pageSize: 50, + pageNumber: page, + pageSize, searchTerm: searchTerm || undefined, }); const items = data?.items ?? []; + const totalPages = data?.totalPages ?? 0; return ( @@ -54,7 +66,10 @@ export function ItemCodeSelectionSheet({ className="pl-9" placeholder="Search items by code or name..." value={searchTerm} - onChange={(e) => setSearchTerm(e.target.value)} + onChange={(e) => { + setSearchTerm(e.target.value); + setPage(1); + }} /> @@ -83,6 +98,46 @@ export function ItemCodeSelectionSheet({ Select + + {totalPages > 1 && ( +
+ + + + setPage((p) => Math.max(1, p - 1))} + className={ + page === 1 ? 'pointer-events-none opacity-50' : 'cursor-pointer' + } + /> + + + {Array.from({ length: totalPages }, (_, i) => i + 1).map((p) => ( + + setPage(p)} + className="cursor-pointer" + > + {p} + + + ))} + + + setPage((p) => Math.min(totalPages, p + 1))} + className={ + page === totalPages + ? 'pointer-events-none opacity-50' + : 'cursor-pointer' + } + /> + + + +
+ )} {item.itemName} ))