feat(ui): improve asset catalog filtering and sorting

[viniciusrodriguesai]

Summary

This pull request improves RouteFilter's asset catalog UI with visibility filtering, configurable sorting, more precise grouped-asset behavior, and small robustness and accessibility improvements.

The goal is to make larger vehicle catalogs easier to inspect and manage without changing RouteFilter's restriction persistence, pathfinding, save data, ECS behavior, vehicle movement, or dependency graph. The final effective changes are limited to the catalog UI, its CSS module, and English/Simplified Chinese localization.

Motivation

Larger base-game, content-pack, and custom vehicle catalogs can be difficult to navigate with text search alone. Common tasks include isolating currently forbidden or allowed assets, comparing vehicle parameters, and locating a matching trailer or carriage while retaining its parent context.

This pull request adds those capabilities while preserving the existing restriction model and Apply/Clear/Cancel behavior.

User-facing changes

Visibility filtering

The catalog now supports:

• All: all applicable catalog entries;
• Forbidden: assets in the current selected/restricted set;
• Allowed: assets not in that set.

Visibility and text search are evaluated together. Changing search, visibility, sorting, or target transport resets pagination to the first page. Display filtering does not modify the selected set.

Sorting

The catalog can be sorted by Name, Maximum speed, Acceleration, or Braking in ascending or descending order.

Root assets are sorted before pagination. Numeric fields use numeric comparison. Name comparison is case-insensitive with asset ID as a deterministic tie-breaker. Sorting copies the root array instead of mutating React-derived catalog arrays.

Grouped parent/child assets

When a child matches but its parent does not, the parent remains visible only as structural context:

Train A
??? Carriage B

• contextual parents use subdued styling;
• contextual parents do not expose the normal restriction toggle;
• only children matching both search and visibility are actual child results;
• children remain associated with their parent rather than becoming unrelated roots;
• automatically expanded filtered groups can still be collapsed and reopened.

Root detection uses a memoized Set of relevant IDs for constant-time parent lookup. Children use predictable case-insensitive name ordering.

Selected-asset parsing

The comma-separated selectedAssetIds binding now trims tokens, removes empty values before numeric conversion, and retains only integer IDs. This prevents an empty binding from producing artificial ID 0 through Number("").

Validated behavior:

""        -> empty Set
"1,2,3"   -> {1,2,3}
",1,,2,"  -> {1,2}
invalid or non-integer values -> ignored

Accessibility and localization

Asset restriction and refresh controls now use localized accessibility labels instead of hardcoded English-only labels. All new player-facing controls are available in English and Simplified Chinese.

Final localization parity: 36 used RouteFilter UI keys, 36 registered keys, no missing or unused relevant keys.

Implementation notes

• filtering starts from the target-transport-specific catalog;
• search and visibility criteria combine logically;
• roots are filtered and sorted before pagination;
• child arrays are constructed locally before sorting;
• root parent lookup uses a memoized Set<number>;
• controls reuse React, classNames, CSS modules, and existing cs2/ui integration;
• no dependency or framework is added.

Development-history note

An experimental pending-change indicator and revert workflow was implemented during development. Static review showed that reliably validating its baseline behavior requires live Cities: Skylines II restriction buffers and unavailable-asset behavior.

That workflow was fully removed in a later commit before submission. The final effective diff contains no pending binding, applied-selection baseline, revert trigger, pending/revert UI, localization, CSS, or backend synchronization logic. The commits remain visible because development history was intentionally not rebased, squashed, or rewritten.

Effective scope

The final diff contains only:

• Setting.cs
• UI/src/routeFilterUI.tsx
• UI/src/routeFilterUI.module.scss

3 files changed, 101 insertions(+), 20 deletions(-)

Systems/RouteFilterUISystem.cs has no effective difference from main.

This pull request does not modify package files or lockfiles, dependencies, save serialization, restriction persistence, pathfinding, vehicle movement, ECS components, mod version, releases, GitHub Actions, deployment, or publishing configuration.

Validation

Check	Result
Local/remote SHA	Passed; both e318ff6a04b480b7991f8e83202cceb0c5243cbe
git diff --check main...HEAD	Passed
node node_modules/typescript/bin/tsc --noEmit	Passed under strict TypeScript settings
npm run build	Passed; webpack 5.97.1 compiled successfully
Build output	Explicitly constrained to repository-local UI/build
Installed dependency versions	webpack 5.97.1; chrome-trace-event 1.0.4
Visibility All / Forbidden / Allowed	Logical matrix passed
Search combined with Forbidden	Logical matrix passed
Numeric ascending/descending sorting	Logical matrix passed
Sorting source-array non-mutation	Logical matrix passed
Target transport and Set-based root lookup	Logical matrix passed
Case-insensitive child ordering	Logical matrix passed
Selected-ID parsing cases	Logical matrix passed
Empty pagination	Logical matrix passed
Filtered expand/collapse	Logical matrix passed
Localization parity	36 used, 36 registered, 0 missing, 0 unused
CSS module parity	34 used, 34 defined, 0 missing, 0 unused
Pending/revert search	No remaining references

Static review also found no conditional hooks, direct Set state mutation, source-array mutation by root sorting, invalid React keys, or CRITICAL/HIGH issue.

Build and runtime limitations

C# build was not performed because the required Cities: Skylines II assemblies/toolchain are unavailable in the contributor environment.

Cities: Skylines II runtime validation was not performed.

Visual validation inside the game was not performed.

Validation was limited to static review, TypeScript strict compilation, logical behavior tests, localization/CSS parity, a webpack production build, and Git diff checks. Runtime and visual testing require a maintainer or contributor with Cities: Skylines II.

Relationship to PR #4

Upstream main separately contains an invalid lock entry for unpublished chrome-trace-event@1.0.5. That pre-existing installation issue is addressed by PR #4, fix(build): restore valid chrome-trace-event lock entry.

This feature PR intentionally does not duplicate the lockfile correction. If CI fails specifically because npm ci receives HTTP 404 for chrome-trace-event@1.0.5, that failure originates from the upstream lockfile and is addressed separately by PR #4.

Suggested review order

1. Localized labels in Setting.cs.
2. Pure filter and comparison helpers in routeFilterUI.tsx.
3. Relevant/children/root pipeline and pre-pagination sorting.
4. Context-only parent rendering and filtered expand/collapse.
5. Compact catalog controls and contextual-row styles.
6. Confirmation that no pending/revert or backend restriction changes remain.