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

27
components/ui/account-filter-combobox.tsx
View File

@@ -64,7 +64,7 @@ export function AccountFilterCombobox({
// Get root folders (folders without parent) - same as folders/page.tsx
const rootFolders = useMemo(
() => folders.filter((f) => f.parentId === null),
[folders]
[folders],
);
// Get child folders for a given parent - same as FolderTreeItem
@@ -78,7 +78,7 @@ export function AccountFilterCombobox({
// Get accounts without folder
const orphanAccounts = useMemo(
() => accounts.filter((a) => !a.folderId),
[accounts]
[accounts],
);
const selectedAccounts = accounts.filter((a) => value.includes(a.id));
@@ -89,7 +89,7 @@ export function AccountFilterCombobox({
const directAccounts = getFolderAccounts(folderId);
const childFoldersList = getChildFolders(folderId);
const childAccounts = childFoldersList.flatMap((cf) =>
getAllAccountsInFolder(cf.id)
getAllAccountsInFolder(cf.id),
);
return [...directAccounts, ...childAccounts];
};
@@ -126,7 +126,7 @@ export function AccountFilterCombobox({
if (allSelected) {
const newSelection = value.filter(
(v) => !allFolderAccountIds.includes(v)
(v) => !allFolderAccountIds.includes(v),
);
onChange(newSelection.length > 0 ? newSelection : ["all"]);
} else {
@@ -153,7 +153,7 @@ export function AccountFilterCombobox({
const folderAccounts = getAllAccountsInFolder(folderId);
if (folderAccounts.length === 0) return false;
const selectedCount = folderAccounts.filter((a) =>
value.includes(a.id)
value.includes(a.id),
).length;
return selectedCount > 0 && selectedCount < folderAccounts.length;
};
@@ -185,7 +185,7 @@ export function AccountFilterCombobox({
<Check
className={cn(
"h-4 w-4",
isFolderSelected(folder.id) ? "opacity-100" : "opacity-0"
isFolderSelected(folder.id) ? "opacity-100" : "opacity-0",
)}
/>
</div>
@@ -213,7 +213,7 @@ export function AccountFilterCombobox({
<Check
className={cn(
"ml-auto h-4 w-4 shrink-0",
value.includes(account.id) ? "opacity-100" : "opacity-0"
value.includes(account.id) ? "opacity-100" : "opacity-0",
)}
/>
</CommandItem>
@@ -222,7 +222,7 @@ export function AccountFilterCombobox({
{/* Child folders - recursive */}
{childFoldersList.map((childFolder) =>
renderFolder(childFolder, depth + 1, currentPath)
renderFolder(childFolder, depth + 1, currentPath),
)}
</div>
);
@@ -237,7 +237,7 @@ export function AccountFilterCombobox({
aria-expanded={open}
className={cn(
"justify-between min-w-0 h-10 w-full text-sm font-normal",
className
className,
)}
>
<div className="flex items-center gap-2 min-w-0 flex-1">
@@ -304,7 +304,10 @@ export function AccountFilterCombobox({
<span className="text-xs text-muted-foreground ml-1">
(
{formatCurrency(
filteredTransactions.reduce((sum, t) => sum + t.amount, 0)
filteredTransactions.reduce(
(sum, t) => sum + t.amount,
0,
),
)}
)
</span>
@@ -312,7 +315,7 @@ export function AccountFilterCombobox({
<Check
className={cn(
"ml-auto h-4 w-4",
isAll ? "opacity-100" : "opacity-0"
isAll ? "opacity-100" : "opacity-0",
)}
/>
</CommandItem>
@@ -348,7 +351,7 @@ export function AccountFilterCombobox({
"ml-auto h-4 w-4 shrink-0",
value.includes(account.id)
? "opacity-100"
: "opacity-0"
: "opacity-0",
)}
/>
</CommandItem>

3
components/ui/button.tsx
View File

@@ -9,7 +9,8 @@ const buttonVariants = cva(
{
variants: {
variant: {
default: "bg-gradient-to-r from-primary via-primary/95 to-primary/90 text-primary-foreground hover:from-primary/95 hover:via-primary hover:to-primary/95 shadow-xl shadow-primary/30 hover:shadow-2xl hover:shadow-primary/40 hover:scale-[1.03] active:scale-[0.97] backdrop-blur-sm border border-primary/20",
default:
"bg-gradient-to-r from-primary via-primary/95 to-primary/90 text-primary-foreground hover:from-primary/95 hover:via-primary hover:to-primary/95 shadow-xl shadow-primary/30 hover:shadow-2xl hover:shadow-primary/40 hover:scale-[1.03] active:scale-[0.97] backdrop-blur-sm border border-primary/20",
destructive:
"bg-gradient-to-r from-destructive via-destructive/95 to-destructive/90 text-white hover:from-destructive/95 hover:via-destructive hover:to-destructive/95 shadow-xl shadow-destructive/30 hover:shadow-2xl hover:shadow-destructive/40 hover:scale-[1.03] focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 active:scale-[0.97] backdrop-blur-sm border border-destructive/20",
outline:

6
components/ui/card.tsx
View File

@@ -10,7 +10,7 @@ function Card({ className, ...props }: React.ComponentProps<"div">) {
"fintech-card",
"bg-card text-card-foreground flex flex-col",
"transition-all duration-300 ease-out",
className
className,
)}
{...props}
/>
@@ -23,7 +23,7 @@ function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
data-slot="card-header"
className={cn(
"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 pt-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
className
className,
)}
{...props}
/>
@@ -56,7 +56,7 @@ function CardAction({ className, ...props }: React.ComponentProps<"div">) {
data-slot="card-action"
className={cn(
"col-start-2 row-span-2 row-start-1 self-start justify-self-end",
className
className,
)}
{...props}
/>

34
components/ui/popover.tsx
View File

@@ -30,17 +30,21 @@ function PopoverContent({
if (!element) return;
const disableAnimations = () => {
element.style.setProperty('animation', 'none', 'important');
element.style.setProperty('transition', 'none', 'important');
element.style.setProperty("animation", "none", "important");
element.style.setProperty("transition", "none", "important");
// Ne pas toucher au transform car il est utilisé pour le positionnement
element.style.setProperty('opacity', '1', 'important');
element.style.setProperty('will-change', 'auto', 'important');
element.style.setProperty("opacity", "1", "important");
element.style.setProperty("will-change", "auto", "important");
// Supprimer toutes les classes d'animation Tailwind
const classesToRemove = Array.from(element.classList).filter(cls =>
cls.includes('animate') || cls.includes('fade') || cls.includes('zoom') || cls.includes('slide')
const classesToRemove = Array.from(element.classList).filter(
(cls) =>
cls.includes("animate") ||
cls.includes("fade") ||
cls.includes("zoom") ||
cls.includes("slide"),
);
classesToRemove.forEach(cls => element.classList.remove(cls));
classesToRemove.forEach((cls) => element.classList.remove(cls));
};
// Désactiver immédiatement
@@ -53,7 +57,7 @@ function PopoverContent({
observer.observe(element, {
attributes: true,
attributeFilter: ['class', 'data-state'],
attributeFilter: ["class", "data-state"],
subtree: false,
});
@@ -84,11 +88,13 @@ function PopoverContent({
"bg-popover text-popover-foreground z-50 w-72 rounded-md border p-4 shadow-md outline-hidden",
className,
)}
style={{
animation: 'none !important',
transition: 'none !important',
opacity: '1 !important',
} as React.CSSProperties}
style={
{
animation: "none !important",
transition: "none !important",
opacity: "1 !important",
} as React.CSSProperties
}
{...props}
/>
</PopoverPrimitive.Portal>

34
components/ui/select.tsx
View File

@@ -63,17 +63,21 @@ function SelectContent({
if (!element) return;
const disableAnimations = () => {
element.style.setProperty('animation', 'none', 'important');
element.style.setProperty('transition', 'none', 'important');
element.style.setProperty("animation", "none", "important");
element.style.setProperty("transition", "none", "important");
// Ne pas toucher au transform car il est utilisé pour le positionnement
element.style.setProperty('opacity', '1', 'important');
element.style.setProperty('will-change', 'auto', 'important');
element.style.setProperty("opacity", "1", "important");
element.style.setProperty("will-change", "auto", "important");
// Supprimer toutes les classes d'animation Tailwind
const classesToRemove = Array.from(element.classList).filter(cls =>
cls.includes('animate') || cls.includes('fade') || cls.includes('zoom') || cls.includes('slide')
const classesToRemove = Array.from(element.classList).filter(
(cls) =>
cls.includes("animate") ||
cls.includes("fade") ||
cls.includes("zoom") ||
cls.includes("slide"),
);
classesToRemove.forEach(cls => element.classList.remove(cls));
classesToRemove.forEach((cls) => element.classList.remove(cls));
};
// Désactiver immédiatement
@@ -86,7 +90,7 @@ function SelectContent({
observer.observe(element, {
attributes: true,
attributeFilter: ['class', 'data-state'],
attributeFilter: ["class", "data-state"],
subtree: false,
});
@@ -116,11 +120,13 @@ function SelectContent({
className,
)}
position={position}
style={{
animation: 'none !important',
transition: 'none !important',
opacity: '1 !important',
} as React.CSSProperties}
style={
{
animation: "none !important",
transition: "none !important",
opacity: "1 !important",
} as React.CSSProperties
}
{...props}
>
<SelectScrollUpButton />