Add commish right-click context menus to MiniDraftGrid team headers

Adds onAdjustTimeBankOpen and onSetAutodraftOpen props to MiniDraftGrid
so the last-two-rounds display on the Participants tab shows the same
"Adjust Time Bank…" / "Set Autodraft…" context menu on right-click that
the full Draft Board already exposes. Also passes those callbacks from
the route's miniDraftGrid useMemo so they are wired up for commissioners.

https://claude.ai/code/session_017JCShLVs9xZ6FZmyrUFaE1
This commit is contained in:
Claude 2026-04-25 06:56:56 +00:00
parent 9e822b2073
commit 3cfd6ca654
No known key found for this signature in database
2 changed files with 37 additions and 3 deletions

View file

@ -50,6 +50,8 @@ export interface MiniDraftGridProps {
autodraftStatus?: Record<string, { isEnabled: boolean }>;
seasonStatus?: SeasonStatus;
draftPaused?: boolean;
onAdjustTimeBankOpen?: (teamId: string) => void;
onSetAutodraftOpen?: (teamId: string) => void;
onForceAutopick?: (pickNumber: number, teamId: string) => void;
onForceManualPickOpen?: (pickNumber: number, teamId: string) => void;
onReplacePick?: (pickNumber: number, teamId: string) => void;
@ -66,6 +68,8 @@ export const MiniDraftGrid = memo(function MiniDraftGrid({
autodraftStatus = {},
seasonStatus,
draftPaused,
onAdjustTimeBankOpen,
onSetAutodraftOpen,
onForceAutopick,
onForceManualPickOpen,
onReplacePick,
@ -151,8 +155,10 @@ export const MiniDraftGrid = memo(function MiniDraftGrid({
{draftSlots.map((slot) => {
const teamTime = teamTimers[slot.team.id];
const isAutodraft = autodraftStatus[slot.team.id]?.isEnabled ?? false;
return (
<div key={slot.id} className="flex-1 min-w-20 text-center">
const hasHeaderMenu = !!(onAdjustTimeBankOpen || onSetAutodraftOpen);
const headerInner = (
<div className="flex-1 min-w-20 text-center">
<div className="text-xs font-medium truncate px-1 flex items-center justify-center gap-0.5">
{isAutodraft && (
<span className="inline-flex items-center justify-center h-3.5 w-3.5 text-[9px] font-bold text-white bg-black shrink-0">A</span>
@ -164,6 +170,32 @@ export const MiniDraftGrid = memo(function MiniDraftGrid({
</div>
</div>
);
if (hasHeaderMenu) {
return (
<ContextMenu key={slot.id}>
<ContextMenuTrigger asChild>
<div className="cursor-context-menu">
{headerInner}
</div>
</ContextMenuTrigger>
<ContextMenuContent>
{onAdjustTimeBankOpen && (
<ContextMenuItem onClick={() => onAdjustTimeBankOpen(slot.team.id)}>
Adjust Time Bank...
</ContextMenuItem>
)}
{onSetAutodraftOpen && (
<ContextMenuItem onClick={() => onSetAutodraftOpen(slot.team.id)}>
Set Autodraft...
</ContextMenuItem>
)}
</ContextMenuContent>
</ContextMenu>
);
}
return <div key={slot.id}>{headerInner}</div>;
})}
</div>

View file

@ -955,11 +955,13 @@ export default function DraftRoom() {
autodraftStatus,
seasonStatus: season.status,
draftPaused: isPaused,
onAdjustTimeBankOpen: isCommissioner ? handleAdjustTimeBankOpen : undefined,
onSetAutodraftOpen: isCommissioner ? handleSetAutodraftOpen : undefined,
onForceAutopick: isCommissioner ? handleForceAutopick : undefined,
onForceManualPickOpen: isCommissioner ? handleForceManualPickOpen : undefined,
onReplacePick: isCommissioner ? handleReplacePickOpen : undefined,
onRollbackToPick: isCommissioner && !isDraftComplete ? handleRollbackToPick : undefined,
}), [draftSlots, draftGrid, currentPick, currentRound, ownerMap, teamTimers, autodraftStatus, season.status, isPaused, isCommissioner, handleForceAutopick, handleForceManualPickOpen, handleReplacePickOpen, handleRollbackToPick, isDraftComplete]);
}), [draftSlots, draftGrid, currentPick, currentRound, ownerMap, teamTimers, autodraftStatus, season.status, isPaused, isCommissioner, handleAdjustTimeBankOpen, handleSetAutodraftOpen, handleForceAutopick, handleForceManualPickOpen, handleReplacePickOpen, handleRollbackToPick, isDraftComplete]);
const availableParticipantsSectionProps = useMemo(() => ({
participants: filteredParticipants,