- Remove useState<Issue> mirror anti-pattern — read directly from useIssueStore
- handleUpdateField now writes to global store (board/list sync instantly)
- handleDelete now calls removeIssue (deleted issue disappears from list)
- Extract useIssueTimeline hook (comment CRUD + WS events + reconnect)
- Extract useIssueReactions hook (issue reactions + WS events)
- Extract useIssueSubscribers hook (subscribers + WS events + rollback)
- Add useWSReconnect hook for per-component reconnect handling
- Add React.memo to BoardCardContent, DraggableBoardCard, ListRow
- Add key={id} to RichTextEditor to fix stale description on issue switch
- issue-detail.tsx: 1330 → 979 lines
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
33 lines
887 B
TypeScript
33 lines
887 B
TypeScript
"use client";
|
|
|
|
import { useEffect } from "react";
|
|
import type { WSEventType } from "@/shared/types";
|
|
import { useWS } from "./provider";
|
|
|
|
type EventHandler = (payload: unknown) => void;
|
|
|
|
/**
|
|
* Hook that subscribes to a WebSocket event and calls the handler.
|
|
* Automatically unsubscribes on cleanup.
|
|
*/
|
|
export function useWSEvent(event: WSEventType, handler: EventHandler) {
|
|
const { subscribe } = useWS();
|
|
|
|
useEffect(() => {
|
|
const unsub = subscribe(event, handler);
|
|
return unsub;
|
|
}, [event, handler, subscribe]);
|
|
}
|
|
|
|
/**
|
|
* Hook that registers a callback to run on WebSocket reconnection.
|
|
* Useful for refetching component-local data after a network interruption.
|
|
*/
|
|
export function useWSReconnect(callback: () => void) {
|
|
const { onReconnect } = useWS();
|
|
|
|
useEffect(() => {
|
|
const unsub = onReconnect(callback);
|
|
return unsub;
|
|
}, [callback, onReconnect]);
|
|
}
|