diff --git a/ui/src/components/NewIssueDialog.tsx b/ui/src/components/NewIssueDialog.tsx index b01457e9..94382525 100644 --- a/ui/src/components/NewIssueDialog.tsx +++ b/ui/src/components/NewIssueDialog.tsx @@ -288,6 +288,9 @@ export function NewIssueDialog() { const [assigneeValue, setAssigneeValue] = useState(""); const [reviewerValue, setReviewerValue] = useState(""); const [approverValue, setApproverValue] = useState(""); + const [showReviewerRow, setShowReviewerRow] = useState(false); + const [showApproverRow, setShowApproverRow] = useState(false); + const [participantMenuOpen, setParticipantMenuOpen] = useState(false); const [projectId, setProjectId] = useState(""); const [projectWorkspaceId, setProjectWorkspaceId] = useState(""); const [assigneeOptionsOpen, setAssigneeOptionsOpen] = useState(false); @@ -560,6 +563,8 @@ export function NewIssueDialog() { setAssigneeValue(assigneeValueFromSelection(newIssueDefaults)); setReviewerValue(""); setApproverValue(""); + setShowReviewerRow(false); + setShowApproverRow(false); setAssigneeModelOverride(""); setAssigneeThinkingEffort(""); setAssigneeChrome(false); @@ -580,6 +585,8 @@ export function NewIssueDialog() { ); setReviewerValue(draft.reviewerValue ?? ""); setApproverValue(draft.approverValue ?? ""); + setShowReviewerRow(!!(draft.reviewerValue)); + setShowApproverRow(!!(draft.approverValue)); setProjectId(restoredProjectId); setProjectWorkspaceId(draft.projectWorkspaceId ?? defaultProjectWorkspaceIdForProject(restoredProject)); setAssigneeModelOverride(draft.assigneeModelOverride ?? ""); @@ -601,6 +608,8 @@ export function NewIssueDialog() { setAssigneeValue(assigneeValueFromSelection(newIssueDefaults)); setReviewerValue(""); setApproverValue(""); + setShowReviewerRow(false); + setShowApproverRow(false); setAssigneeModelOverride(""); setAssigneeThinkingEffort(""); setAssigneeChrome(false); @@ -645,6 +654,8 @@ export function NewIssueDialog() { setAssigneeValue(""); setReviewerValue(""); setApproverValue(""); + setShowReviewerRow(false); + setShowApproverRow(false); setProjectId(""); setProjectWorkspaceId(""); setAssigneeOptionsOpen(false); @@ -668,6 +679,8 @@ export function NewIssueDialog() { setAssigneeValue(""); setReviewerValue(""); setApproverValue(""); + setShowReviewerRow(false); + setShowApproverRow(false); setProjectId(""); setProjectWorkspaceId(""); setAssigneeModelOverride(""); @@ -1179,8 +1192,139 @@ export function NewIssueDialog() { ); }} /> + + {/* Three-dot menu to add Reviewer / Approver rows */} + + + + + + + + + + + {/* Reviewer row */} + {showReviewerRow && ( +
+ + + option ? ( + <> + {(() => { + const reviewer = parseAssigneeValue(option.id).assigneeAgentId + ? (agents ?? []).find((a) => a.id === parseAssigneeValue(option.id).assigneeAgentId) + : null; + return reviewer ? : null; + })()} + {option.label} + + ) : ( + Reviewer + ) + } + renderOption={(option) => { + if (!option.id) return {option.label}; + const reviewer = parseAssigneeValue(option.id).assigneeAgentId + ? (agents ?? []).find((agent) => agent.id === parseAssigneeValue(option.id).assigneeAgentId) + : null; + return ( + <> + {reviewer ? : null} + {option.label} + + ); + }} + /> +
+ )} + + {/* Approver row */} + {showApproverRow && ( +
+ + + option ? ( + <> + {(() => { + const approver = parseAssigneeValue(option.id).assigneeAgentId + ? (agents ?? []).find((a) => a.id === parseAssigneeValue(option.id).assigneeAgentId) + : null; + return approver ? : null; + })()} + {option.label} + + ) : ( + Approver + ) + } + renderOption={(option) => { + if (!option.id) return {option.label}; + const approver = parseAssigneeValue(option.id).assigneeAgentId + ? (agents ?? []).find((agent) => agent.id === parseAssigneeValue(option.id).assigneeAgentId) + : null; + return ( + <> + {approver ? : null} + {option.label} + + ); + }} + /> +
+ )} {isSubIssueMode ? ( @@ -1467,11 +1611,11 @@ export function NewIssueDialog() { - {/* Labels chip (placeholder) */} - + */} - - option ? ( - <> - - {option.label} - - ) : ( - <> - - Reviewer - - ) - } - renderOption={(option) => { - if (!option.id) return {option.label}; - const reviewer = parseAssigneeValue(option.id).assigneeAgentId - ? (agents ?? []).find((agent) => agent.id === parseAssigneeValue(option.id).assigneeAgentId) - : null; - return ( - <> - {reviewer ? : null} - {option.label} - - ); - }} - /> - - - option ? ( - <> - - {option.label} - - ) : ( - <> - - Approver - - ) - } - renderOption={(option) => { - if (!option.id) return {option.label}; - const approver = parseAssigneeValue(option.id).assigneeAgentId - ? (agents ?? []).find((agent) => agent.id === parseAssigneeValue(option.id).assigneeAgentId) - : null; - return ( - <> - {approver ? : null} - {option.label} - - ); - }} - /> - {/* More (dates) */}