Refactor draft app with improved state management and components

* Rename WebSocket message types for better organization
* Improve state handling with dedicated methods like broadcast_state
* Restructure frontend components and remove unused code

frontend/src/apps/draft/utils.js

@@ -0,0 +1,57 @@
+import { DraftMessage } from "./constants";
+
+export async function fetchDraftDetails(draftSessionId) {
+  return fetch(`/api/draft/${draftSessionId}/`)
+    .then((response) => {
+      if (response.ok) {
+        return response.json();
+      } else {
+        throw new Error();
+      }
+    })
+    .catch((err) => {
+      console.error("Error fetching draft details", err);
+    });
+}
+
+export async function fetchMovieDetails(draftSessionId) {
+  return fetch(`/api/draft/${draftSessionId}/movie/`)
+    .then((response) => {
+      if (response.ok) {
+        return response.json();
+      } else {
+        throw new Error();
+      }
+    })
+    .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;
+
+  if (!payload) return;
+
+  if (type == DraftMessage.DRAFT_STATUS_INFORM) {
+    setDraftState(payload);
+  }
+};
+
+export const handleUserIdentifyMessages = (event, setUser) => {
+  const message = JSON.parse(event.data);
+  const { type, payload } = message;
+
+  if (type == DraftMessage.USER_IDENTIFICATION_INFORM) {
+    console.log("Message: ", type, event.data);
+    const { user } = payload;
+    setUser(user);
+  }
+};