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:
parent
9e822b2073
commit
3cfd6ca654
2 changed files with 37 additions and 3 deletions
|
|
@ -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>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -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,
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue