Refactor draft messaging to unified enum-based protocol

- Replaced scattered message strings with `DraftMessage` `StrEnum` and
  numeric `DraftPhase` `IntEnum` for clear, centralized definitions.
- Added Python→JS constants sync via `scripts/generate_js_constants.py`
  to ensure backend/frontend parity.
- Refactored WebSocket consumers to use `broadcast.*` and
  `direct.message` handlers with `_dispatch_broadcast` for consistent
  event delivery.
- Enhanced `DraftStateManager` to store `draft_index` and explicitly
  manage `connected_participants`.
- Added colored logging config in settings for improved debugging.
- Frontend: split UI into `ParticipantList` and `DraftMoviePool`,
  extracted message handlers (`handleDraftStatusMessages`,
  `handleUserIdentifyMessages`), and updated components to use new
  message/phase enums.

frontend/src/apps/draft/common/utils.js

@@ -1,3 +1,5 @@
+import { DraftMessage } from "../constants"
+
 export async function fetchDraftDetails(draftSessionId) {
       return fetch(`/api/draft/${draftSessionId}/`)
         .then((response) => {
@@ -26,4 +28,40 @@ export async function fetchMovieDetails(draftSessionId) {
         .catch((err) => {
           console.error("Error fetching draft details", err)
         })
-    }
+    }
+
+export function isEmptyObject(obj) {
+  return obj == null || (Object.keys(obj).length === 0 && obj.constructor === Object);
+}
+
+export const handleDraftStatusMessages = (event, setDraftState) => {
+      const message = JSON.parse(event.data)
+      const { type, payload } = message;
+      console.log("Message: ", type, event?.data)
+
+      if (!payload) return
+      const {connected_participants, phase, draft_order, draft_index} = payload
+
+      if (type == DraftMessage.STATUS_SYNC_INFORM) {
+        setDraftState(payload)
+      }
+
+      setDraftState(prev=>({
+        ...prev,
+        ...(connected_participants ? { connected_participants } : {}),
+        ...(draft_order ? { draft_order } : {}),
+        ...(draft_index ? { draft_index } : {}),
+        ...(phase ? { phase: Number(phase) } : {}),
+      }))
+
+    }
+
+export const handleUserIdentifyMessages = (event, setUser) => {
+  const message = JSON.parse(event.data)
+      const { type, payload } = message;
+      console.log("Message: ", type, event?.data)
+
+      if (!payload) return
+      const {current_user} = payload
+      setUser(current_user)
+}