git.gladyson/openmonetis
1
0
Fork 1
mirror of https://github.com/felipegcoutinho/openmonetis.git synced 2026-05-09 19:01:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(lista): componentizar inbox e tabela de lançamentos

Browse Source
This commit is contained in:
Felipe Coutinho
2026-04-03 18:10:58 +00:00
parent 1b4dfaaba7
commit 5c4995961c
10 changed files with 1522 additions and 1414 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
src/features/transactions/components/table/transactions-pagination.tsx Normal file
View File

@@ -0,0 +1,106 @@
import {
RiArrowLeftDoubleLine,
RiArrowLeftSLine,
RiArrowRightDoubleLine,
RiArrowRightSLine,
} from "@remixicon/react";
import { Button } from "@/shared/components/ui/button";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/shared/components/ui/select";
type TransactionsPaginationProps = {
totalRows: number;
currentPage: number;
currentPageSize: number;
totalPages: number;
canPreviousPage: boolean;
canNextPage: boolean;
onPageChange: (page: number) => void;
onPageSizeChange: (size: number) => void;
};
export function TransactionsPagination({
totalRows,
currentPage,
currentPageSize,
totalPages,
canPreviousPage,
canNextPage,
onPageChange,
onPageSizeChange,
}: TransactionsPaginationProps) {
return (
<div className="mt-4 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
<div className="flex items-center gap-2">
<span className="text-sm text-muted-foreground">
{totalRows} lançamentos
</span>
<Select
value={currentPageSize.toString()}
onValueChange={(value) => onPageSizeChange(Number(value))}
>
<SelectTrigger className="w-max">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="5">5 linhas</SelectItem>
<SelectItem value="10">10 linhas</SelectItem>
<SelectItem value="20">20 linhas</SelectItem>
<SelectItem value="30">30 linhas</SelectItem>
<SelectItem value="40">40 linhas</SelectItem>
<SelectItem value="50">50 linhas</SelectItem>
<SelectItem value="100">100 linhas</SelectItem>
</SelectContent>
</Select>
</div>
<div className="flex items-center gap-2">
<span className="text-sm text-muted-foreground">
Página {currentPage} de {totalPages}
</span>
<div className="flex items-center gap-1">
<Button
variant="outline"
size="icon-sm"
onClick={() => onPageChange(1)}
disabled={!canPreviousPage}
aria-label="Primeira página"
>
<RiArrowLeftDoubleLine className="size-4" />
</Button>
<Button
variant="outline"
size="icon-sm"
onClick={() => onPageChange(currentPage - 1)}
disabled={!canPreviousPage}
aria-label="Página anterior"
>
<RiArrowLeftSLine className="size-4" />
</Button>
<Button
variant="outline"
size="icon-sm"
onClick={() => onPageChange(currentPage + 1)}
disabled={!canNextPage}
aria-label="Próxima página"
>
<RiArrowRightSLine className="size-4" />
</Button>
<Button
variant="outline"
size="icon-sm"
onClick={() => onPageChange(totalPages)}
disabled={!canNextPage}
aria-label="Última página"
>
<RiArrowRightDoubleLine className="size-4" />
</Button>
</div>
</div>
</div>
);
}