forked from git.gladyson/openmonetis
BREAKING CHANGE: Remove feature de seleção de período das preferências do usuário
Alterações principais:
- Adiciona sistema completo de relatórios por categoria
- Cria página /relatorios/categorias com filtros e visualizações
- Implementa tabela e gráfico de evolução mensal
- Adiciona funcionalidade de exportação de dados
- Cria skeleton otimizado para melhor UX de loading
- Remove feature de seleção de período das preferências
- Deleta lib/user-preferences/period.ts
- Remove colunas periodMonthsBefore e periodMonthsAfter do schema
- Remove todas as referências em 16+ arquivos
- Atualiza database schema via Drizzle
- Substitui Select de período por MonthPicker visual
- Implementa componente PeriodPicker reutilizável
- Integra shadcn MonthPicker customizado (português, Remix icons)
- Substitui createMonthOptions em todos os formulários
- Mantém formato "YYYY-MM" no banco de dados
- Melhora design da tabela de relatórios
- Mescla colunas Categoria e Tipo em uma única coluna
- Substitui badge de tipo por dot colorido discreto
- Reduz largura da tabela em ~120px
- Atualiza skeleton para refletir nova estrutura
- Melhorias gerais de UI
- Reduz espaçamento entre títulos da sidebar (p-2 → px-2 py-1)
- Adiciona MonthNavigation para navegação entre períodos
- Otimiza loading states com skeletons detalhados
64 lines
1.6 KiB
TypeScript
64 lines
1.6 KiB
TypeScript
import { Badge } from "@/components/ui/badge";
|
|
import { cn } from "@/lib/utils/ui";
|
|
import DotIcon from "./dot-icon";
|
|
|
|
type TypeBadgeType =
|
|
| "receita"
|
|
| "despesa"
|
|
| "Receita"
|
|
| "Despesa"
|
|
| "Transferência"
|
|
| "transferência"
|
|
| "Saldo inicial"
|
|
| "Saldo Inicial";
|
|
|
|
interface TypeBadgeProps {
|
|
type: TypeBadgeType | string;
|
|
className?: string;
|
|
}
|
|
|
|
const TYPE_LABELS: Record<string, string> = {
|
|
receita: "Receita",
|
|
despesa: "Despesa",
|
|
Receita: "Receita",
|
|
Despesa: "Despesa",
|
|
Transferência: "Transferência",
|
|
transferência: "Transferência",
|
|
"Saldo inicial": "Saldo Inicial",
|
|
"Saldo Inicial": "Saldo Inicial",
|
|
};
|
|
|
|
export function TypeBadge({ type, className }: TypeBadgeProps) {
|
|
const normalizedType = type.toLowerCase();
|
|
const isReceita = normalizedType === "receita";
|
|
const isTransferencia = normalizedType === "transferência";
|
|
const isSaldoInicial = normalizedType === "saldo inicial";
|
|
const label = TYPE_LABELS[type] || type;
|
|
|
|
const colorClass = isTransferencia
|
|
? "text-blue-700 dark:text-blue-400"
|
|
: isReceita || isSaldoInicial
|
|
? "text-green-700 dark:text-green-400"
|
|
: "text-red-700 dark:text-red-400";
|
|
|
|
const dotColor = isTransferencia
|
|
? "bg-blue-700 dark:bg-blue-400"
|
|
: isReceita || isSaldoInicial
|
|
? "bg-green-600 dark:bg-green-400"
|
|
: "bg-red-600 dark:bg-red-400";
|
|
|
|
return (
|
|
<Badge
|
|
variant={"outline"}
|
|
className={cn(
|
|
"flex items-center gap-1 px-2 text-xs",
|
|
colorClass,
|
|
className
|
|
)}
|
|
>
|
|
<DotIcon bg_dot={dotColor} />
|
|
{label}
|
|
</Badge>
|
|
);
|
|
}
|