f50261208a
- Adicionar tokens semânticos de estado (success, warning, info) no globals.css - Migrar ~60+ componentes de cores hardcoded do Tailwind para tokens semânticos - Unificar 3 arrays duplicados de cores de categorias em importação única - Corrigir widgets de boleto/fatura que não atualizavam após pagamento (actions de fatura e antecipação não invalidavam cache do dashboard) - Corrigir scroll em listas Popover+Command (modal prop) - Adicionar link "detalhes" no card de orçamento para página da categoria - Adicionar indicadores de tendência coloridos nos cards de métricas - Estender cores de chart de 6 para 10 - Normalizar dark mode e remover tokens não utilizados Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
86 lines
1.8 KiB
TypeScript
86 lines
1.8 KiB
TypeScript
"use client";
|
|
|
|
import { RiBankLine } from "@remixicon/react";
|
|
import Image from "next/image";
|
|
import DotIcon from "@/components/dot-icon";
|
|
|
|
type SelectItemContentProps = {
|
|
label: string;
|
|
logo?: string | null;
|
|
};
|
|
|
|
const resolveLogoSrc = (logo: string | null) => {
|
|
if (!logo) {
|
|
return null;
|
|
}
|
|
|
|
const fileName = logo.split("/").filter(Boolean).pop() ?? logo;
|
|
return `/logos/${fileName}`;
|
|
};
|
|
|
|
const getBrandLogo = (brand: string): string | null => {
|
|
const brandMap: Record<string, string> = {
|
|
Visa: "visa.png",
|
|
Mastercard: "mastercard.png",
|
|
Elo: "elo.png",
|
|
};
|
|
|
|
return brandMap[brand] ?? null;
|
|
};
|
|
|
|
export function BrandSelectContent({ label }: { label: string }) {
|
|
const brandLogo = getBrandLogo(label);
|
|
const logoSrc = brandLogo ? `/logos/${brandLogo}` : null;
|
|
|
|
return (
|
|
<span className="flex items-center gap-2">
|
|
{logoSrc ? (
|
|
<Image
|
|
src={logoSrc}
|
|
alt={`Logo ${label}`}
|
|
width={24}
|
|
height={24}
|
|
className="rounded object-contain"
|
|
/>
|
|
) : (
|
|
<RiBankLine className="size-5 text-muted-foreground" aria-hidden />
|
|
)}
|
|
<span>{label}</span>
|
|
</span>
|
|
);
|
|
}
|
|
|
|
export function StatusSelectContent({ label }: { label: string }) {
|
|
const isActive = label === "Ativo";
|
|
|
|
return (
|
|
<span className="flex items-center gap-2">
|
|
<DotIcon
|
|
color={isActive ? "bg-success" : "bg-slate-400 dark:bg-slate-500"}
|
|
/>
|
|
<span>{label}</span>
|
|
</span>
|
|
);
|
|
}
|
|
|
|
export function AccountSelectContent({ label, logo }: SelectItemContentProps) {
|
|
const logoSrc = resolveLogoSrc(logo);
|
|
|
|
return (
|
|
<span className="flex items-center gap-2">
|
|
{logoSrc ? (
|
|
<Image
|
|
src={logoSrc}
|
|
alt={`Logo de ${label}`}
|
|
width={20}
|
|
height={20}
|
|
className="rounded"
|
|
/>
|
|
) : (
|
|
<RiBankLine className="size-4 text-muted-foreground" aria-hidden />
|
|
)}
|
|
<span>{label}</span>
|
|
</span>
|
|
);
|
|
}
|