Gladyson/openmonetis
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore: apply pending dashboard and UI updates

Browse Source
This commit is contained in:
Felipe Coutinho
2026-02-28 15:34:54 +00:00
parent 125e0dfb4e
commit 4a88309709
16 changed files with 609 additions and 197 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
app/(dashboard)/categorias/loading.tsx
View File

@@ -1,3 +1,4 @@
import { Card, CardContent } from "@/components/ui/card";
import { Skeleton } from "@/components/ui/skeleton"; import { Skeleton } from "@/components/ui/skeleton";
export default function CategoriasLoading() { export default function CategoriasLoading() {
@@ -21,32 +22,40 @@ export default function CategoriasLoading() {
))} ))}
</div> </div>
{/* Grid de cards de categorias */} {/* Tabela de categorias */}
<div className="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"> <Card className="py-2">
{Array.from({ length: 8 }).map((_, i) => ( <CardContent className="px-2 py-4 sm:px-4">
<div key={i} className="rounded-2xl border p-6 space-y-4"> <div className="space-y-0">
{/* Ícone + Nome */} {/* Header da tabela */}
<div className="flex items-center gap-3"> <div className="flex items-center gap-4 border-b px-2 pb-3">
<Skeleton className="size-12 rounded-2xl bg-foreground/10" /> <Skeleton className="size-5 rounded bg-foreground/10" />
<div className="flex-1 space-y-2"> <Skeleton className="h-4 w-16 rounded bg-foreground/10" />
<Skeleton className="h-5 w-full rounded-2xl bg-foreground/10" /> <div className="flex-1" />
<Skeleton className="h-4 w-16 rounded-2xl bg-foreground/10" /> <Skeleton className="h-4 w-14 rounded bg-foreground/10" />
</div>
{/* Linhas da tabela */}
{Array.from({ length: 8 }).map((_, i) => (
<div
key={i}
className="flex items-center gap-4 border-b border-dashed px-2 py-3 last:border-b-0"
>
<Skeleton className="size-8 rounded-lg bg-foreground/10" />
<Skeleton
className="h-4 rounded bg-foreground/10"
style={{ width: `${100 + (i % 4) * 30}px` }}
/>
<div className="flex-1" />
<div className="flex items-center gap-3">
<Skeleton className="h-4 w-14 rounded bg-foreground/10" />
<Skeleton className="h-4 w-16 rounded bg-foreground/10" />
<Skeleton className="h-4 w-16 rounded bg-foreground/10" />
</div>
</div> </div>
</div> ))}
{/* Descrição */}
{i % 3 === 0 && (
<Skeleton className="h-4 w-full rounded-2xl bg-foreground/10" />
)}
{/* Botões de ação */}
<div className="flex gap-2 pt-2 border-t">
<Skeleton className="h-9 flex-1 rounded-2xl bg-foreground/10" />
<Skeleton className="h-9 w-9 rounded-2xl bg-foreground/10" />
</div>
</div> </div>
))} </CardContent>
</div> </Card>
</div> </div>
</div> </div>
</main> </main>

4
app/(dashboard)/orcamentos/layout.tsx
View File

