Archived feedback + collapsing comments

[tudddorrr]

No description provided.

[claude]

Code Review: PR #483 - Archived feedback + collapsing comments

The overall implementation is solid — the SWR cache key correctly includes withDeleted, the optimistic update logic handles both the "filter out" and "update in place" cases correctly, and the Zod schema extension is clean.

Two issues worth addressing:

---

🔵 Minor: Missing loading state on archive toggle

The archive button has no guard against rapid double-clicks. Since onArchiveToggle is async, two quick clicks will fire two concurrent API calls before the UI updates:

// Both clicks capture the same `feedback.deletedAt` value before the first resolves
onClick={() => onArchiveToggle(feedback.id, feedback.deletedAt !== null)}

Fix — track which item is in-flight and disable accordingly:

const [togglingId, setTogglingId] = useState<number | null>(null)

const onArchiveToggle = useCallback(async (feedbackId: number, currentlyArchived: boolean) => {
  setTogglingId(feedbackId)
  try {
    // ... existing logic
  } finally {
    setTogglingId(null)
  }
}, [activeGame.id, mutate, toast, withDeleted])

// In render:
<Button
  variant={feedback.deletedAt !== null ? 'black' : 'grey'}
  disabled={togglingId === feedback.id}
  onClick={() => onArchiveToggle(feedback.id, feedback.deletedAt !== null)}
>

---

🔵 Minor: Archive button missing dev build row styling

The player navigation button and the CommentCell expand button both apply bg-orange-900 when in a dev build row. The new archive button does not follow this pattern, resulting in a grey/black button rendered on an orange background:

// Player button — applies dev build + archived overrides via className
className={clsx('ml-2 rounded-full bg-indigo-900 p-1', {
  'bg-orange-900': feedback.playerAlias.player.devBuild,
  'bg-gray-800!': feedback.deletedAt !== null && !feedback.devBuild,
})}

// Archive button — no equivalent styling
<Button variant={feedback.deletedAt !== null ? 'black' : 'grey'} ...>