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

refactor: update value formatting in combobox components to include names for better context and usability

Browse Source
This commit is contained in:
Julien Froidefond
2025-12-08 08:13:05 +01:00
parent 3e119813cd
commit 5014051e10
3 changed files with 11 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -171,7 +171,7 @@ export function AccountFilterCombobox({
<div key={folder.id}> <div key={folder.id}>
{/* Folder row */} {/* Folder row */}
<CommandItem <CommandItem
value={`folder-${folder.id}`} value={`folder-${folder.id} ${folder.name}`}
onSelect={() => handleSelectFolder(folder.id)} onSelect={() => handleSelectFolder(folder.id)}
style={{ paddingLeft: `${paddingLeft}px` }} style={{ paddingLeft: `${paddingLeft}px` }}
className="font-medium" className="font-medium"
@@ -195,7 +195,7 @@ export function AccountFilterCombobox({
return ( return (
<CommandItem <CommandItem
key={account.id} key={account.id}
value={account.id} value={`${account.id} ${account.name}`}
onSelect={() => handleSelect(account.id)} onSelect={() => handleSelect(account.id)}
style={{ paddingLeft: `${paddingLeft + 16}px` }} style={{ paddingLeft: `${paddingLeft + 16}px` }}
className="min-w-0" className="min-w-0"
@@ -324,7 +324,7 @@ export function AccountFilterCombobox({
return ( return (
<CommandItem <CommandItem
key={account.id} key={account.id}
value={account.id} value={`${account.id} ${account.name}`}
onSelect={() => handleSelect(account.id)} onSelect={() => handleSelect(account.id)}
className="min-w-0" className="min-w-0"
> >

16
components/ui/category-combobox.tsx
View File

@@ -118,16 +118,14 @@ export function CategoryCombobox({
<span className="text-muted-foreground"> <span className="text-muted-foreground">
Aucune catégorie Aucune catégorie
</span> </span>
{value === null && ( {value === null && <Check className="ml-auto h-4 w-4" />}
<Check className="ml-auto h-4 w-4" />
)}
</CommandItem> </CommandItem>
</CommandGroup> </CommandGroup>
<CommandGroup> <CommandGroup>
{parentCategories.map((parent) => ( {parentCategories.map((parent) => (
<div key={parent.id}> <div key={parent.id}>
<CommandItem <CommandItem
value={parent.id} value={`${parent.id} ${parent.name}`}
onSelect={() => handleSelect(parent.id)} onSelect={() => handleSelect(parent.id)}
> >
<CategoryIcon <CategoryIcon
@@ -143,7 +141,7 @@ export function CategoryCombobox({
{childrenByParent[parent.id]?.map((child) => ( {childrenByParent[parent.id]?.map((child) => (
<CommandItem <CommandItem
key={child.id} key={child.id}
value={child.id} value={`${child.id} ${child.name}`}
onSelect={() => handleSelect(child.id)} onSelect={() => handleSelect(child.id)}
className="pl-8" className="pl-8"
> >
@@ -206,16 +204,14 @@ export function CategoryCombobox({
<CommandItem value="__none__" onSelect={() => handleSelect(null)}> <CommandItem value="__none__" onSelect={() => handleSelect(null)}>
<X className="h-4 w-4 text-muted-foreground" /> <X className="h-4 w-4 text-muted-foreground" />
<span className="text-muted-foreground">Aucune catégorie</span> <span className="text-muted-foreground">Aucune catégorie</span>
{value === null && ( {value === null && <Check className="ml-auto h-4 w-4" />}
<Check className="ml-auto h-4 w-4" />
)}
</CommandItem> </CommandItem>
</CommandGroup> </CommandGroup>
<CommandGroup> <CommandGroup>
{parentCategories.map((parent) => ( {parentCategories.map((parent) => (
<div key={parent.id}> <div key={parent.id}>
<CommandItem <CommandItem
value={parent.id} value={`${parent.id} ${parent.name}`}
onSelect={() => handleSelect(parent.id)} onSelect={() => handleSelect(parent.id)}
> >
<CategoryIcon <CategoryIcon
@@ -231,7 +227,7 @@ export function CategoryCombobox({
{childrenByParent[parent.id]?.map((child) => ( {childrenByParent[parent.id]?.map((child) => (
<CommandItem <CommandItem
key={child.id} key={child.id}
value={child.id} value={`${child.id} ${child.name}`}
onSelect={() => handleSelect(child.id)} onSelect={() => handleSelect(child.id)}
className="pl-8" className="pl-8"
> >

4
components/ui/category-filter-combobox.tsx
View File

@@ -237,7 +237,7 @@ export function CategoryFilterCombobox({
{parentCategories.map((parent) => ( {parentCategories.map((parent) => (
<div key={parent.id}> <div key={parent.id}>
<CommandItem <CommandItem
value={parent.id} value={`${parent.id} ${parent.name}`}
onSelect={() => handleSelect(parent.id)} onSelect={() => handleSelect(parent.id)}
className="min-w-0" className="min-w-0"
> >
@@ -262,7 +262,7 @@ export function CategoryFilterCombobox({
{childrenByParent[parent.id]?.map((child) => ( {childrenByParent[parent.id]?.map((child) => (
<CommandItem <CommandItem
key={child.id} key={child.id}
value={child.id} value={`${child.id} ${child.name}`}
onSelect={() => handleSelect(child.id)} onSelect={() => handleSelect(child.id)}
className="pl-8 min-w-0" className="pl-8 min-w-0"
> >