CHANGELOG.fr.md

@@ -2,9 +2,6 @@
 
 ## [Non publié]
 
-### Corrigé
-- **Rapport Zoom catégorie** (`/reports/category`) : la liste déroulante du combobox des catégories affiche désormais la liste complète dans un ordre hiérarchique DFS correct — chaque racine est émise avant ses descendants, et les frères et sœurs sont triés par `sort_order` puis nom affiché. Auparavant la liste était triée globalement par `sort_order` (via un `ORDER BY sort_order, name` SQL), ce qui entrelaçait des parents et enfants de sous-arbres différents partageant le même `sort_order`, d'où l'indentation incohérente et l'impression d'arbre cassé. La recherche filtrée (insensible aux accents) conserve le même comportement (#126)
-
 ## [0.8.4] - 2026-04-21
 
 ### Ajouté

CHANGELOG.md

@@ -2,9 +2,6 @@
 
 ## [Unreleased]
 
-### Fixed
-- **Category zoom report** (`/reports/category`): the category combobox dropdown now renders the full list in proper hierarchical DFS order — each root is emitted before its descendants, with siblings sorted by `sort_order` then display name. Previously the list was ordered by `sort_order` globally (from a SQL `ORDER BY sort_order, name`), which interleaved parents and children from different sub-trees that shared the same `sort_order`, producing scrambled indentation and a mis-leading tree. Filtering (accent-insensitive search) still behaves identically (#126)
-
 ## [0.8.4] - 2026-04-21
 
 ### Added

src/components/shared/CategoryCombobox.test.ts

@@ -1,114 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { sortHierarchical } from "./CategoryCombobox";
-import type { Category } from "../../shared/types";
-
-function cat(
-  id: number,
-  name: string,
-  parentId: number | null,
-  sortOrder: number,
-): Category {
-  return {
-    id,
-    name,
-    parent_id: parentId ?? undefined,
-    type: "expense",
-    is_active: true,
-    is_inputable: true,
-    sort_order: sortOrder,
-    created_at: "",
-  };
-}
-
-const displayName = (c: Category) => c.name;
-
-describe("sortHierarchical", () => {
-  it("returns [] for empty input", () => {
-    expect(sortHierarchical([], displayName)).toEqual([]);
-  });
-
-  it("orders a single root before its children (parent-first DFS)", () => {
-    const input = [
-      cat(10, "Paie", 1, 1),
-      cat(1, "Revenus", null, 1),
-      cat(11, "Autres revenus", 1, 2),
-    ];
-    const ordered = sortHierarchical(input, displayName).map((c) => c.id);
-    expect(ordered).toEqual([1, 10, 11]);
-  });
-
-  it("keeps each root fully grouped with its sub-tree, roots ordered by sort_order", () => {
-    // Reproduces the reported bug: a flat list coming back globally ordered by
-    // (sort_order, name) would interleave roots and children that share the
-    // same sort_order. DFS must un-scramble that.
-    const input: Category[] = [
-      // Roots
-      cat(1, "Revenus", null, 1),
-      cat(2, "Dépenses récurrentes", null, 2),
-      // Children of Revenus (sort_order 1 & 2 within that parent)
-      cat(10, "Paie", 1, 1),
-      cat(11, "Autres revenus", 1, 2),
-      // Children of Dépenses récurrentes (sort_order 1 & 2 within that parent)
-      cat(20, "Loyer", 2, 1),
-      cat(21, "Électricité", 2, 2),
-    ];
-
-    // Simulate the SQL artifact: global sort by (sort_order, name), which is
-    // exactly what triggered the bug.
-    const scrambled = [...input].sort((a, b) => {
-      if (a.sort_order !== b.sort_order) return a.sort_order - b.sort_order;
-      return a.name.localeCompare(b.name);
-    });
-
-    const ordered = sortHierarchical(scrambled, displayName).map((c) => c.id);
-    expect(ordered).toEqual([1, 10, 11, 2, 20, 21]);
-  });
-
-  it("orders siblings by sort_order, then by display name as tiebreaker", () => {
-    const input: Category[] = [
-      cat(1, "Root", null, 1),
-      cat(12, "Beta", 1, 5),
-      cat(10, "Zulu", 1, 5), // same sort_order as 12 -> name tiebreak
-      cat(11, "Alpha", 1, 1),
-    ];
-    const ordered = sortHierarchical(input, displayName).map((c) => c.id);
-    // Under Root, order should be: Alpha(sort=1), Beta(sort=5,B<Z), Zulu(sort=5)
-    expect(ordered).toEqual([1, 11, 12, 10]);
-  });
-
-  it("handles 3-level hierarchies (parent -> intermediate -> leaf)", () => {
-    const input: Category[] = [
-      cat(2, "Dépenses", null, 2),
-      cat(31, "Assurances", 2, 12),
-      cat(310, "Assurance-auto", 31, 1),
-      cat(311, "Assurance-habitation", 31, 2),
-      cat(32, "Pharmacie", 2, 13),
-    ];
-    const ordered = sortHierarchical(input, displayName).map((c) => c.id);
-    expect(ordered).toEqual([2, 31, 310, 311, 32]);
-  });
-
-  it("appends orphans (parent filtered out / missing) at the end", () => {
-    const input: Category[] = [
-      cat(1, "Revenus", null, 1),
-      cat(10, "Paie", 1, 1),
-      // Orphan: parent_id 999 not in the set
-      cat(500, "Orphan", 999, 1),
-    ];
-    const ordered = sortHierarchical(input, displayName).map((c) => c.id);
-    expect(ordered).toEqual([1, 10, 500]);
-  });
-
-  it("is stable (does not duplicate) when called with already-ordered input", () => {
-    const input: Category[] = [
-      cat(1, "Revenus", null, 1),
-      cat(10, "Paie", 1, 1),
-      cat(2, "Dépenses", null, 2),
-      cat(20, "Loyer", 2, 1),
-    ];
-    const once = sortHierarchical(input, displayName);
-    const twice = sortHierarchical(once, displayName);
-    expect(twice.map((c) => c.id)).toEqual(once.map((c) => c.id));
-    expect(twice).toHaveLength(input.length);
-  });
-});

src/components/shared/CategoryCombobox.tsx

@@ -44,70 +44,6 @@ function computeDepths(categories: Category[]): Map<number, number> {
   return depths;
 }
 
-/**
- * Order a flat list of categories in hierarchical DFS order: each root is
- * emitted immediately followed by its descendants (depth-first, parent before
- * children). Siblings within a group are ordered by `sort_order` ascending,
- * then by `resolveName(cat)` for stable tiebreaking.
- *
- * A plain `ORDER BY sort_order, name` in SQL mixes parents and children from
- * different sub-trees that happen to share the same `sort_order`, producing
- * the scrambled indentation we saw in the by-category report combobox.
- * Doing the DFS client-side keeps rendering correct regardless of query shape.
- *
- * Orphans (category whose parent is missing or inactive / filtered out) are
- * emitted at the end, each treated as a pseudo-root, so nothing disappears.
- */
-export function sortHierarchical(
-  categories: Category[],
-  resolveName: (cat: Category) => string,
-): Category[] {
-  if (categories.length === 0) return [];
-
-  const ids = new Set<number>();
-  for (const c of categories) ids.add(c.id);
-
-  // Group by parent bucket: root (`null`) or parent id.
-  const childrenByParent = new Map<number | null, Category[]>();
-  const orphans: Category[] = [];
-  for (const c of categories) {
-    if (c.parent_id == null) {
-      const bucket = childrenByParent.get(null) ?? [];
-      bucket.push(c);
-      childrenByParent.set(null, bucket);
-    } else if (ids.has(c.parent_id)) {
-      const bucket = childrenByParent.get(c.parent_id) ?? [];
-      bucket.push(c);
-      childrenByParent.set(c.parent_id, bucket);
-    } else {
-      orphans.push(c);
-    }
-  }
-
-  const compare = (a: Category, b: Category) => {
-    if (a.sort_order !== b.sort_order) return a.sort_order - b.sort_order;
-    return resolveName(a).localeCompare(resolveName(b));
-  };
-  for (const bucket of childrenByParent.values()) bucket.sort(compare);
-  orphans.sort(compare);
-
-  const out: Category[] = [];
-  const visited = new Set<number>();
-  const visit = (cat: Category) => {
-    if (visited.has(cat.id)) return; // defensive against cycles
-    visited.add(cat.id);
-    out.push(cat);
-    const kids = childrenByParent.get(cat.id);
-    if (kids) for (const child of kids) visit(child);
-  };
-  const roots = childrenByParent.get(null) ?? [];
-  for (const root of roots) visit(root);
-  // Append orphans last, still treated as pseudo-roots so their own children
-  // (if any were pulled in) follow them.
-  for (const orphan of orphans) visit(orphan);
-  return out;
-}
-
 export default function CategoryCombobox({
   categories,
   value,
@@ -139,15 +75,7 @@ export default function CategoryCombobox({
     [t]
   );
 
-  // Re-order the (potentially sort_order-globally-sorted) input into proper
+  const selectedCategory = categories.find((c) => c.id === value);
-  // hierarchical DFS order so parents always precede their children and
-  // siblings stay grouped under the same ancestor.
-  const orderedCategories = useMemo(
-    () => sortHierarchical(categories, displayName),
-    [categories, displayName],
-  );
-
-  const selectedCategory = orderedCategories.find((c) => c.id === value);
   const displayLabel =
     activeExtra != null
       ? extraOptions?.find((o) => o.value === activeExtra)?.label ?? ""
@@ -157,8 +85,8 @@ export default function CategoryCombobox({
 
   const normalizedQuery = normalize(query);
   const filtered = query
-    ? orderedCategories.filter((c) => normalize(displayName(c)).includes(normalizedQuery))
+    ? categories.filter((c) => normalize(displayName(c)).includes(normalizedQuery))
-    : orderedCategories;
+    : categories;
 
   const filteredExtras = extraOptions
     ? query