feat: add search functionality and expand/collapse controls to categories page for improved user experience

This commit is contained in:
Julien Froidefond
2025-11-27 10:46:07 +01:00
parent 91e15ee07e
commit cc1e8c20a6
2 changed files with 84 additions and 19 deletions

View File

@@ -18,7 +18,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "alimentation",
name: "🛒 Alimentation",
name: "Alimentation",
color: "#22c55e",
icon: "utensils",
keywords: [],
@@ -84,7 +84,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "transport",
name: "🚗 Transport",
name: "Transport",
color: "#3b82f6",
icon: "car",
keywords: [],
@@ -201,7 +201,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "logement",
name: "🏠 Logement",
name: "Logement",
color: "#f59e0b",
icon: "home",
keywords: [],
@@ -291,7 +291,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "sante",
name: "💊 Santé",
name: "Santé",
color: "#ef4444",
icon: "heart",
keywords: [],
@@ -385,7 +385,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "loisirs",
name: "🎬 Loisirs",
name: "Loisirs",
color: "#8b5cf6",
icon: "gamepad",
keywords: [],
@@ -482,7 +482,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "shopping",
name: "👕 Shopping",
name: "Shopping",
color: "#06b6d4",
icon: "shopping-bag",
keywords: [],
@@ -548,7 +548,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "abonnements",
name: "📱 Abonnements",
name: "Abonnements",
color: "#8b5cf6",
icon: "repeat",
keywords: [],
@@ -592,7 +592,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "finance",
name: "💰 Finance",
name: "Finance",
color: "#64748b",
icon: "landmark",
keywords: [],
@@ -691,7 +691,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "revenus",
name: "💵 Revenus",
name: "Revenus",
color: "#10b981",
icon: "wallet",
keywords: [],
@@ -749,7 +749,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "voyage",
name: "✈️ Voyage",
name: "Voyage",
color: "#a855f7",
icon: "plane",
keywords: [],
@@ -793,7 +793,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "education",
name: "📚 Éducation",
name: "Éducation",
color: "#0284c7",
icon: "graduation-cap",
keywords: [],
@@ -836,7 +836,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "animaux",
name: "🐕 Animaux",
name: "Animaux",
color: "#ea580c",
icon: "paw-print",
keywords: [
@@ -857,7 +857,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "auto",
name: "🔧 Auto & Moto",
name: "Auto & Moto",
color: "#78716c",
icon: "car",
keywords: [],
@@ -899,7 +899,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "dons",
name: "🎁 Dons & Cadeaux",
name: "Dons & Cadeaux",
color: "#f43f5e",
icon: "gift",
keywords: [],
@@ -935,7 +935,7 @@ export const defaultCategories: CategoryDefinition[] = [
// ═══════════════════════════════════════════════════════════════════════════
{
slug: "divers",
name: "Divers",
name: "Divers",
color: "#71717a",
icon: "more-horizontal",
keywords: [],