Files
mtg-online-drafter/docs/development/devlog/2025-12-18-023000_lobby_ui_update.md

1.2 KiB

Work Plan - Lobby & Chat UI Overhaul and Notifications

Request

  1. Lobby/Chat Sidebar: Refactor to be collapsible on the right edge.
    • Add floating/modal panel for Lobby and Chat content.
    • Remove fixed right column layout.
  2. Notifications: Implement toast notifications for player events (Join, Leave, Disconnect).
    • Add setting to Enable/Disable notifications (persisted).
  3. Deck Builder: Update "Full Card" display trigger to new slider range (50% = 130px).

Changes

  • DeckBuilderView.tsx:

    • Updated useArtCrop logic: cardWidth < 130 (was 200).
  • GameRoom.tsx:

    • Refactored layout: Added activePanel state.
    • Created useEffect hook with prevPlayersRef to detect changes and trigger toasts.
    • Added "Notifications On/Off" toggle in Lobby panel.
    • Implemented floating side panel UI for desktop.
    • Updated mobile view (kept separate mobile tab logic but ensured layout stability).
  • Toast.tsx:

    • Added 'warning' type support for amber-colored alerts (Player Left).

Verification

  • Verified ref based diffing logic for notifications.
  • Verified persistence of notification settings in localStorage.
  • checked Toast type definition update.