julienfroidefond/fintrack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: standardize formatting and improve readability across various components and styles, including CSS and TypeScript files

Browse Source
This commit is contained in:
Julien Froidefond
2025-12-08 06:37:29 +01:00
parent 2db5bc324d
commit 0321eab5b5
18 changed files with 347 additions and 244 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
components/dashboard/accounts-summary.tsx
View File

@@ -110,34 +110,39 @@ export function AccountsSummary({ data }: AccountsSummaryProps) {
? Math.max(0, (realBalance / totalPositive) * 100)
: 0;
return (
<div key={account.id} className="space-y-2.5 p-3 rounded-xl bg-muted/30 hover:bg-muted/50 border border-border/50 hover:border-primary/20 transition-all duration-300 group">
<div className="flex items-center justify-between">
<div className="flex items-center gap-3">
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-primary/20 to-primary/10 flex items-center justify-center group-hover:scale-110 transition-transform duration-300">
<Building2 className="w-5 h-5 text-primary" />
</div>
<div>
<p className="font-semibold text-sm">{account.name}</p>
<p className="text-xs text-muted-foreground/70 mt-0.5">
{account.accountNumber}
</p>
</div>
</div>
<span
className={cn(
"font-bold tabular-nums text-base",
realBalance >= 0 ? "text-emerald-600 dark:text-emerald-400" : "text-red-600 dark:text-red-400",
)}
>
{formatCurrency(realBalance)}
</span>
return (
<div
key={account.id}
className="space-y-2.5 p-3 rounded-xl bg-muted/30 hover:bg-muted/50 border border-border/50 hover:border-primary/20 transition-all duration-300 group"
>
<div className="flex items-center justify-between">
<div className="flex items-center gap-3">
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-primary/20 to-primary/10 flex items-center justify-center group-hover:scale-110 transition-transform duration-300">
<Building2 className="w-5 h-5 text-primary" />
</div>
<div>
<p className="font-semibold text-sm">{account.name}</p>
<p className="text-xs text-muted-foreground/70 mt-0.5">
{account.accountNumber}
</p>
</div>
{realBalance > 0 && (
<Progress value={percentage} className="h-2 rounded-full" />
)}
</div>
);
<span
className={cn(
"font-bold tabular-nums text-base",
realBalance >= 0
? "text-emerald-600 dark:text-emerald-400"
: "text-red-600 dark:text-red-400",
)}
>
{formatCurrency(realBalance)}
</span>
</div>
{realBalance > 0 && (
<Progress value={percentage} className="h-2 rounded-full" />
)}
</div>
);
})}
</div>
)}
@@ -154,7 +159,9 @@ export function AccountsSummary({ data }: AccountsSummaryProps) {
return (
<Card className="card-hover">
<CardHeader className="pb-4">
<CardTitle className="text-base md:text-lg font-bold">Mes Comptes</CardTitle>
<CardTitle className="text-base md:text-lg font-bold">
Mes Comptes
</CardTitle>
</CardHeader>
<CardContent>
<div className="flex flex-col items-center justify-center py-12 text-center">
@@ -178,7 +185,9 @@ export function AccountsSummary({ data }: AccountsSummaryProps) {
return (
<Card className="card-hover">
<CardHeader className="pb-4">
<CardTitle className="text-base md:text-lg font-bold">Mes Comptes</CardTitle>
<CardTitle className="text-base md:text-lg font-bold">
Mes Comptes
</CardTitle>
</CardHeader>
<CardContent>
<div className="space-y-6">
@@ -214,7 +223,10 @@ export function AccountsSummary({ data }: AccountsSummaryProps) {
: 0;
return (
<div key={account.id} className="space-y-2.5 p-3 rounded-xl bg-muted/30 hover:bg-muted/50 border border-border/50 hover:border-primary/20 transition-all duration-300 group">
<div
key={account.id}
className="space-y-2.5 p-3 rounded-xl bg-muted/30 hover:bg-muted/50 border border-border/50 hover:border-primary/20 transition-all duration-300 group"
>
<div className="flex items-center justify-between">
<div className="flex items-center gap-3">
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-primary/20 to-primary/10 flex items-center justify-center group-hover:scale-110 transition-transform duration-300">
@@ -241,7 +253,10 @@ export function AccountsSummary({ data }: AccountsSummaryProps) {
</span>
</div>
{realBalance > 0 && (
<Progress value={percentage} className="h-2 rounded-full" />
<Progress
value={percentage}
className="h-2 rounded-full"
/>
)}
</div>
);

6
components/dashboard/overview-cards.tsx
View File

@@ -13,7 +13,7 @@ interface OverviewCardsProps {
export function OverviewCards({ data }: OverviewCardsProps) {
const totalBalance = data.accounts.reduce(
(sum, acc) => sum + getAccountBalance(acc),
0
0,
);
const thisMonth = new Date();
@@ -21,7 +21,7 @@ export function OverviewCards({ data }: OverviewCardsProps) {
const thisMonthStr = thisMonth.toISOString().slice(0, 7);
const monthTransactions = data.transactions.filter((t) =>
t.date.startsWith(thisMonthStr)
t.date.startsWith(thisMonthStr),
);
const income = monthTransactions
@@ -62,7 +62,7 @@ export function OverviewCards({ data }: OverviewCardsProps) {
"text-2xl sm:text-3xl md:text-3xl lg:text-4xl xl:text-5xl font-black tracking-tight mb-4 leading-none",
totalBalance >= 0
? "text-emerald-600 dark:text-emerald-400"
: "text-red-600 dark:text-red-400"
: "text-red-600 dark:text-red-400",
)}
>
{formatCurrency(totalBalance)}

8
components/dashboard/recent-transactions.tsx
View File

@@ -43,11 +43,15 @@ export function RecentTransactions({ data }: RecentTransactionsProps) {
return (
<Card className="card-hover">
<CardHeader className="pb-4">
<CardTitle className="text-base md:text-lg font-bold">Transactions récentes</CardTitle>
<CardTitle className="text-base md:text-lg font-bold">
Transactions récentes
</CardTitle>
</CardHeader>
<CardContent>
<div className="flex flex-col items-center justify-center py-12 text-center">
<p className="text-muted-foreground font-medium">Aucune transaction</p>
<p className="text-muted-foreground font-medium">
Aucune transaction
</p>
<p className="text-sm text-muted-foreground/70 mt-2">
Importez un fichier OFX pour commencer
</p>

41
components/dashboard/sidebar.tsx
View File

@@ -69,7 +69,9 @@ function SidebarContent({
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-primary to-primary/80 flex items-center justify-center shadow-lg shadow-primary/20">
<Wallet className="w-5 h-5 text-primary-foreground" />
</div>
<span className="font-bold text-lg text-foreground tracking-tight">FinTrack</span>
<span className="font-bold text-lg text-foreground tracking-tight">
FinTrack
</span>
</div>
)}
</div>
@@ -85,19 +87,26 @@ function SidebarContent({
className={cn(
"w-full justify-start gap-4 h-12 rounded-2xl transition-all duration-300",
"hover:bg-muted/70 hover:scale-[1.02] hover:shadow-md",
isActive && "bg-gradient-to-r from-primary/15 via-primary/10 to-primary/5 border-2 border-primary/30 shadow-lg shadow-primary/10 backdrop-blur-sm",
isActive &&
"bg-gradient-to-r from-primary/15 via-primary/10 to-primary/5 border-2 border-primary/30 shadow-lg shadow-primary/10 backdrop-blur-sm",
collapsed && "justify-center px-2 w-12",
)}
>
<item.icon className={cn(
"w-5 h-5 shrink-0 transition-all duration-300",
isActive && "text-primary scale-110"
)} />
<item.icon
className={cn(
"w-5 h-5 shrink-0 transition-all duration-300",
isActive && "text-primary scale-110",
)}
/>
{!collapsed && (
<span className={cn(
"font-semibold text-sm",
isActive && "text-primary font-bold"
)}>{item.label}</span>
<span
className={cn(
"font-semibold text-sm",
isActive && "text-primary font-bold",
)}
>
{item.label}
</span>
)}
</Button>
</Link>
@@ -115,7 +124,9 @@ function SidebarContent({
)}
>
<Settings className="w-5 h-5 shrink-0" />
{!collapsed && <span className="font-semibold text-sm">Paramètres</span>}
{!collapsed && (
<span className="font-semibold text-sm">Paramètres</span>
)}
</Button>
</Link>
<Button
@@ -128,7 +139,9 @@ function SidebarContent({
)}
>
<LogOut className="w-5 h-5 shrink-0" />
{!collapsed && <span className="font-semibold text-sm">Déconnexion</span>}
{!collapsed && (
<span className="font-semibold text-sm">Déconnexion</span>
)}
</Button>
</div>
</>
@@ -173,7 +186,9 @@ export function Sidebar({ open, onOpenChange }: SidebarProps) {
<div className="w-12 h-12 rounded-2xl bg-gradient-to-br from-primary via-primary/90 to-primary/80 flex items-center justify-center shadow-xl shadow-primary/30 backdrop-blur-sm">
<Wallet className="w-6 h-6 text-primary-foreground" />
</div>
<span className="font-black text-xl text-foreground tracking-tight">FinTrack</span>
<span className="font-black text-xl text-foreground tracking-tight">
FinTrack
</span>
</div>
)}
<Button