v2: global player, infinite scroll, image picker, threaded comments

src/contexts/WSProvider.tsx

@@ -7,14 +7,25 @@ import {
   useState,
 } from "react";
 import {
+  type CommentEvent,
   type PlaylistEvent,
   type VoteEvent,
   WSContext,
   type WSContextValue,
 } from "./WSContext.ts";
 import { WS_URL } from "../config/api.ts";
-import type { Dump, OnlineUser, RawDump, RawPlaylist } from "../model.ts";
-import { deserializeDump, deserializePlaylist } from "../model.ts";
+import type {
+  Dump,
+  OnlineUser,
+  RawComment,
+  RawDump,
+  RawPlaylist,
+} from "../model.ts";
+import {
+  deserializeComment,
+  deserializeDump,
+  deserializePlaylist,
+} from "../model.ts";
 
 interface WSProviderProps {
   children: ReactNode;
@@ -31,12 +42,16 @@ export function WSProvider({ children, token }: WSProviderProps) {
   const [recentDumps, setRecentDumps] = useState<Dump[]>([]);
   const [deletedDumpIds, setDeletedDumpIds] = useState<Set<string>>(new Set());
   const [lastVoteEvent, setLastVoteEvent] = useState<VoteEvent | null>(null);
+  const [lastDumpEvent, setLastDumpEvent] = useState<Dump | null>(null);
   const [lastPlaylistEvent, setLastPlaylistEvent] = useState<
     PlaylistEvent | null
   >(null);
   const [deletedPlaylistIds, setDeletedPlaylistIds] = useState<Set<string>>(
     new Set(),
   );
+  const [lastCommentEvent, setLastCommentEvent] = useState<CommentEvent | null>(
+    null,
+  );
 
   // Refs to avoid stale closures in event handlers
   const voteCountsRef = useRef(voteCounts);
@@ -112,6 +127,12 @@ export function WSProvider({ children, token }: WSProviderProps) {
             break;
           }
 
+          case "dump_updated": {
+            const dump = deserializeDump(msg.dump as RawDump);
+            setLastDumpEvent(dump);
+            break;
+          }
+
           case "dump_deleted": {
             const dumpId = msg.dumpId as string;
             setDeletedDumpIds((prev) => new Set([...prev, dumpId]));
@@ -177,6 +198,25 @@ export function WSProvider({ children, token }: WSProviderProps) {
             break;
           }
 
+          case "comment_created": {
+            const comment = deserializeComment(msg.comment as RawComment);
+            setLastCommentEvent({
+              type: "created",
+              dumpId: comment.dumpId,
+              comment,
+            });
+            break;
+          }
+
+          case "comment_deleted": {
+            const { commentId, dumpId } = msg as {
+              commentId: string;
+              dumpId: string;
+            };
+            setLastCommentEvent({ type: "deleted", dumpId, commentId });
+            break;
+          }
+
           case "error":
             // On error, revert any pending optimistic update for the affected dump
             // (the revert timeout will handle it)
@@ -276,8 +316,10 @@ export function WSProvider({ children, token }: WSProviderProps) {
     recentDumps,
     deletedDumpIds,
     lastVoteEvent,
+    lastDumpEvent,
     lastPlaylistEvent,
     deletedPlaylistIds,
+    lastCommentEvent,
     castVote,
     removeVote,
   };