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 }>; autodraftStatus?: Record<string, { isEnabled: boolean }>;
seasonStatus?: SeasonStatus; seasonStatus?: SeasonStatus;
draftPaused?: boolean; draftPaused?: boolean;
onAdjustTimeBankOpen?: (teamId: string) => void;
onSetAutodraftOpen?: (teamId: string) => void;
onForceAutopick?: (pickNumber: number, teamId: string) => void; onForceAutopick?: (pickNumber: number, teamId: string) => void;
onForceManualPickOpen?: (pickNumber: number, teamId: string) => void; onForceManualPickOpen?: (pickNumber: number, teamId: string) => void;
onReplacePick?: (pickNumber: number, teamId: string) => void; onReplacePick?: (pickNumber: number, teamId: string) => void;
@ -66,6 +68,8 @@ export const MiniDraftGrid = memo(function MiniDraftGrid({
autodraftStatus = {}, autodraftStatus = {},
seasonStatus, seasonStatus,
draftPaused, draftPaused,
onAdjustTimeBankOpen,
onSetAutodraftOpen,
onForceAutopick, onForceAutopick,
onForceManualPickOpen, onForceManualPickOpen,
onReplacePick, onReplacePick,
@ -151,8 +155,10 @@ export const MiniDraftGrid = memo(function MiniDraftGrid({
{draftSlots.map((slot) => { {draftSlots.map((slot) => {
const teamTime = teamTimers[slot.team.id]; const teamTime = teamTimers[slot.team.id];
const isAutodraft = autodraftStatus[slot.team.id]?.isEnabled ?? false; const isAutodraft = autodraftStatus[slot.team.id]?.isEnabled ?? false;
return ( const hasHeaderMenu = !!(onAdjustTimeBankOpen || onSetAutodraftOpen);
<div key={slot.id} className="flex-1 min-w-20 text-center">
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"> <div className="text-xs font-medium truncate px-1 flex items-center justify-center gap-0.5">
{isAutodraft && ( {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> <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>
</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> </div>

View file

@ -955,11 +955,13 @@ export default function DraftRoom() {
autodraftStatus, autodraftStatus,
seasonStatus: season.status, seasonStatus: season.status,
draftPaused: isPaused, draftPaused: isPaused,
onAdjustTimeBankOpen: isCommissioner ? handleAdjustTimeBankOpen : undefined,
onSetAutodraftOpen: isCommissioner ? handleSetAutodraftOpen : undefined,
onForceAutopick: isCommissioner ? handleForceAutopick : undefined, onForceAutopick: isCommissioner ? handleForceAutopick : undefined,
onForceManualPickOpen: isCommissioner ? handleForceManualPickOpen : undefined, onForceManualPickOpen: isCommissioner ? handleForceManualPickOpen : undefined,
onReplacePick: isCommissioner ? handleReplacePickOpen : undefined, onReplacePick: isCommissioner ? handleReplacePickOpen : undefined,
onRollbackToPick: isCommissioner && !isDraftComplete ? handleRollbackToPick : 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(() => ({ const availableParticipantsSectionProps = useMemo(() => ({
participants: filteredParticipants, participants: filteredParticipants,