mirror of
https://github.com/Zproger/Aurum.git
synced 2026-10-13 02:56:39 +07:00
fix: sort category lists alphabetically on the Categories page
Expense/income lists were rendered in server sort_order (chart palette slot order), which looks arbitrary for browsing/managing categories. Sorts by translated name instead, locale-aware — same approach BudgetFormModal's category picker already uses. Display-only; sort_order itself is untouched since the dashboard donut chart still relies on it. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "aurum-frontend",
|
"name": "aurum-frontend",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "0.23.1",
|
"version": "0.23.2",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vite",
|
"dev": "vite",
|
||||||
|
|||||||
@@ -5,11 +5,20 @@ import { Button } from "@/components/ui/Button";
|
|||||||
import { CategoryFormModal } from "@/components/categories/CategoryFormModal";
|
import { CategoryFormModal } from "@/components/categories/CategoryFormModal";
|
||||||
import { CategoryList } from "@/components/categories/CategoryList";
|
import { CategoryList } from "@/components/categories/CategoryList";
|
||||||
import { useCategories, useDeleteCategory } from "@/hooks/useCategories";
|
import { useCategories, useDeleteCategory } from "@/hooks/useCategories";
|
||||||
|
import { translateCategoryName } from "@/lib/categoryLabels";
|
||||||
import { useTranslation } from "@/lib/i18n";
|
import { useTranslation } from "@/lib/i18n";
|
||||||
import type { Category, CategoryKind } from "@/types";
|
import type { Category, CategoryKind } from "@/types";
|
||||||
|
|
||||||
|
// Alphabetical by displayed (translated) name — same locale-aware sort
|
||||||
|
// BudgetFormModal's category picker uses, so a default category shown as
|
||||||
|
// its localized name sorts by that, not its raw stored English name.
|
||||||
|
function byName(language: string) {
|
||||||
|
return (a: Category, b: Category) =>
|
||||||
|
translateCategoryName(a.name).localeCompare(translateCategoryName(b.name), language);
|
||||||
|
}
|
||||||
|
|
||||||
export function CategoriesPage() {
|
export function CategoriesPage() {
|
||||||
const { t } = useTranslation();
|
const { t, language } = useTranslation();
|
||||||
const { data: categories, isLoading } = useCategories();
|
const { data: categories, isLoading } = useCategories();
|
||||||
const deleteCategory = useDeleteCategory();
|
const deleteCategory = useDeleteCategory();
|
||||||
|
|
||||||
@@ -38,8 +47,8 @@ export function CategoriesPage() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const expenseCategories = (categories ?? []).filter((category) => category.kind === "expense");
|
const expenseCategories = (categories ?? []).filter((category) => category.kind === "expense").sort(byName(language));
|
||||||
const incomeCategories = (categories ?? []).filter((category) => category.kind === "income");
|
const incomeCategories = (categories ?? []).filter((category) => category.kind === "income").sort(byName(language));
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="space-y-5">
|
<div className="space-y-5">
|
||||||
|
|||||||
Reference in New Issue
Block a user