@@ -1,4 +1,4 @@
import { RiFundsLine } from "@remixicon/react"; import { RiBarChart2Line } from "@remixicon/react";
import PageDescription from "@/components/page-description"; import PageDescription from "@/components/page-description";
export const metadata = { export const metadata = {
@@ -13,7 +13,7 @@ export default function RootLayout({
return ( return (
<section className="space-y-6 pt-4"> <section className="space-y-6 pt-4">
<PageDescription <PageDescription
icon={<RiFundsLine />} icon={<RiBarChart2Line />}
title="Orçamentos" title="Orçamentos"
subtitle="Gerencie seus orçamentos mensais por categorias. Acompanhe o progresso do seu orçamento e faça ajustes conforme necessário." subtitle="Gerencie seus orçamentos mensais por categorias. Acompanhe o progresso do seu orçamento e faça ajustes conforme necessário."
/> />

83
app/(dashboard)/pre-lancamentos/actions.ts
View File

@@ -21,6 +21,14 @@ const bulkDiscardSchema = z.object({
inboxItemIds: z.array(z.string().uuid()).min(1, "Selecione ao menos um item"), inboxItemIds: z.array(z.string().uuid()).min(1, "Selecione ao menos um item"),
}); });
const deleteInboxSchema = z.object({
inboxItemId: z.string().uuid("ID do item inválido"),
});
const bulkDeleteInboxSchema = z.object({
status: z.enum(["processed", "discarded"]),
});
function revalidateInbox() { function revalidateInbox() {
revalidatePath("/pre-lancamentos"); revalidatePath("/pre-lancamentos");
revalidatePath("/lancamentos"); revalidatePath("/lancamentos");
@@ -157,3 +165,78 @@ export async function bulkDiscardInboxItemsAction(
return handleActionError(error); return handleActionError(error);
} }
} }
export async function deleteInboxItemAction(
input: z.infer<typeof deleteInboxSchema>,
): Promise<ActionResult> {
try {
const user = await getUser();
const data = deleteInboxSchema.parse(input);
const [item] = await db
.select({ status: preLancamentos.status })
.from(preLancamentos)
.where(
and(
eq(preLancamentos.id, data.inboxItemId),
eq(preLancamentos.userId, user.id),
),
)
.limit(1);
if (!item) {
return { success: false, error: "Item não encontrado." };
}
if (item.status === "pending") {
return {
success: false,
error: "Não é possível excluir itens pendentes.",
};
}
await db
.delete(preLancamentos)
.where(
and(
eq(preLancamentos.id, data.inboxItemId),
eq(preLancamentos.userId, user.id),
),
);
revalidateInbox();
return { success: true, message: "Item excluído." };
} catch (error) {
return handleActionError(error);
}
}
export async function bulkDeleteInboxItemsAction(
input: z.infer<typeof bulkDeleteInboxSchema>,
): Promise<ActionResult> {
try {
const user = await getUser();
const data = bulkDeleteInboxSchema.parse(input);
const result = await db
.delete(preLancamentos)
.where(
and(
eq(preLancamentos.userId, user.id),
eq(preLancamentos.status, data.status),
),
)
.returning({ id: preLancamentos.id });
revalidateInbox();
const count = result.length;
return {
success: true,
message: `${count} item(s) excluído(s).`,
};
} catch (error) {
return handleActionError(error);
}
}

4
app/(dashboard)/pre-lancamentos/layout.tsx
View File

@@ -1,4 +1,4 @@
import { RiInboxLine } from "@remixicon/react"; import { RiAtLine } from "@remixicon/react";
import PageDescription from "@/components/page-description"; import PageDescription from "@/components/page-description";
export const metadata = { export const metadata = {
@@ -13,7 +13,7 @@ export default function RootLayout({
return ( return (
<section className="space-y-6 pt-4"> <section className="space-y-6 pt-4">
<PageDescription <PageDescription
icon={<RiInboxLine />} icon={<RiAtLine />}
title="Pré-Lançamentos" title="Pré-Lançamentos"
subtitle="Notificações capturadas pelo Companion" subtitle="Notificações capturadas pelo Companion"
/> />

31
app/globals.css
View File

@@ -343,3 +343,34 @@
[data-slot="dialog-content"][data-state="closed"] { [data-slot="dialog-content"][data-state="closed"] {
animation: dialog-out 0.15s ease-in; animation: dialog-out 0.15s ease-in;
} }
/* Overdue blink: alternates two stacked labels with a smooth crossfade */
@keyframes blink-in {
0%, 40% { opacity: 1; }
50%, 90% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes blink-out {
0%, 40% { opacity: 0; }
50%, 90% { opacity: 1; }
100% { opacity: 0; }
}
.overdue-blink {
position: relative;
display: inline-flex;
}
.overdue-blink-primary {
animation: blink-in 6s ease-in-out infinite;
}
.overdue-blink-secondary {
position: absolute;
inset: 0;
display: inline-flex;
align-items: center;
justify-content: flex-end;
animation: blink-out 6s ease-in-out infinite;
}

113
components/categorias/categories-page.tsx
View File

@@ -1,20 +1,41 @@
"use client"; "use client";
import { RiAddCircleLine } from "@remixicon/react"; import {
RiAddCircleLine,
RiDeleteBin5Line,
RiExternalLinkLine,
RiPencilLine,
} from "@remixicon/react";
import Link from "next/link";
import { useCallback, useMemo, useState } from "react"; import { useCallback, useMemo, useState } from "react";
import { toast } from "sonner"; import { toast } from "sonner";
import { deleteCategoryAction } from "@/app/(dashboard)/categorias/actions"; import { deleteCategoryAction } from "@/app/(dashboard)/categorias/actions";
import { ConfirmActionDialog } from "@/components/confirm-action-dialog"; import { ConfirmActionDialog } from "@/components/confirm-action-dialog";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { import {
CATEGORY_TYPE_LABEL, CATEGORY_TYPE_LABEL,
CATEGORY_TYPES, CATEGORY_TYPES,
} from "@/lib/categorias/constants"; } from "@/lib/categorias/constants";
import { CategoryCard } from "./category-card";
import { CategoryDialog } from "./category-dialog"; import { CategoryDialog } from "./category-dialog";
import { CategoryIconBadge } from "./category-icon-badge";
import type { Category, CategoryType } from "./types"; import type { Category, CategoryType } from "./types";
const CATEGORIAS_PROTEGIDAS = [
"Transferência interna",
"Saldo inicial",
"Pagamentos",
];
interface CategoriesPageProps { interface CategoriesPageProps {
categories: Category[]; categories: Category[];
} }
@@ -129,17 +150,83 @@ export function CategoriesPage({ categories }: CategoriesPageProps) {
{CATEGORY_TYPE_LABEL[type].toLowerCase()}. {CATEGORY_TYPE_LABEL[type].toLowerCase()}.
</div> </div>
) : ( ) : (
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"> <Card className="py-2">
{categoriesByType[type].map((category, index) => ( <CardContent className="px-2 py-4 sm:px-4">
<CategoryCard <Table>
key={category.id} <TableHeader>
category={category} <TableRow>
colorIndex={index} <TableHead className="w-10" />
onEdit={handleEdit} <TableHead>Nome</TableHead>
onRemove={handleRemoveRequest} <TableHead className="text-right">Ações</TableHead>
/> </TableRow>
))} </TableHeader>
</div> <TableBody>
{categoriesByType[type].map((category, index) => {
const isProtegida = CATEGORIAS_PROTEGIDAS.includes(
category.name,
);
return (
<TableRow key={category.id}>
<TableCell>
<CategoryIconBadge
icon={category.icon}
name={category.name}
colorIndex={index}
size="md"
/>
</TableCell>
<TableCell className="font-medium">
<Link
href={`/categorias/${category.id}`}
className="inline-flex items-center gap-1 underline-offset-2 hover:text-primary hover:underline"
>
{category.name}
<RiExternalLinkLine
className="size-3 shrink-0 text-muted-foreground"
aria-hidden
/>
</Link>
</TableCell>
<TableCell>
<div className="flex items-center justify-end gap-3 text-sm">
{!isProtegida && (
<button
type="button"
onClick={() => handleEdit(category)}
className="flex items-center gap-1 font-medium text-primary transition-opacity hover:opacity-80"
>
<RiPencilLine
className="size-4"
aria-hidden
/>
editar
</button>
)}
{!isProtegida && (
<button
type="button"
onClick={() =>
handleRemoveRequest(category)
}
className="flex items-center gap-1 font-medium text-destructive transition-opacity hover:opacity-80"
>
<RiDeleteBin5Line
className="size-4"
aria-hidden
/>
remover
</button>
)}
</div>
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</CardContent>
</Card>
)} )}
</TabsContent> </TabsContent>
))} ))}

92
components/dashboard/boletos-widget.tsx
View File

@@ -5,6 +5,7 @@ import {
RiCheckboxCircleFill, RiCheckboxCircleFill,
RiCheckboxCircleLine, RiCheckboxCircleLine,
RiLoader4Line, RiLoader4Line,
RiMoneyDollarCircleLine,
} from "@remixicon/react"; } from "@remixicon/react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useEffect, useMemo, useState, useTransition } from "react"; import { useEffect, useMemo, useState, useTransition } from "react";
@@ -165,6 +166,12 @@ export function BoletosWidget({ boletos }: BoletosWidgetProps) {
<ul className="flex flex-col"> <ul className="flex flex-col">
{items.map((boleto) => { {items.map((boleto) => {
const statusLabel = buildStatusLabel(boleto); const statusLabel = buildStatusLabel(boleto);
const isOverdue = (() => {
if (boleto.isSettled || !boleto.dueDate) return false;
const [y, m, d] = boleto.dueDate.split("-").map(Number);
if (!y || !m || !d) return false;
return new Date(Date.UTC(y, m - 1, d)) < new Date();
})();
return ( return (
<li <li
@@ -205,6 +212,13 @@ export function BoletosWidget({ boletos }: BoletosWidgetProps) {
<span className="flex items-center gap-1 text-success"> <span className="flex items-center gap-1 text-success">
<RiCheckboxCircleFill className="size-3" /> Pago <RiCheckboxCircleFill className="size-3" /> Pago
</span> </span>
) : isOverdue ? (
<span className="overdue-blink">
<span className="overdue-blink-primary text-destructive">
Atrasado
</span>
<span className="overdue-blink-secondary">Pagar</span>
</span>
) : ( ) : (
"Pagar" "Pagar"
)} )}
@@ -271,7 +285,7 @@ export function BoletosWidget({ boletos }: BoletosWidgetProps) {
</div> </div>
) : ( ) : (
<> <>
<DialogHeader className="gap-3 text-center sm:text-left"> <DialogHeader>
<DialogTitle>Confirmar pagamento do boleto</DialogTitle> <DialogTitle>Confirmar pagamento do boleto</DialogTitle>
<DialogDescription> <DialogDescription>
Confirme os dados para registrar o pagamento. Você poderá Confirme os dados para registrar o pagamento. Você poderá
@@ -280,47 +294,59 @@ export function BoletosWidget({ boletos }: BoletosWidgetProps) {
</DialogHeader> </DialogHeader>
{selectedBoleto ? ( {selectedBoleto ? (
<div className="flex flex-col gap-4"> <div className="space-y-4">
<div className="flex flex-col items-center gap-3 rounded-lg border border-border/60 bg-muted/50 p-4 text-center sm:flex-row sm:text-left"> <div className="rounded-lg border p-4">
<div className="flex size-12 shrink-0 items-center justify-center"> <div className="flex items-center justify-between">
<RiBarcodeFill className="size-8" /> <div className="flex items-center gap-3">
</div> <div className="flex size-10 items-center justify-center rounded-full bg-primary/10">
<div className="space-y-1"> <RiBarcodeFill className="size-5 text-primary" />
<p className="text-sm font-medium text-foreground"> </div>
{selectedBoleto.name} <div>
</p> <p className="text-sm font-medium text-muted-foreground">
Boleto
</p>
<p className="text-lg font-bold text-foreground">
{selectedBoleto.name}
</p>
</div>
</div>
{selectedBoletoDueLabel ? ( {selectedBoletoDueLabel ? (
<p className="text-xs text-muted-foreground"> <div className="text-right">
{selectedBoletoDueLabel} <p className="text-sm text-muted-foreground">
</p> {selectedBoletoDueLabel}
</p>
</div>
) : null} ) : null}
</div> </div>
</div> </div>
<div className="grid grid-cols-1 gap-3 text-sm"> <div className="grid gap-3 sm:grid-cols-2">
<div className="flex items-center justify-between rounded border border-border/60 px-3 py-2"> <div className="rounded-lg border p-3">
<span className="text-xs uppercase text-muted-foreground/80"> <div className="mb-2 flex items-center gap-2 text-muted-foreground">
Valor do boleto <RiMoneyDollarCircleLine className="size-4" />
</span> <span className="text-xs font-semibold uppercase">
Valor do Boleto
</span>
</div>
<MoneyValues <MoneyValues
amount={selectedBoleto.amount} amount={selectedBoleto.amount}
className="text-lg" className="text-lg font-bold"
/> />
</div> </div>
<div className="flex items-center justify-between rounded border border-border/60 px-3 py-2"> <div className="rounded-lg border p-3">
<span className="text-xs uppercase text-muted-foreground/80"> <div className="mb-2 flex items-center gap-2 text-muted-foreground">
Status atual <RiCheckboxCircleLine className="size-4" />
</span> <span className="text-xs font-semibold uppercase">
<span className="text-sm font-medium"> Status
<Badge </span>
variant={getStatusBadgeVariant( </div>
selectedBoleto.isSettled ? "Pago" : "Pendente", <Badge
)} variant={getStatusBadgeVariant(
className="text-xs" selectedBoleto.isSettled ? "Pago" : "Pendente",
> )}
{selectedBoleto.isSettled ? "Pago" : "Pendente"} >
</Badge> {selectedBoleto.isSettled ? "Pago" : "Pendente"}
</span> </Badge>
</div> </div>
</div> </div>
</div> </div>

3
components/dashboard/dashboard-welcome.tsx
View File

@@ -17,6 +17,7 @@ const formatCurrentDate = (date = new Date()) => {
day: "numeric", day: "numeric",
month: "long", month: "long",
year: "numeric", year: "numeric",
hour12: false,
timeZone: "America/Sao_Paulo", timeZone: "America/Sao_Paulo",
}).format(date); }).format(date);
@@ -68,7 +69,7 @@ export function DashboardWelcome({
/> />
</div> </div>
<div className="relative tracking-tight text-welcome-banner-foreground"> <div className="relative tracking-tight text-welcome-banner-foreground">
<h1 className="text-xl font-medium"> <h1 className="text-xl">
{greeting}, {displayName}! <span aria-hidden="true">👋</span> {greeting}, {displayName}! <span aria-hidden="true">👋</span>
</h1> </h1>
<p className="mt-2 text-sm opacity-90">{formattedDate}</p> <p className="mt-2 text-sm opacity-90">{formattedDate}</p>

145
components/dashboard/invoices-widget.tsx
View File

@@ -5,6 +5,7 @@ import {
RiCheckboxCircleLine, RiCheckboxCircleLine,
RiExternalLinkLine, RiExternalLinkLine,
RiLoader4Line, RiLoader4Line,
RiMoneyDollarCircleLine,
} from "@remixicon/react"; } from "@remixicon/react";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
@@ -87,12 +88,14 @@ const parseDueDate = (period: string, dueDay: string) => {
) { ) {
return { return {
label: `Vence dia ${dueDay}`, label: `Vence dia ${dueDay}`,
date: null,
}; };
} }
const date = new Date(Date.UTC(year, month - 1, dayNumber)); const date = new Date(Date.UTC(year, month - 1, dayNumber));
return { return {
label: `Vence em ${DUE_DATE_FORMATTER.format(date)}`, label: `Vence em ${DUE_DATE_FORMATTER.format(date)}`,
date,
}; };
}; };
@@ -251,6 +254,8 @@ export function InvoicesWidget({ invoices }: InvoicesWidgetProps) {
const dueInfo = parseDueDate(invoice.period, invoice.dueDay); const dueInfo = parseDueDate(invoice.period, invoice.dueDay);
const isPaid = const isPaid =
invoice.paymentStatus === INVOICE_PAYMENT_STATUS.PAID; invoice.paymentStatus === INVOICE_PAYMENT_STATUS.PAID;
const isOverdue =
!isPaid && dueInfo.date !== null && dueInfo.date < new Date();
const paymentInfo = formatPaymentDate(invoice.paidAt); const paymentInfo = formatPaymentDate(invoice.paidAt);
return ( return (
@@ -381,6 +386,15 @@ export function InvoicesWidget({ invoices }: InvoicesWidgetProps) {
<span className="text-success flex items-center gap-1"> <span className="text-success flex items-center gap-1">
<RiCheckboxCircleFill className="size-3" /> Pago <RiCheckboxCircleFill className="size-3" /> Pago
</span> </span>
) : isOverdue ? (
<span className="overdue-blink">
<span className="overdue-blink-primary text-destructive">
Atrasado
</span>
<span className="overdue-blink-secondary">
Pagar
</span>
</span>
) : ( ) : (
<span>Pagar</span> <span>Pagar</span>
)} )}
@@ -445,7 +459,7 @@ export function InvoicesWidget({ invoices }: InvoicesWidgetProps) {
</div> </div>
) : ( ) : (
<> <>
<DialogHeader className="gap-3"> <DialogHeader>
<DialogTitle>Confirmar pagamento</DialogTitle> <DialogTitle>Confirmar pagamento</DialogTitle>
<DialogDescription> <DialogDescription>
Revise os dados antes de confirmar. Vamos registrar a fatura Revise os dados antes de confirmar. Vamos registrar a fatura
@@ -454,72 +468,83 @@ export function InvoicesWidget({ invoices }: InvoicesWidgetProps) {
</DialogHeader> </DialogHeader>
{selectedInvoice ? ( {selectedInvoice ? (
<div className="flex flex-col gap-4"> <div className="space-y-4">
<div className="flex items-center gap-3 rounded-lg border border-border/60 bg-muted/50 p-3"> <div className="rounded-lg border p-4">
<div className="flex size-12 shrink-0 items-center justify-center overflow-hidden rounded-full border border-border/60 bg-background"> <div className="flex items-center justify-between">
{selectedLogo ? ( <div className="flex items-center gap-3">
<Image <div className="flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-full bg-primary/10">
src={selectedLogo} {selectedLogo ? (
alt={`Logo do cartão ${selectedInvoice.cardName}`} <Image
width={48} src={selectedLogo}
height={48} alt={`Logo do cartão ${selectedInvoice.cardName}`}
className="h-full w-full object-contain" width={40}
/> height={40}
) : ( className="h-full w-full object-contain"
<span className="text-sm font-semibold uppercase text-muted-foreground"> />
{buildInitials(selectedInvoice.cardName)} ) : (
</span> <span className="text-xs font-semibold uppercase text-primary">
)} {buildInitials(selectedInvoice.cardName)}
</div> </span>
<div> )}
<p className="text-sm text-muted-foreground">Cartão</p> </div>
<p className="text-base font-semibold text-foreground"> <div>
{selectedInvoice.cardName} <p className="text-sm font-medium text-muted-foreground">
</p> Cartão
{selectedInvoice.paymentStatus !== </p>
INVOICE_PAYMENT_STATUS.PAID ? ( <p className="text-lg font-bold text-foreground">
<p className="text-xs text-muted-foreground"> {selectedInvoice.cardName}
{ </p>
parseDueDate( </div>
selectedInvoice.period, </div>
selectedInvoice.dueDay, <div className="text-right">
).label {selectedInvoice.paymentStatus !==
} INVOICE_PAYMENT_STATUS.PAID ? (
</p> <p className="text-sm text-muted-foreground">
) : null} {
{selectedInvoice.paymentStatus === parseDueDate(
INVOICE_PAYMENT_STATUS.PAID && selectedPaymentInfo ? ( selectedInvoice.period,
<p className="text-xs text-success"> selectedInvoice.dueDay,
{selectedPaymentInfo.label} ).label
</p> }
) : null} </p>
) : null}
{selectedInvoice.paymentStatus ===
INVOICE_PAYMENT_STATUS.PAID && selectedPaymentInfo ? (
<p className="text-sm text-success">
{selectedPaymentInfo.label}
</p>
) : null}
</div>
</div> </div>
</div> </div>
<div className="grid grid-cols-1 gap-3 text-sm sm:grid-cols-1"> <div className="grid gap-3 sm:grid-cols-2">
<div className="rounded border border-border/60 px-3 items-center py-2 flex justify-between"> <div className="rounded-lg border p-3">
<span className="text-xs uppercase text-muted-foreground/80"> <div className="mb-2 flex items-center gap-2 text-muted-foreground">
Valor da fatura <RiMoneyDollarCircleLine className="size-4" />
</span> <span className="text-xs font-semibold uppercase">
Valor da Fatura
</span>
</div>
<MoneyValues <MoneyValues
amount={Math.abs(selectedInvoice.totalAmount)} amount={Math.abs(selectedInvoice.totalAmount)}
className="text-lg" className="text-lg font-bold"
/> />
</div> </div>
<div className="rounded border border-border/60 px-3 py-2 flex justify-between items-center"> <div className="rounded-lg border p-3">
<span className="text-xs uppercase text-muted-foreground/80"> <div className="mb-2 flex items-center gap-2 text-muted-foreground">
Status atual <RiCheckboxCircleLine className="size-4" />
</span> <span className="text-xs font-semibold uppercase">
<span className="block text-sm"> Status
<Badge </span>
variant={getStatusBadgeVariant( </div>
INVOICE_STATUS_LABEL[selectedInvoice.paymentStatus], <Badge
)} variant={getStatusBadgeVariant(
className="text-xs" INVOICE_STATUS_LABEL[selectedInvoice.paymentStatus],
> )}
{INVOICE_STATUS_LABEL[selectedInvoice.paymentStatus]} >
</Badge> {INVOICE_STATUS_LABEL[selectedInvoice.paymentStatus]}
</span> </Badge>
</div> </div>
</div> </div>
</div> </div>

8
components/navbar/nav-items.tsx
View File

@@ -1,12 +1,12 @@
import { import {
RiArrowLeftRightLine, RiArrowLeftRightLine,
RiAtLine,
RiBankCard2Line, RiBankCard2Line,
RiBankLine, RiBankLine,
RiBarChart2Line,
RiCalendarEventLine, RiCalendarEventLine,
RiFileChartLine, RiFileChartLine,
RiFundsLine,
RiGroupLine, RiGroupLine,
RiInboxLine,
RiPriceTag3Line, RiPriceTag3Line,
RiSparklingLine, RiSparklingLine,
RiTodoLine, RiTodoLine,
@@ -39,7 +39,7 @@ export const NAV_SECTIONS: NavSection[] = [
{ {
href: "/pre-lancamentos", href: "/pre-lancamentos",
label: "pré-lançamentos", label: "pré-lançamentos",
icon: <RiInboxLine className="size-4" />, icon: <RiAtLine className="size-4" />,
}, },
{ {
href: "/calendario", href: "/calendario",
@@ -65,7 +65,7 @@ export const NAV_SECTIONS: NavSection[] = [
{ {
href: "/orcamentos", href: "/orcamentos",
label: "orçamentos", label: "orçamentos",
icon: <RiFundsLine className="size-4" />, icon: <RiBarChart2Line className="size-4" />,
preservePeriod: true, preservePeriod: true,
}, },
], ],

116
components/notificacoes/notification-bell.tsx
View File

@@ -3,15 +3,16 @@
import { import {
RiAlertFill, RiAlertFill,
RiArrowRightLine, RiArrowRightLine,
RiAtLine,
RiBankCardLine, RiBankCardLine,
RiBarChart2Line, RiBarChart2Line,
RiCheckboxCircleFill, RiCheckboxCircleFill,
RiErrorWarningLine, RiErrorWarningLine,
RiFileListLine, RiFileListLine,
RiInboxLine,
RiNotification3Line, RiNotification3Line,
RiTimeLine, RiTimeLine,
} from "@remixicon/react"; } from "@remixicon/react";
import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import { useState } from "react"; import { useState } from "react";
import { Badge } from "@/components/ui/badge"; import { Badge } from "@/components/ui/badge";
@@ -46,6 +47,12 @@ type NotificationBellProps = {
preLancamentosCount?: number; preLancamentosCount?: number;
}; };
const resolveLogoPath = (logo: string | null | undefined) => {
if (!logo) return null;
if (/^(https?:\/\/|data:)/.test(logo)) return logo;
return logo.startsWith("/") ? logo : `/logos/${logo}`;
};
function formatDate(dateString: string): string { function formatDate(dateString: string): string {
const [year, month, day] = dateString.split("-").map(Number); const [year, month, day] = dateString.split("-").map(Number);
const date = new Date(Date.UTC(year, month - 1, day)); const date = new Date(Date.UTC(year, month - 1, day));
@@ -72,10 +79,8 @@ function SectionLabel({
}) { }) {
return ( return (
<div className="flex items-center gap-1.5 px-3 pb-1 pt-3"> <div className="flex items-center gap-1.5 px-3 pb-1 pt-3">
<span className="text-muted-foreground/60">{icon}</span> <span className="text-muted-foreground">{icon}</span>
<span className="text-[10px] font-semibold uppercase tracking-widest text-muted-foreground/60"> <span className="text-xs text-muted-foreground">{title}</span>
{title}
</span>
</div> </div>
); );
} }
@@ -174,7 +179,7 @@ export function NotificationBell({
{preLancamentosCount > 0 && ( {preLancamentosCount > 0 && (
<div> <div>
<SectionLabel <SectionLabel
icon={<RiInboxLine className="size-3" />} icon={<RiAtLine className="size-3" />}
title="Pré-lançamentos" title="Pré-lançamentos"
/> />
<Link <Link
@@ -182,6 +187,7 @@ export function NotificationBell({
onClick={() => setOpen(false)} onClick={() => setOpen(false)}
className="group mx-1 mb-1 flex items-center gap-2 rounded-md px-2 py-2 transition-colors hover:bg-accent/60" className="group mx-1 mb-1 flex items-center gap-2 rounded-md px-2 py-2 transition-colors hover:bg-accent/60"
> >
<RiAtLine className="size-6 shrink-0 text-primary" />
<p className="flex-1 text-xs leading-snug text-foreground"> <p className="flex-1 text-xs leading-snug text-foreground">
{preLancamentosCount === 1 {preLancamentosCount === 1
? "1 pré-lançamento aguardando revisão" ? "1 pré-lançamento aguardando revisão"
@@ -206,9 +212,9 @@ export function NotificationBell({
className="flex items-start gap-2 px-2 py-2" className="flex items-start gap-2 px-2 py-2"
> >
{n.status === "exceeded" ? ( {n.status === "exceeded" ? (
<RiAlertFill className="mt-0.5 size-3.5 shrink-0 text-destructive" /> <RiAlertFill className="mt-0.5 size-6 shrink-0 text-destructive" />
) : ( ) : (
<RiErrorWarningLine className="mt-0.5 size-3.5 shrink-0 text-amber-500" /> <RiErrorWarningLine className="mt-0.5 size-6 shrink-0 text-amber-500" />
)} )}
<p className="text-xs leading-snug"> <p className="text-xs leading-snug">
{n.status === "exceeded" ? ( {n.status === "exceeded" ? (
@@ -243,43 +249,54 @@ export function NotificationBell({
title="Cartão de Crédito" title="Cartão de Crédito"
/> />
<div className="mx-1 mb-1 overflow-hidden rounded-md"> <div className="mx-1 mb-1 overflow-hidden rounded-md">
{invoiceNotifications.map((n) => ( {invoiceNotifications.map((n) => {
<div const logo = resolveLogoPath(n.cardLogo);
key={n.id} return (
className="flex items-start gap-2 px-2 py-2" <div
> key={n.id}
{n.status === "overdue" ? ( className="flex items-start gap-2 px-2 py-2"
<RiAlertFill className="mt-0.5 size-3.5 shrink-0 text-destructive" /> >
) : ( {logo ? (
<RiTimeLine className="mt-0.5 size-3.5 shrink-0 text-amber-500" /> <Image
)} src={logo}
<p className="text-xs leading-snug"> alt=""
{n.status === "overdue" ? ( width={24}
<> height={24}
A fatura de <strong>{n.name}</strong> venceu em{" "} className="mt-0.5 size-6 shrink-0 rounded-sm object-contain"
{formatDate(n.dueDate)} />
{n.showAmount && n.amount > 0 && ( ) : n.status === "overdue" ? (
<> <RiAlertFill className="mt-0.5 size-3.5 shrink-0 text-destructive" />
{" "}
— <strong>{formatCurrency(n.amount)}</strong>
</>
)}
</>
) : ( ) : (
<> <RiTimeLine className="mt-0.5 size-3.5 shrink-0 text-amber-500" />
A fatura de <strong>{n.name}</strong> vence em{" "}
{formatDate(n.dueDate)}
{n.showAmount && n.amount > 0 && (
<>
{" "}
— <strong>{formatCurrency(n.amount)}</strong>
</>
)}
</>
)} )}
</p> <p className="text-xs leading-snug">
</div> {n.status === "overdue" ? (
))} <>
A fatura de <strong>{n.name}</strong> venceu em{" "}
{formatDate(n.dueDate)}
{n.showAmount && n.amount > 0 && (
<>
{" "}
— <strong>{formatCurrency(n.amount)}</strong>
</>
)}
</>
) : (
<>
A fatura de <strong>{n.name}</strong> vence em{" "}
{formatDate(n.dueDate)}
{n.showAmount && n.amount > 0 && (
<>
{" "}
— <strong>{formatCurrency(n.amount)}</strong>
</>
)}
</>
)}
</p>
</div>
);
})}
</div> </div>
</div> </div>
)} )}
@@ -297,11 +314,14 @@ export function NotificationBell({
key={n.id} key={n.id}
className="flex items-start gap-2 px-2 py-2" className="flex items-start gap-2 px-2 py-2"
> >
{n.status === "overdue" ? ( <RiAlertFill
<RiAlertFill className="mt-0.5 size-3.5 shrink-0 text-destructive" /> className={cn(
) : ( "mt-0.5 size-6 shrink-0",
<RiTimeLine className="mt-0.5 size-3.5 shrink-0 text-amber-500" /> n.status === "overdue"
)} ? "text-destructive"
: "text-amber-500",
)}
/>
<p className="text-xs leading-snug"> <p className="text-xs leading-snug">
{n.status === "overdue" ? ( {n.status === "overdue" ? (
<> <>

12
components/pagadores/details/pagador-info-card.tsx
View File

@@ -292,7 +292,7 @@ export function PagadorInfoCard({
<div className="space-y-4"> <div className="space-y-4">
{/* Total Geral */} {/* Total Geral */}
<div className="rounded-lg border bg-muted/30 p-4"> <div className="rounded-lg border p-4">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<div className="flex size-10 items-center justify-center rounded-full bg-primary/10"> <div className="flex size-10 items-center justify-center rounded-full bg-primary/10">
@@ -318,7 +318,7 @@ export function PagadorInfoCard({
{/* Grid de Formas de Pagamento */} {/* Grid de Formas de Pagamento */}
<div className="grid gap-3 sm:grid-cols-3"> <div className="grid gap-3 sm:grid-cols-3">
{/* Cartões */} {/* Cartões */}
<div className="rounded-lg border bg-background p-3"> <div className="rounded-lg border p-3">
<div className="flex items-center gap-2 text-muted-foreground mb-2"> <div className="flex items-center gap-2 text-muted-foreground mb-2">
<RiBankCard2Line className="size-4" /> <RiBankCard2Line className="size-4" />
<span className="text-xs font-semibold uppercase"> <span className="text-xs font-semibold uppercase">
@@ -331,7 +331,7 @@ export function PagadorInfoCard({
</div> </div>
{/* Boletos */} {/* Boletos */}
<div className="rounded-lg border bg-background p-3"> <div className="rounded-lg border p-3">
<div className="flex items-center gap-2 text-muted-foreground mb-2"> <div className="flex items-center gap-2 text-muted-foreground mb-2">
<RiBillLine className="size-4" /> <RiBillLine className="size-4" />
<span className="text-xs font-semibold uppercase"> <span className="text-xs font-semibold uppercase">
@@ -344,7 +344,7 @@ export function PagadorInfoCard({
</div> </div>
{/* Instantâneo */} {/* Instantâneo */}
<div className="rounded-lg border bg-background p-3"> <div className="rounded-lg border p-3">
<div className="flex items-center gap-2 text-muted-foreground mb-2"> <div className="flex items-center gap-2 text-muted-foreground mb-2">
<RiExchangeDollarLine className="size-4" /> <RiExchangeDollarLine className="size-4" />
<span className="text-xs font-semibold uppercase"> <span className="text-xs font-semibold uppercase">
@@ -361,7 +361,7 @@ export function PagadorInfoCard({
<div className="space-y-3"> <div className="space-y-3">
{/* Cartões Utilizados */} {/* Cartões Utilizados */}
{summary.cardUsage.length > 0 && ( {summary.cardUsage.length > 0 && (
<div className="rounded-lg border bg-muted/20 p-3"> <div className="rounded-lg border p-3">
<div className="flex items-center gap-2 mb-2"> <div className="flex items-center gap-2 mb-2">
<RiBankCard2Line className="size-4 text-muted-foreground" /> <RiBankCard2Line className="size-4 text-muted-foreground" />
<span className="text-xs font-semibold uppercase text-muted-foreground"> <span className="text-xs font-semibold uppercase text-muted-foreground">
@@ -387,7 +387,7 @@ export function PagadorInfoCard({
{/* Status de Boletos */} {/* Status de Boletos */}
{(summary.boletoStats.paidCount > 0 || {(summary.boletoStats.paidCount > 0 ||
summary.boletoStats.pendingCount > 0) && ( summary.boletoStats.pendingCount > 0) && (
<div className="rounded-lg border bg-muted/20 p-3"> <div className="rounded-lg border p-3">
<div className="flex items-center gap-2 mb-2"> <div className="flex items-center gap-2 mb-2">
<RiBillLine className="size-4 text-muted-foreground" /> <RiBillLine className="size-4 text-muted-foreground" />
<span className="text-xs font-semibold uppercase text-muted-foreground"> <span className="text-xs font-semibold uppercase text-muted-foreground">

12
components/pre-lancamentos/inbox-card.tsx
View File

@@ -36,6 +36,7 @@ interface InboxCardProps {
onProcess?: (item: InboxItem) => void; onProcess?: (item: InboxItem) => void;
onDiscard?: (item: InboxItem) => void; onDiscard?: (item: InboxItem) => void;
onViewDetails?: (item: InboxItem) => void; onViewDetails?: (item: InboxItem) => void;
onDelete?: (item: InboxItem) => void;
} }
function resolveLogoPath(logo: string): string { function resolveLogoPath(logo: string): string {
@@ -77,6 +78,7 @@ export function InboxCard({
onProcess, onProcess,
onDiscard, onDiscard,
onViewDetails, onViewDetails,
onDelete,
}: InboxCardProps) { }: InboxCardProps) {
const matchedLogo = useMemo( const matchedLogo = useMemo(
() => () =>
@@ -202,6 +204,16 @@ export function InboxCard({
{formattedStatusDate} {formattedStatusDate}
</span> </span>
)} )}
{onDelete && (
<Button
variant="ghost"
size="icon-sm"
className="ml-auto text-muted-foreground hover:text-destructive"
onClick={() => onDelete(item)}
>
<RiDeleteBinLine className="size-4" />
</Button>
)}
</CardFooter> </CardFooter>
) : ( ) : (
<CardFooter className="gap-2 pt-3 pb-4"> <CardFooter className="gap-2 pt-3 pb-4">

116
components/pre-lancamentos/inbox-page.tsx
View File

@@ -1,15 +1,18 @@
"use client"; "use client";
import { RiInboxLine } from "@remixicon/react"; import { RiAtLine, RiDeleteBinLine } from "@remixicon/react";
import { useCallback, useMemo, useState } from "react"; import { useCallback, useMemo, useState } from "react";
import { toast } from "sonner"; import { toast } from "sonner";
import { import {
bulkDeleteInboxItemsAction,
deleteInboxItemAction,
discardInboxItemAction, discardInboxItemAction,
markInboxAsProcessedAction, markInboxAsProcessedAction,
} from "@/app/(dashboard)/pre-lancamentos/actions"; } from "@/app/(dashboard)/pre-lancamentos/actions";
import { ConfirmActionDialog } from "@/components/confirm-action-dialog"; import { ConfirmActionDialog } from "@/components/confirm-action-dialog";
import { EmptyState } from "@/components/empty-state"; import { EmptyState } from "@/components/empty-state";
import { LancamentoDialog } from "@/components/lancamentos/dialogs/lancamento-dialog/lancamento-dialog"; import { LancamentoDialog } from "@/components/lancamentos/dialogs/lancamento-dialog/lancamento-dialog";
import { Button } from "@/components/ui/button";
import { Card } from "@/components/ui/card"; import { Card } from "@/components/ui/card";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { InboxCard } from "./inbox-card"; import { InboxCard } from "./inbox-card";
@@ -52,6 +55,14 @@ export function InboxPage({
const [discardOpen, setDiscardOpen] = useState(false); const [discardOpen, setDiscardOpen] = useState(false);
const [itemToDiscard, setItemToDiscard] = useState<InboxItem | null>(null); const [itemToDiscard, setItemToDiscard] = useState<InboxItem | null>(null);
const [deleteOpen, setDeleteOpen] = useState(false);
const [itemToDelete, setItemToDelete] = useState<InboxItem | null>(null);
const [bulkDeleteOpen, setBulkDeleteOpen] = useState(false);
const [bulkDeleteStatus, setBulkDeleteStatus] = useState<
"processed" | "discarded"
>("processed");
const sortByTimestamp = useCallback( const sortByTimestamp = useCallback(
(list: InboxItem[]) => (list: InboxItem[]) =>
[...list].sort( [...list].sort(
@@ -127,6 +138,60 @@ export function InboxPage({
throw new Error(result.error); throw new Error(result.error);
}, [itemToDiscard]); }, [itemToDiscard]);
const handleDeleteOpenChange = useCallback((open: boolean) => {
setDeleteOpen(open);
if (!open) {
setItemToDelete(null);
}
}, []);
const handleDeleteRequest = useCallback((item: InboxItem) => {
setItemToDelete(item);
setDeleteOpen(true);
}, []);
const handleDeleteConfirm = useCallback(async () => {
if (!itemToDelete) return;
const result = await deleteInboxItemAction({
inboxItemId: itemToDelete.id,
});
if (result.success) {
toast.success(result.message);
return;
}
toast.error(result.error);
throw new Error(result.error);
}, [itemToDelete]);
const handleBulkDeleteOpenChange = useCallback((open: boolean) => {
setBulkDeleteOpen(open);
}, []);
const handleBulkDeleteRequest = useCallback(
(status: "processed" | "discarded") => {
setBulkDeleteStatus(status);
setBulkDeleteOpen(true);
},
[],
);
const handleBulkDeleteConfirm = useCallback(async () => {
const result = await bulkDeleteInboxItemsAction({
status: bulkDeleteStatus,
});
if (result.success) {
toast.success(result.message);
return;
}
toast.error(result.error);
throw new Error(result.error);
}, [bulkDeleteStatus]);
const handleLancamentoSuccess = useCallback(async () => { const handleLancamentoSuccess = useCallback(async () => {
if (!itemToProcess) return; if (!itemToProcess) return;
@@ -180,7 +245,7 @@ export function InboxPage({
const renderEmptyState = (message: string) => ( const renderEmptyState = (message: string) => (
<Card className="flex min-h-[50vh] w-full items-center justify-center py-12"> <Card className="flex min-h-[50vh] w-full items-center justify-center py-12">
<EmptyState <EmptyState
media={<RiInboxLine className="size-6 text-primary" />} media={<RiAtLine className="size-6 text-primary" />}
title={message} title={message}
description="As notificações capturadas pelo app OpenMonetis Companion aparecerão aqui. Saiba mais em Ajustes > Companion." description="As notificações capturadas pelo app OpenMonetis Companion aparecerão aqui. Saiba mais em Ajustes > Companion."
/> />
@@ -205,6 +270,7 @@ export function InboxPage({
onProcess={readonly ? undefined : handleProcessRequest} onProcess={readonly ? undefined : handleProcessRequest}
onDiscard={readonly ? undefined : handleDiscardRequest} onDiscard={readonly ? undefined : handleDiscardRequest}
onViewDetails={readonly ? undefined : handleDetailsRequest} onViewDetails={readonly ? undefined : handleDetailsRequest}
onDelete={readonly ? handleDeleteRequest : undefined}
/> />
))} ))}
</div> </div>
@@ -229,9 +295,33 @@ export function InboxPage({
{renderGrid(sortedPending)} {renderGrid(sortedPending)}
</TabsContent> </TabsContent>
<TabsContent value="processed" className="mt-4"> <TabsContent value="processed" className="mt-4">
{sortedProcessed.length > 0 && (
<div className="mb-4 flex justify-end">
<Button
variant="outline"
size="sm"
onClick={() => handleBulkDeleteRequest("processed")}
>
<RiDeleteBinLine className="mr-1.5 size-4" />
Limpar processados
</Button>
</div>
)}
{renderGrid(sortedProcessed, true)} {renderGrid(sortedProcessed, true)}
</TabsContent> </TabsContent>
<TabsContent value="discarded" className="mt-4"> <TabsContent value="discarded" className="mt-4">
{sortedDiscarded.length > 0 && (
<div className="mb-4 flex justify-end">
<Button
variant="outline"
size="sm"
onClick={() => handleBulkDeleteRequest("discarded")}
>
<RiDeleteBinLine className="mr-1.5 size-4" />
Limpar descartados
</Button>
</div>
)}
{renderGrid(sortedDiscarded, true)} {renderGrid(sortedDiscarded, true)}
</TabsContent> </TabsContent>
</Tabs> </Tabs>
@@ -272,6 +362,28 @@ export function InboxPage({
pendingLabel="Descartando..." pendingLabel="Descartando..."
onConfirm={handleDiscardConfirm} onConfirm={handleDiscardConfirm}
/> />
<ConfirmActionDialog
open={deleteOpen}
onOpenChange={handleDeleteOpenChange}
title="Excluir notificação?"
description="A notificação será excluída permanentemente."
confirmLabel="Excluir"
confirmVariant="destructive"
pendingLabel="Excluindo..."
onConfirm={handleDeleteConfirm}
/>
<ConfirmActionDialog
open={bulkDeleteOpen}
onOpenChange={handleBulkDeleteOpenChange}
title={`Limpar ${bulkDeleteStatus === "processed" ? "processados" : "descartados"}?`}
description={`Todos os itens ${bulkDeleteStatus === "processed" ? "processados" : "descartados"} serão excluídos permanentemente.`}
confirmLabel="Limpar tudo"
confirmVariant="destructive"
pendingLabel="Excluindo..."
onConfirm={handleBulkDeleteConfirm}
/>
</> </>
); );
} }

4
components/sidebar/nav-link.tsx
View File

@@ -1,6 +1,7 @@
import { import {
type RemixiconComponentType, type RemixiconComponentType,
RiArrowLeftRightLine, RiArrowLeftRightLine,
RiAtLine,
RiBankCard2Line, RiBankCard2Line,
RiBankLine, RiBankLine,
RiCalendarEventLine, RiCalendarEventLine,
@@ -8,7 +9,6 @@ import {
RiFileChartLine, RiFileChartLine,
RiFundsLine, RiFundsLine,
RiGroupLine, RiGroupLine,
RiInboxLine,
RiPriceTag3Line, RiPriceTag3Line,
RiSettings2Line, RiSettings2Line,
RiSparklingLine, RiSparklingLine,
@@ -98,7 +98,7 @@ export function createSidebarNavData(
title: "Pré-Lançamentos", title: "Pré-Lançamentos",
url: "/pre-lancamentos", url: "/pre-lancamentos",
key: "pre-lancamentos", key: "pre-lancamentos",
icon: RiInboxLine, icon: RiAtLine,
badge: badge:
preLancamentosCount > 0 ? preLancamentosCount : undefined, preLancamentosCount > 0 ? preLancamentosCount : undefined,
}, },

6
lib/dashboard/notifications.ts
View File

@@ -23,6 +23,7 @@ export type DashboardNotification = {
amount: number; amount: number;
period?: string; period?: string;
showAmount: boolean; showAmount: boolean;
cardLogo?: string | null;
}; };
export type BudgetStatus = "exceeded" | "critical"; export type BudgetStatus = "exceeded" | "critical";
@@ -160,6 +161,7 @@ export async function fetchDashboardNotifications(
invoiceId: faturas.id, invoiceId: faturas.id,
cardId: cartoes.id, cardId: cartoes.id,
cardName: cartoes.name, cardName: cartoes.name,
cardLogo: cartoes.logo,
dueDay: cartoes.dueDay, dueDay: cartoes.dueDay,
period: faturas.period, period: faturas.period,
totalAmount: sql<number | null>` totalAmount: sql<number | null>`
@@ -189,6 +191,7 @@ export async function fetchDashboardNotifications(
invoiceId: faturas.id, invoiceId: faturas.id,
cardId: cartoes.id, cardId: cartoes.id,
cardName: cartoes.name, cardName: cartoes.name,
cardLogo: cartoes.logo,
dueDay: cartoes.dueDay, dueDay: cartoes.dueDay,
period: sql<string>`COALESCE(${faturas.period}, ${currentPeriod})`, period: sql<string>`COALESCE(${faturas.period}, ${currentPeriod})`,
paymentStatus: faturas.paymentStatus, paymentStatus: faturas.paymentStatus,
@@ -219,6 +222,7 @@ export async function fetchDashboardNotifications(
faturas.id, faturas.id,
cartoes.id, cartoes.id,
cartoes.name, cartoes.name,
cartoes.logo,
cartoes.dueDay, cartoes.dueDay,
faturas.period, faturas.period,
faturas.paymentStatus, faturas.paymentStatus,
@@ -296,6 +300,7 @@ export async function fetchDashboardNotifications(
amount: Math.abs(amount), amount: Math.abs(amount),
period: invoice.period, period: invoice.period,
showAmount: true, showAmount: true,
cardLogo: invoice.cardLogo,
}); });
} }
@@ -332,6 +337,7 @@ export async function fetchDashboardNotifications(
amount: Math.abs(amount), amount: Math.abs(amount),
period: invoice.period, period: invoice.period,
showAmount: invoiceIsOverdue, showAmount: invoiceIsOverdue,
cardLogo: invoice.cardLogo,
}); });
} }