Project Checklist (tidy & current)

Below are implemented features - [x] Front - [x] Live updates between bot and frontend using SSE events for real-time log synchronization (admin logs update immediately when moderation actions occur)nd UI for admin logs configuration in Server Settings - [x] Database schema for storing moderation action logs - [x] Require reason field (minimum 3 words) for all moderation commands

Admin Logs UI: added logs display section showing recent moderation actions with detailsd pending items, grouped by area.

Backend

Express API: OAuth, server settings, channel/role endpoints, leave
Invite endpoints (GET/POST/DELETE) and invite-token issuance
Per-command toggles persistence and management
Config endpoints for welcome/leave and autorole
Admin Logs API endpoints: GET/POST for admin logs configuration, GET for retrieving moderation action logs
Frontend Moderation API: POST endpoint for direct ban/kick/timeout actions from web interface
Server Members API: GET endpoint for fetching server members for moderation user selection
SSE events: added botStatusUpdate events for real-time bot join/leave notifications

Frontend

Login, Dashboard, Server Settings pages
- Login redirects to Dashboard after OAuth and user/guilds are persisted in localStorage
- Dashboard is protected: user must be logged in to view (redirects to login otherwise)
MUI components, responsive layout, mobile fixes
Theme switching (persist local) and user settings UI with adjusted light theme background
Invite UI: create form, list, copy, delete with confirmation
Commands UI (per-command toggles)
- Admin commands (kick/ban/timeout) removed from regular commands list, only shown in Admin Commands section
Live Notifications UI (per-server toggle & config)
- Channel selection, watched-user list, live status with Watch Live button
- Real-time updates: adding/removing users via frontend or bot commands publishes SSE twitchUsersUpdate and pushes settings to bot
- Bot commands (/add-twitchuser, /remove-twitchuser) refresh local cache immediately after backend success
- Message mode: toggle between Default and Custom; Apply sends message/customMessage (default fallback if empty); no longer dual free-form fields
- Collapsible accordion interface: separate Twitch and Kick tabs (Kick tab disabled)
Admin Commands UI: dedicated section for moderation commands with toggle controls
- Moderation Commands (/kick, /ban, /timeout) displayed with permission requirements and toggle switches
- Admin Logs Configuration UI: channel selection and per-command enable/disable toggles
Frontend Moderation Actions: direct ban/kick/timeout functionality from web interface with user autocomplete dropdown
- User permission validation and reason requirements (minimum 3 words)
- Integration with backend moderation API and admin logging system
Admin Logs channel selection: shows all server text channels (not just channels where bot has permission) and updates immediately when changed
Admin logs properly save moderator usernames for both bot slash commands and frontend moderation actions, and persist across page refreshes

Discord Bot

discord.js integration (events and commands)
Slash commands: /create-invite, /list-invites, /manage-commands, /help
Bot used by backend to fetch live guild data and manage invites
Bot reads/writes per-guild command toggles via backend/Postgres
Backend immediately notifies bot of toggle changes (pushes updated settings to bot cache) so frontend toggles take effect instantly
New slash command: /setup-live to enable/disable Twitch live notifications for the server (preserves other settings)
Frontend: Confirm dialog and working Delete action for Twitch watched users in Live Notifications
Live Notifications: bot posts message to configured channel with stream title and link when a watched Twitch user goes live
- Live Notifications: bot posts rich embed to channel when a watched Twitch user goes live (thumbnail, clickable title, bio/description, category/game, viewers, footer with "ehchadservices" and start datetime)
- Live Notifications polling frequency set to 5 seconds (configurable via TWITCH_POLL_INTERVAL_MS)
- On bot restart, sends messages for currently live watched users; then sends for new streams once per session
- Twitch Watcher Debug Logging: comprehensive debug mode added (enable with TWITCH_WATCHER_DEBUG=true) to track guild checks, settings retrieval, stream fetching, channel permissions, and message sending for troubleshooting live notification issues
  - Twitch API Functions Export Fix: added missing tryFetchTwitchStreams and _rawGetTwitchStreams to api.js module exports to resolve "is not a function" errors
  - Twitch Streams Array Safety: added Array.isArray() checks in twitch-watcher.js to prevent "filter is not a function" errors when API returns unexpected data types
  - Twitch Commands Postgres Integration: updated all Discord bot Twitch commands (/add-twitchuser, /remove-twitchuser) to use api.js functions for consistent Postgres backend communication
  - Twitch Message Template Variables: added support for {user}, {title}, {category}, and {viewers} template variables in custom live notification messages for dynamic content insertion
    - Frontend JSX Syntax Fix: fixed React Fragment wrapping for admin logs map to resolve build compilation errors
