# Phase 6: Frontend — Command Entities

**Status:** ⬜ Not Started
**Parent plan:** [PLAN.md](./PLAN.md)
**Domain:** frontend

## Objective
Create new frontend pages for CommandConfig and CommandTracker management. Update the
Telegram Bots page to remove inline commands config (now managed via CommandConfig entity)
and show listener status instead.

## Tasks

- [ ] Task 1: Create `frontend/src/routes/command-configs/+page.svelte`:
  - List view showing all command configs with name, provider_type badge, enabled command count, locale
  - Create form: name, icon, provider_type selector, enabled_commands checkboxes (from registry), locale dropdown, response_mode dropdown, default_count slider, rate_limits inputs
  - Edit/delete functionality
  - Follow existing page patterns (show/hide form toggle, icon picker, confirm modal for delete)

- [ ] Task 2: Create `frontend/src/routes/command-trackers/+page.svelte`:
  - List view showing command trackers: name, provider name, command config name, listener count, enabled status
  - Create form: name, icon, provider selector, command_config selector (filtered by matching provider_type), enabled toggle
  - Edit/delete functionality
  - Expandable section per tracker showing:
    - Linked listeners with type badge and name
    - "Add Listener" dropdown (select from user's telegram bots)
    - Remove listener button per listener

- [ ] Task 3: Update `frontend/src/routes/telegram-bots/+page.svelte`:
  - Remove the "Commands" expandable section (command enable/disable checkboxes, locale, response_mode, default_count, rate_limits)
  - Replace with "Listener Status" section showing:
    - List of command trackers using this bot as a listener
    - Each showing: tracker name, provider name, command config name, enabled status
    - Link to command tracker page
  - Keep: Chats section, Webhook section, Settings section (update_mode)

- [ ] Task 4: Update `frontend/src/routes/+layout.svelte` navigation:
  - Add "Command Configs" nav item (route `/command-configs`, icon: settings/cog)
  - Add "Command Trackers" nav item (route `/command-trackers`, icon: terminal/command)
  - Group navigation logically: Providers, Notification Trackers, Tracking, Templates, Targets, Bots | Command Trackers, Command Configs

- [ ] Task 5: Update `frontend/src/lib/i18n/en.json`:
  - Add `commandConfig.*` keys (title, form labels, validation messages)
  - Add `commandTracker.*` keys (title, form labels, listener management)
  - Add `nav.commandConfigs`, `nav.commandTrackers` keys
  - Remove `telegramBot.commands*` keys (moved to commandConfig)

- [ ] Task 6: Update `frontend/src/lib/i18n/ru.json` — same additions/removals as en.json with Russian translations

- [ ] Task 7: Update `frontend/src/routes/+page.svelte` (dashboard):
  - Add command tracker count/status to dashboard stats

## Files to Modify/Create
- `frontend/src/routes/command-configs/+page.svelte` — new page
- `frontend/src/routes/command-trackers/+page.svelte` — new page
- `frontend/src/routes/telegram-bots/+page.svelte` — remove commands section, add listener status
- `frontend/src/routes/+layout.svelte` — navigation
- `frontend/src/lib/i18n/en.json` — new keys
- `frontend/src/lib/i18n/ru.json` — new keys
- `frontend/src/routes/+page.svelte` — dashboard

## Acceptance Criteria
- CommandConfig page: full CRUD with provider_type filtering and command checkboxes
- CommandTracker page: full CRUD with provider/config selection and listener management
- Telegram Bots page: no more inline commands config, shows listener status instead
- Navigation includes new pages in logical grouping
- Both i18n languages updated
- Frontend builds without errors

## Notes
- Command checkboxes should show all 13 commands from the registry (help, status, albums, events, summary, latest, memory, random, search, find, person, place, favorites, people).
- Provider_type filtering: when user selects a provider in CommandTracker form, only show CommandConfigs with matching provider_type.
- The telegram bot "Sync with Telegram" button should remain — it now syncs commands from all linked command trackers.
- Follow existing UI patterns closely (ConfirmModal, icon picker, collapsible sections, snackbar notifications).

## Review Checklist
- [ ] All tasks completed
- [ ] Code follows project conventions
- [ ] No unintended side effects
- [ ] Build passes
- [ ] Tests pass (new + existing)

## Handoff to Next Phase
<!-- Filled in by the implementation agent after completing this phase. -->