Julian Tabel
c3bbd365a9
Use the predefined METHOD_ORDER/METHOD_CONFIG from EncounterMethodBadge to populate a select dropdown with all known encounter methods plus an "Other" option for custom values. Shows a colored badge preview on selection. Correctly handles editing encounters with non-standard methods. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1.7 KiB
1.7 KiB
title, status, type, priority, created_at, updated_at, parent
| title | status | type | priority | created_at | updated_at | parent |
|---|---|---|---|---|---|---|
| Improve encounter method input in route encounter form | completed | feature | normal | 2026-02-08T19:06:10Z | 2026-02-08T19:17:14Z | nuzlocke-tracker-iu5b |
Replace the free-text encounter method input in the route encounter form (RouteEncounterFormModal) with a smarter selector that leverages the known encounter methods already defined in the codebase.
Current behavior
- The encounter method field in RouteEncounterFormModal is a plain
<input type="text">with a placeholder "e.g. Walking, Surfing, Fishing" - Easy to introduce typos or inconsistent naming (e.g. "walking" vs "walk" vs "Grass")
- The app already has a well-defined set of encounter methods in
EncounterMethodBadge.tsxwith METHOD_CONFIG and METHOD_ORDER (starter, gift, fossil, trade, walk, headbutt, surf, rock-smash, old-rod, good-rod, super-rod) - The backend stores this as a
String(30)column, so it's not strictly enum-constrained
Desired behavior
- Replace the free-text input with a dropdown/select that lists the known encounter methods from METHOD_ORDER, using the human-readable labels from getMethodLabel()
- Include an "Other" option that reveals a text input for custom methods not in the predefined list
- When editing an existing encounter, pre-select the correct method
- Consider showing the colored badge preview next to each option for visual consistency with how methods appear elsewhere in the app
Files
frontend/src/components/admin/RouteEncounterFormModal.tsx— replace the text input with new selectorfrontend/src/components/EncounterMethodBadge.tsx— export METHOD_CONFIG or add a helper to get the list of known methods