- Implemented WebSocket connection management in `connection.rs` with automatic reconnection and event handling.
- Created `handlers.rs` to define WebSocket event and status enums.
- Added global CSS reset styles in `reset.css`.
- Introduced design tokens in `tokens.css` for consistent theming.
- Developed UI component styles in `ui.css`, including buttons, cards, badges, and modals.
- Added utility classes in `utilities.css` for layout, spacing, and typography.
- Introduced a new `logger` module for structured logging with levels, timestamps, and styled console output.
- Replaced ad-hoc console logging with structured logger in various modules including API client, WebSocket, auth, and feature components.
- Enhanced logging in `app.rs`, `auth.rs`, `dashboard`, `messages`, `live`, and `polish` features.
- Updated UI components to include logging for user interactions and state changes.
- Rewrote `app.css` for a premium design overhaul, introducing glassmorphism, gradients, and improved responsiveness.
- Added a new `plan.md` file outlining the scope and changes made in this commit.
- Changed the empty state message in ImageGrid to use a dedicated class for styling.
- Adjusted padding and border-radius for the "Guild Watcher" label in the header for better aesthetics.
- Introduced a new class for the status indicator dot and linked its visibility to the connection state.
- Updated ChannelRef struct to include optional fields for thread_id and thread_name with appropriate serialization settings.
body is outside the [data-theme] scope, so var(--text-primary)
on body always resolved to the dark :root value (#e8edf5, near-white).
Elements inside [data-theme] inherited this white color in light mode,
causing white-on-white text. Fix by moving background/color to
.app-shell which is inside the theme scope.
The Discord embed metadata sometimes returns thumbnail/image fields as
plain URL strings (e.g., "thumbnail":"https://...") instead of the
expected object format ({"url":"...","width":...,"height":...}).
Since serde deserializes the entire PageResult<MessageRecord> in one call,
even one message with a string-format embed field caused the entire response
to fail, making the message section appear empty despite the API returning
valid data.
Added a custom deserializer deser_embed_media that accepts null, a string
(interpreted as URL), or an object (standard struct deserialization).
Applied to both image and thumbnail fields in EmbedInfo with #[serde(default)]
so missing fields don't error. Includes 5 unit tests covering all formats.
Backend returns metadata, ai_moderation_flags, and ai_categories as raw
JSON strings (PostgreSQL JSONB cast to string). Frontend expected parsed
structs/arrays, causing serde to fail silently — entire PageResult parse
failed and user saw empty message list with no error indicator.
Add custom deserialize_with handler (from_json_string_or_value) that
transparently handles null / direct value / JSON-string cases for the
three affected fields.
- Wiring WS events di LivePanel:
- on_voice_active_user -> update ActiveSpeakers signal
- on_media_state -> update NowPlaying signal
- on_voice_recording_uploaded -> trigger RecordingsSubPanel refresh
- on_binary -> process PCM data dan auto-start audio playback
- AudioPlaybackState: tambah Clone derive + abort AtomicBool
untuk mencegah loop leak saat teardown
- MusicSubPanel: hapus loading state yang premature reset
(race condition: loading false sebelum async selesai)
- NowPlaying: ganti prop state jadi RwSignal agar reaktif ke WS
- RecordingsSubPanel: tambah refresh_trigger signal untuk reload
dari WS event
- MascotChatbot: fetch chat history dari backend saat panel dibuka
- get_review_messages: hapus guildId param (backend ignore)
- Dashboard: ganti Effect::new dengan spawn_local untuk initial fetch agar
tidak terjadi infinite loop karena reactive dependency tracking
- Config: tambah api/config.rs dan jadikan AppConfig.monitor_guild_id
RwSignal supaya di-fetch dari backend (saat startup & setelah login)
- Messages: perbaiki messageFetch agar guild_id terbaca dari config reaktif
- Infinite scroll: tambah observer_ready signal + spawn_local trigger
agar IntersectionObserver setup setelah DOM mount; tambah fallback button
- AudioVisualizer & MicLevelMeter: tambah periodic tick signal (100ms)
agar efek re-run dan update bars/level dari shared PCM buffer
- pcm_decoder: ganti js_sys::eval dengan wasm-bindgen binding langsung ke btoa
Previous code continuously forced activeTab to 'messages' when not
authenticated, making dashboard and voice tabs unclickable.
Now uses useEffect once on mount to reset localStorage carryover,
then lets tab switching work normally.
tailwind.config.js overrides spacing.xs to 4px, which also overrides
max-w-xs to max-width: 4px instead of the default 20rem (320px).
Changed to explicit max-w-[280px] to bypass the corrupted token.
When a user visited the Live tab in a previous session, localStorage
stored activeTab: 'live'. On page reload, even with the new auth guard,
the app would try to render the Live tab and show the auth overlay.
Now if not authenticated, activeTab is always forced to 'messages'.
Fixes MascotChatbot messages wrapping 1 character per line.
overflow-wrap:anywhere handles long unbroken strings better
than break-words which only breaks at word boundaries.
Cloudflare Rocket Loader transforms <script type="module"> into
type="<hash>-module", which the browser cannot parse as ES module.
The React app never mounts — blank page on every route.
Fix: Vite plugin adds data-cfasync="false" attribute to the module
script tag, telling Rocket Loader to skip transformation.
Also: remove dist/ from the commit (build artifacts excluded).
- Replace @apply im-btn in im-btn-primary/secondary/ghost
with inline Tailwind utilities + CSS properties
- Replace @apply im-status-dot in status dot variants
with inline properties
- Tailwind 4 cannot @apply component-level classes from within
@layer components — only standard utility classes are valid
- Video frame extraction via ffmpeg (4 key frames per video → vision LLM)
- Video display in FE MessageCard with HTML5 <video> player
- Reply/forward/crosspost indicator in FE + pipeline in DG/BE
- Fix: missing sanitizeAiContent + escapeXml in media path (prompt injection)
- Optimize: text-only batch results saved to DB immediately, no longer wait for media analysis
- BE mapper/schema/repo: add reference fields (is_reply, is_forward, etc.)
asepharyana