fix(boletos): diferencia pagamentos e recebimentos

This commit is contained in:
Felipe Coutinho
2026-05-31 15:18:55 -03:00
parent 35abe1b0bf
commit 99bc049cf4
10 changed files with 130 additions and 58 deletions

View File

@@ -1,9 +1,11 @@
import { RiCheckboxCircleFill, RiExternalLinkLine } from "@remixicon/react";
import { RiCheckboxCircleFill } from "@remixicon/react";
import Link from "next/link";
import {
buildBillStatusLabel,
buildBillWidgetStatusLabel,
formatBillWidgetOverdueLabel,
isBillOverdue,
isIncomeBill,
} from "@/features/dashboard/bills/bills-helpers";
import type { DashboardBill } from "@/features/dashboard/bills/bills-queries";
import { EstablishmentLogo } from "@/shared/components/entity-avatar";
@@ -36,8 +38,10 @@ export function BillListItem({ bill, period, onPay }: BillListItemProps) {
const statusLabel = buildBillWidgetStatusLabel(bill);
const absoluteStatusLabel = buildBillStatusLabel(bill);
const overdue = isBillOverdue(bill);
const income = isIncomeBill(bill);
const overdueLabel = formatBillWidgetOverdueLabel(bill);
const statusTooltipLabel =
statusLabel && statusLabel !== absoluteStatusLabel
overdueLabel || (statusLabel && statusLabel !== absoluteStatusLabel)
? absoluteStatusLabel
: null;
const href = buildTransactionsHref(bill.name, period);
@@ -53,10 +57,6 @@ export function BillListItem({ bill, period, onPay }: BillListItemProps) {
className="inline-flex max-w-full items-center gap-1 text-sm font-medium text-foreground underline-offset-2 hover:text-primary hover:underline"
>
<span className="truncate">{bill.name}</span>
<RiExternalLinkLine
className="size-3 shrink-0 text-muted-foreground"
aria-hidden
/>
</Link>
<div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
{statusLabel ? (
@@ -67,9 +67,10 @@ export function BillListItem({ bill, period, onPay }: BillListItemProps) {
className={cn(
"cursor-help rounded-full py-0.5",
bill.isSettled && "text-success font-semibold",
overdue && "text-destructive font-semibold",
)}
>
{statusLabel}
{overdueLabel ?? statusLabel}
</span>
</TooltipTrigger>
<TooltipContent side="top">
@@ -81,9 +82,10 @@ export function BillListItem({ bill, period, onPay }: BillListItemProps) {
className={cn(
"rounded-full py-0.5",
bill.isSettled && "text-success font-semibold",
overdue && "text-destructive font-semibold",
)}
>
{statusLabel}
{overdueLabel ?? statusLabel}
</span>
)
) : null}
@@ -93,29 +95,35 @@ export function BillListItem({ bill, period, onPay }: BillListItemProps) {
<div className="flex shrink-0 flex-col items-end">
<MoneyValues className="font-medium" amount={bill.amount} />
<Button
type="button"
size="sm"
variant="link"
className="h-auto p-0 disabled:opacity-100"
disabled={bill.isSettled}
onClick={() => onPay(bill.id)}
>
{bill.isSettled ? (
<span className="flex items-center gap-0.5 text-success">
<RiCheckboxCircleFill className="size-3.5" /> Pago
</span>
) : overdue ? (
<span className="overdue-blink">
<span className="overdue-blink-primary text-destructive">
Atrasado
{bill.isSettled ? (
<span className="flex h-7 items-center gap-0.5 text-xs font-medium text-success">
<RiCheckboxCircleFill className="size-3.5" />{" "}
{income ? "Recebido" : "Pago"}
</span>
) : (
<Button
type="button"
size="sm"
variant="link"
className="-mr-1.5 h-7 px-1.5 py-0"
onClick={() => onPay(bill.id)}
>
{overdue ? (
<span className="overdue-blink">
<span className="overdue-blink-primary text-destructive">
{income ? "Atrasada" : "Atrasado"}
</span>
<span className="overdue-blink-secondary">
{income ? "Receber" : "Pagar"}
</span>
</span>
<span className="overdue-blink-secondary">Pagar</span>
</span>
) : (
"Pagar"
)}
</Button>
) : income ? (
"Receber"
) : (
"Pagar"
)}
</Button>
)}
</div>
</li>
);