Epic 7: Settings

[Vitalisn4]

Issue #38: Build Settings Page Layout

Labels: epic-7, components, settings, priority-high
Milestone: Epic 7 - Settings
Dependencies: #7

Description:
Create settings page with tabbed sections.

Acceptance Criteria:

• Create Settings page component
• Add tab navigation:
  • Schedule Settings
  • Discord Integration
  • Group Management
• Create section components for each tab
• Ensure consistent spacing and layout
• Add page header with title
• Ensure responsive design
• Write unit tests

---

Issue #39: Build Discord Webhook Configuration

Labels: epic-7, components, settings, forms, priority-high
Milestone: Epic 7 - Settings
Dependencies: #38, #11, #45

Description:
Create form for configuring Discord webhook settings.

Acceptance Criteria:

• Create DiscordConfig component
• Add webhook URL input (masked with show/hide toggle)
• Add "Test Webhook" button
• Show message preview (formatted assignment list)
• Add enable/disable toggle
• Add form validation
• Show success/error toasts
• Implement test webhook API call
• Write unit tests

---

Issue #40: Build Schedule Settings Section

Labels: epic-7, components, settings, priority-high
Milestone: Epic 7 - Settings
Dependencies: #38, #16, #45

Description:
Create section for viewing and configuring schedule settings.

Acceptance Criteria:

• Create ScheduleSettings component
• Display current schedule status:
  • Last run date/time
  • Next run countdown (reuse Countdown component)
• Add interval configuration (default 14 days, editable)
• Add "Manual Trigger" button with confirmation modal
• Show confirmation before manual trigger
• Display trigger status (loading, success, error)
• Write unit tests

Technical Notes:

• May require backend API for manual trigger
• Use date-fns for date formatting

---

Issue #41: Build Group Management Section

Labels: epic-7, components, settings, forms, priority-medium
Milestone: Epic 7 - Settings
Dependencies: #38, #11, #45

Description:
Create section for managing group names and colors.

Acceptance Criteria:

• Create GroupManagement component
• Display current group names (A, B) with edit capability
• Add color picker for each group
• Show preview of group colors
• Display group member counts
• Add save/cancel buttons
• Show success toast on save
• Write unit tests

Technical Notes:

• Use color picker library (react-color or similar)
• Update CSS variables on save

---

Issue #42: Add Webhook Test Functionality

Labels: epic-7, features, settings, priority-medium
Milestone: Epic 7 - Settings
Dependencies: #39, #45

Description:
Implement test webhook feature to verify Discord integration.

Acceptance Criteria:

• Create API endpoint/hook for testing webhook
• Send test message with sample data
• Show loading state during test
• Display success message if webhook works
• Display error message with details if it fails
• Add retry button
• Write unit tests

---