Frontend: show "Watch Live" button next to watched user when they are live (links to Twitch)
- Bi-directional sync: backend POST/DELETE for twitch-users now also pushes new settings to bot process (when BOT_PUSH_URL configured)
- Bot adds/removes users via backend endpoints ensuring single source of truth (Postgres)
- Live notifications toggle on site enables/disables watching and publishes SSE for real-time updates
- /manage-commands command has enable/disable buttons that sync with frontend via backend API and SSE for live updating
- All Twitch-related commands (add, remove, list) and frontend actions communicate with backend and Postgres database
Welcome/Leave messages: bot sends configured messages to channels when users join/leave
- Welcome messages with {user} and {server} placeholders
- Leave messages with {user} placeholder
- Autorole assignment on member join
- All settings managed through Server Settings UI
- Event handlers properly integrated with API settings
Kick live notifications bot integration (temporarily disabled)
- New slash commands: /add-kickuser, /remove-kickuser, /list-kickusers (commands exist but watcher disabled)
- Kick API polling and notification posting (watcher removed, API endpoints remain)
- Per-server Kick user management via backend API (endpoints functional)
- Frontend tabs: separate Twitch and Kick tabs in Live Notifications accordion (Kick tab disabled)
- Bot watcher temporarily disabled in index.js startup
Dev command filtering: commands marked with dev: true are hidden from UI, help, and Discord registration
Admin Moderation Commands: /kick, /ban, /timeout with proper permission checks and role hierarchy validation
- Commands accept user mentions or user IDs as input to allow targeting any user (not limited by Discord's user selection filtering)
- Frontend integration: web interface moderation actions with permission validation
- Moderation actions are logged to postgres database with reasons and automatically posted to configured admin logs channel
- Admin logs properly capture and display the moderator who performed the action (both from bot slash commands and frontend)
Admin Logs System: event logging for moderation actions
- New slash command: /setup-adminlogs to configure logging channel and per-command enable/disable
- Bot posts detailed moderation logs to configured channel showing: command used, target user, moderator, date/time, reason (required min 3 words), duration, end date
- Backend API endpoints for admin logs configuration and retrieval
- Frontend UI for admin logs configuration in Server Settings
- Database schema for storing moderation action logs
- Require reason field (minimum 3 words) for all moderation commands
- Admin logs are unique to each guild and stored in postgres database
- Frontend delete buttons for individual logs and delete all logs with confirm dialogs
- Live updates between bot and frontend using SSE events for real-time log synchronization
- Admin logs properly display the username who called the command and the user they called it on for both bot slash commands and frontend moderation actions
- Bot command username logging fixed: uses correct Discord user properties (username/global_name instead of deprecated tag)
Bot event handlers: added guildCreate and guildDelete events to publish SSE notifications for live dashboard updates
Invite synchronization: real-time sync between Discord server events and frontend
- Discord event handlers for inviteCreate and inviteDelete events
- Only bot-created invites are tracked and synchronized
- Frontend SSE event listeners for inviteCreated and inviteDeleted events
- Backend API updated to store existing invites from Discord events
- Invite deletions from Discord server are immediately reflected in frontend
- Offline reconciliation: bot detects and removes invites deleted while offline on startup
- Automatic cleanup of stale invites from database and frontend when bot comes back online

Database

Postgres support via DATABASE_URL (backend auto-creates servers, invites, users)
Legacy encrypted backend/db.json retained (migration planned)
Kick.com live notifications: backend API, frontend UI, bot integration
- Database schema: kickUsers table with userId, username, guildId
- API endpoints: GET/POST/DELETE /api/servers/:guildId/kick-users
- Bot commands: /add-kickuser, /remove-kickuser, /list-kickusers
- Frontend tabs: separate Twitch and Kick tabs in Live Notifications accordion
- Kick API integration: polling for live status, stream metadata, web scraping fallback for 403 errors
- Per-server configuration: all settings scoped by guildId
Schema: live notification settings stored in server settings (via liveNotifications JSON)
- Fields: enabled, channelId, users[], kickUsers[], message, customMessage (custom overrides default if non-empty)
- Users list preserved when updating other live notification settings (fixed: kickUsers now also preserved)
Admin Logs Database Schema: new table for storing moderation action logs
- Fields: id, guildId, action (kick/ban/timeout), targetUserId, targetUsername, moderatorUserId, moderatorUsername, reason, duration, endDate, timestamp

Security & Behavior

Invite DELETE requires short-lived HMAC token (x-invite-token)
Frontend confirmation dialog for invite deletion
Harden invite-token issuance (require OAuth + admin check)
- Template variables for messages (planned): support {user}, {title}, {category}, {viewers} replacement in message / customMessage
Moderation Command Requirements: require reason field (minimum 3 words) for all moderation commands (/kick, /ban, /timeout)
ServerSettings back button: fixed to navigate to dashboard instead of browser history to prevent accidental accordion opening

Docs & Deployment

README and CHANGELOG updated with setup steps and Postgres guidance
Core env vars: DATABASE_URL, DISCORD_CLIENT_ID, DISCORD_CLIENT_SECRET, DISCORD_BOT_TOKEN, INVITE_TOKEN_SECRET, ENCRYPTION_KEY, HOST, PORT, CORS_ORIGIN
Frontend: set REACT_APP_API_BASE to backend URL before build
Tailscale: bind backend to your tailnet IP (100.x.y.z) and set DATABASE_URL to a Postgres reachable over the tailnet

Notes:

backend/.env.example and frontend/.env.example are templates — copy to .env and fill values.
Postgres / pgAdmin: create DB & user, set DATABASE_URL; backend auto-creates tables on startup.

UI tweaks applied:

Server cards: uniform sizes, image cropping, name clamping
Mobile spacing and typography adjustments
Dashboard action buttons repositioned (Invite/Leave under title)
Live Notifications: collapsible accordion with tabbed interface for Twitch and Kick tabs (Kick tab disabled)
All accordions in ServerSettings: consistently grayed out (opacity 0.5) when bot is not in server
Dashboard live reloading: real-time updates when bot joins/leaves servers via SSE events
Responsive design: mobile-friendly layout with adaptive padding, typography, and component sizing
Ultra-wide screen support: max-width constraints and overflow prevention
Sticky footer: footer positioned at bottom of viewport regardless of content height
Navbar branding: title shows "ECS" on mobile, "EhChadServices" on desktop
Dashboard welcome text: updated to "Welcome back, {username}" with even larger typography (h3/h2 variants) and increased spacing; title also enlarged (h4/h3) for better proportion and explicit margin-bottom for clear line separation
Browser tab now shows ECS - <Page Name> (e.g., 'ECS - Dashboard')
Dashboard duplicate title fixed; user settings (avatar/themes) restored via NavBar
Maintenance page
Frontend displays a maintenance page with a loading indicator when the backend is offline; it polls the backend and reloads UI immediately when the backend is available.
- Global backend health & SSE
  - Added BackendContext to centralize health polling and a single shared EventSource
  - Pages (including ServerSettings) use the shared event bus for live updates so the whole site receives changes in real-time
  - Frontend file re-organization
  - Verify guild-scoped SSE payloads include guildId and frontend filters events by guild (in-progress)
  - Add debug SSE publish endpoint to help validate real-time flows (done, guarded by DEBUG_SSE)
    - Created frontend/src/lib/api.js and refactored some modules to use it
    - Created frontend/src/components/common and frontend/src/components/server
    - Moved ConfirmDialog and MaintenancePage to components/common
    - Moved ServerSettings and HelpPage to components/server
    - Fixed ESLint warnings: removed unused imports and handlers, added proper dependency management
    - Fixed compilation errors: added missing MUI imports and Snackbar component
Navbar visibility: enhanced with solid background and stronger border for better visibility across all themes

15 KiB Raw Blame History