notify-bridge/plans/entity-relationship-refactor/phase-6-frontend-commands.md

Phase 6: Frontend — Command Entities

Status: ⬜ Not Started Parent plan: 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