Add "Request review from Copilot" button to Reviewers section (#8283)

* Initial plan

* Initial plan for Copilot review request feature

Co-authored-by: alexr00 <38270282+alexr00@users.noreply.github.com>

* Add "Request review from Copilot" feature

- Added addReviewerCopilot backend handler in pullRequestOverview.ts
- Added canRequestCopilotReview property to PullRequest interface
- Added Copilot review button in Reviewers section UI
- Button shows only when Copilot is available and not already a reviewer
- Follows same pattern as existing "Assign Copilot" feature

Co-authored-by: alexr00 <38270282+alexr00@users.noreply.github.com>

* Cache assignable users to avoid redundant API calls

- Store assignable users in _assignableUsers member variable
- Reuse cached data in addReviewerCopilot instead of fetching again
- Improves performance by avoiding duplicate getAssignableUsers() calls

Co-authored-by: alexr00 <38270282+alexr00@users.noreply.github.com>

* Fix up

* Add ChangeReviewersReply type for addReviewerCopilot reply

- Created ChangeReviewersReply interface in views.ts
- Updated addReviewerCopilot to use typed reply instead of inline object
- Fixed copilotUser reference instead of using removed COPILOT_REVIEWER_ACCOUNT
- Removed unused imports

Co-authored-by: alexr00 <38270282+alexr00@users.noreply.github.com>

* Use type in sidebar

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: alexr00 <38270282+alexr00@users.noreply.github.com>

Author: Copilot

src/common/copilot.ts

@@ -4,6 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import { EventType, TimelineEvent } from './timelineEvent';
+import { AccountType, IAccount } from '../github/interface';
 
 export const COPILOT_SWE_AGENT = 'copilot-swe-agent';
 export const COPILOT_CLOUD_AGENT = 'copilot-cloud-agent';
@@ -16,6 +17,15 @@ export const COPILOT_LOGINS = [
 	'Copilot'
 ];
 
+export const COPILOT_REVIEWER_ACCOUNT: IAccount = {
+	login: COPILOT_REVIEWER,
+	id: COPILOT_REVIEWER_ID,
+	url: '',
+	avatarUrl: '',
+	name: 'Copilot',
+	accountType: AccountType.Bot
+};
+
 export enum CopilotPRStatus {
 	None = 0,
 	Started = 1,

src/github/graphql.ts

@@ -130,6 +130,11 @@ export function isTeam(x: Actor | Team | Node | undefined | null): x is Team {
 	return !!asTeam && (asTeam?.slug !== undefined);
 }
 
+export function isBot(x: Actor | Team | Node | undefined | null): x is Actor {
+	const asBot = x as Partial<Actor>;
+	return !!asBot && !!asBot.id?.startsWith('BOT_');
+}
+
 export interface Team {
 	avatarUrl: string;
 	name: string;
@@ -347,6 +352,14 @@ export interface GetReviewRequestsResponse {
 	} | null;
 }
 
+export interface AddReviewRequestResponse {
+	requestReviews: {
+		pullRequest: {
+			id: string;
+		};
+	} | null;
+}
+
 export interface PullRequestState {
 	repository: {
 		pullRequest: {

src/github/issueOverview.ts

@@ -233,6 +233,7 @@ export class IssueOverviewPanel<TItem extends IssueModel = IssueModel> extends W
 			isEnterprise: issue.githubRepository.remote.isEnterprise,
 			isDarkTheme: vscode.window.activeColorTheme.kind === vscode.ColorThemeKind.Dark,
 			canAssignCopilot: assignableUsers.find(user => COPILOT_ACCOUNTS[user.login]) !== undefined,
+			canRequestCopilotReview: false,
 			reactions: issue.item.reactions,
 			isAuthor: issue.author.login === currentUser.login,
 		};

src/github/pullRequestModel.ts

@@ -17,6 +17,7 @@ import { GitHubRepository, GraphQLError, GraphQLErrorType } from './githubReposi
 import {
 	AddCommentResponse,
 	AddReactionResponse,
+	AddReviewRequestResponse as AddReviewsResponse,
 	AddReviewThreadResponse,
 	DeleteReactionResponse,
 	DeleteReviewResponse,
@@ -1247,21 +1248,26 @@ export class PullRequestModel extends IssueModel<PullRequest> implements IPullRe
 			input.botIds = reviewers.filter(r => r.accountType === AccountType.Bot).map(r => r.id);
 		}
 
-		const { data } = await mutate<GetReviewRequestsResponse>({
+		const { data } = await mutate<AddReviewsResponse>({
 			mutation: schema.AddReviewers,
 			variables: {
 				input
 			},
 		});
 
-		if (!data?.repository) {
+		if (!data?.requestReviews) {
 			Logger.error('Unexpected null repository while getting review requests', PullRequestModel.ID);
 			return;
 		}
 
-		const newReviewers: (IAccount | ITeam)[] = parseGraphQLReviewers(data, this.githubRepository);
-		if (this.reviewers?.length !== newReviewers.length || (this.reviewers.some(r => !newReviewers.some(rr => rr.id === r.id)))) {
-			this.reviewers = newReviewers;
+		const newReviewers: (IAccount | ITeam)[] = [...reviewers, ...teamReviewers].filter(r => !this.reviewers?.some(rr => rr.id === r.id));
+		if (this.reviewers?.length !== newReviewers.length) {
+			if (!this.reviewers) {
+				this.reviewers = newReviewers;
+			} else {
+				this.reviewers.push(...newReviewers);
+			}
+			this.reviewers = [...this.reviewers, ...newReviewers];
 			this._onDidChange.fire({ reviewers: true });
 		}
 	}

src/github/pullRequestOverview.ts

@@ -25,9 +25,9 @@ import { isCopilotOnMyBehalf, PullRequestModel } from './pullRequestModel';
 import { PullRequestReviewCommon, ReviewContext } from './pullRequestReviewCommon';
 import { pickEmail, reviewersQuickPick } from './quickPicks';
 import { parseReviewers } from './utils';
-import { CancelCodingAgentReply, DeleteReviewResult, MergeArguments, MergeResult, PullRequest, ReviewType } from './views';
-import { IComment } from '../common/comment';
-import { COPILOT_SWE_AGENT, copilotEventToStatus, CopilotPRStatus, mostRecentCopilotEvent } from '../common/copilot';
+import { CancelCodingAgentReply, ChangeReviewersReply, DeleteReviewResult, MergeArguments, MergeResult, PullRequest, ReviewType } from './views';
+import { COPILOT_ACCOUNTS, IComment } from '../common/comment';
+import { COPILOT_REVIEWER, COPILOT_REVIEWER_ACCOUNT, COPILOT_SWE_AGENT, copilotEventToStatus, CopilotPRStatus, mostRecentCopilotEvent } from '../common/copilot';
 import { commands, contexts } from '../common/executeCommands';
 import { disposeAll } from '../common/lifecycle';
 import Logger from '../common/logger';
@@ -54,6 +54,7 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 	private _repositoryDefaultBranch: string;
 	private _existingReviewers: ReviewState[] = [];
 	private _teamsCount = 0;
+	private _assignableUsers: { [key: string]: IAccount[] } = {};
 
 	private _prListeners: vscode.Disposable[] = [];
 	private _isUpdating: boolean = false;
@@ -257,7 +258,8 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 				mergeability,
 				emailForCommit,
 				coAuthors,
-				hasReviewDraft
+				hasReviewDraft,
+				assignableUsers
 			] = await Promise.all([
 				this._folderRepositoryManager.resolvePullRequest(
 					pullRequestModel.remote.owner,
@@ -279,6 +281,7 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 				this._folderRepositoryManager.getPreferredEmail(pullRequestModel),
 				pullRequestModel.getCoAuthors(),
 				pullRequestModel.validateDraftMode(),
+				this._folderRepositoryManager.getAssignableUsers()
 			]);
 			if (!pullRequest) {
 				throw new Error(
@@ -290,6 +293,7 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 			this.registerPrListeners();
 			this._repositoryDefaultBranch = defaultBranch!;
 			this._teamsCount = orgTeamsCount;
+			this._assignableUsers = assignableUsers;
 			this.setPanelTitle(`Pull Request #${pullRequestModel.number.toString()}`);
 
 			const isCurrentlyCheckedOut = pullRequestModel.equals(this._folderRepositoryManager.activePullRequest);
@@ -302,12 +306,16 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 			const reviewState = this.getCurrentUserReviewState(this._existingReviewers, currentUser);
 
 			Logger.debug('pr.initialize', PullRequestOverviewPanel.ID);
-			const baseContext = this.getInitializeContext(currentUser, pullRequest, timelineEvents, repositoryAccess, viewerCanEdit, []);
+			const users = this._assignableUsers[pullRequestModel.remote.remoteName] ?? [];
+			const copilotUser = users.find(user => COPILOT_ACCOUNTS[user.login]);
+			const isCopilotAlreadyReviewer = this._existingReviewers.some(reviewer => !isITeam(reviewer.reviewer) && reviewer.reviewer.login === COPILOT_REVIEWER);
+			const baseContext = this.getInitializeContext(currentUser, pullRequest, timelineEvents, repositoryAccess, viewerCanEdit, users);
 
 			this.preLoadInfoNotRequiredForOverview(pullRequest);
 
 			const context: Partial<PullRequest> = {
 				...baseContext,
+				canRequestCopilotReview: copilotUser !== undefined && !isCopilotAlreadyReviewer,
 				isCurrentlyCheckedOut: isCurrentlyCheckedOut,
 				isRemoteBaseDeleted: pullRequest.isRemoteBaseDeleted,
 				base: pullRequest.base.label,
@@ -415,6 +423,8 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 				return this.gotoChangesSinceReview(message);
 			case 'pr.re-request-review':
 				return this.reRequestReview(message);
+			case 'pr.add-reviewer-copilot':
+				return this.addReviewerCopilot(message);
 			case 'pr.revert':
 				return this.revert(message);
 			case 'pr.open-session-log':
@@ -750,6 +760,26 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 		return PullRequestReviewCommon.reRequestReview(this.getReviewContext(), message);
 	}
 
+	private async addReviewerCopilot(message: IRequestMessage<void>): Promise<void> {
+		try {
+			const copilotUser = this._assignableUsers[this._item.remote.remoteName]?.find(user => COPILOT_ACCOUNTS[user.login]);
+			if (copilotUser) {
+				await this._item.requestReview([COPILOT_REVIEWER_ACCOUNT], []);
+				const newReviewers = await this._item.getReviewRequests();
+				this._existingReviewers = parseReviewers(newReviewers!, await this._item.getTimelineEvents(), this._item.author);
+				const reply: ChangeReviewersReply = {
+					reviewers: this._existingReviewers
+				};
+				this._replyMessage(message, reply);
+			} else {
+				this._throwError(message, 'Copilot reviewer not found.');
+			}
+		} catch (e) {
+			vscode.window.showErrorMessage(formatError(e));
+			this._throwError(message, formatError(e));
+		}
+	}
+
 	private async revert(message: IRequestMessage<string>): Promise<void> {
 		await this._folderRepositoryManager.createPullRequestHelper.revert(this._telemetry, this._extensionUri, this._folderRepositoryManager, this._item, async (pullRequest) => {
 			const result: Partial<PullRequest> = { revertable: !pullRequest };

src/github/quickPicks.ts

@@ -8,11 +8,11 @@ import { Buffer } from 'buffer';
 import * as vscode from 'vscode';
 import { FolderRepositoryManager } from './folderRepositoryManager';
 import { GitHubRepository, TeamReviewerRefreshKind } from './githubRepository';
-import { AccountType, IAccount, ILabel, IMilestone, IProject, isISuggestedReviewer, isITeam, ISuggestedReviewer, ITeam, reviewerId, ReviewState } from './interface';
+import { IAccount, ILabel, IMilestone, IProject, isISuggestedReviewer, isITeam, ISuggestedReviewer, ITeam, reviewerId, ReviewState } from './interface';
 import { IssueModel } from './issueModel';
 import { DisplayLabel } from './views';
 import { COPILOT_ACCOUNTS } from '../common/comment';
-import { COPILOT_REVIEWER, COPILOT_REVIEWER_ID, COPILOT_SWE_AGENT } from '../common/copilot';
+import { COPILOT_REVIEWER, COPILOT_REVIEWER_ACCOUNT, COPILOT_SWE_AGENT } from '../common/copilot';
 import { emojify, ensureEmojis } from '../common/emoji';
 import Logger from '../common/logger';
 import { DataUri } from '../common/uri';
@@ -191,15 +191,7 @@ async function getReviewersQuickPickItems(folderRepositoryManager: FolderReposit
 
 	// If we removed the coding agent, add the Copilot reviewer instead
 	if (hasCopilotSweAgent && !existingReviewers.find(user => (user.reviewer as IAccount).login === COPILOT_REVIEWER)) {
-		const copilotReviewer: IAccount = {
-			login: COPILOT_REVIEWER,
-			id: COPILOT_REVIEWER_ID,
-			url: '',
-			avatarUrl: '',
-			name: COPILOT_ACCOUNTS[COPILOT_REVIEWER]?.name ?? 'Copilot',
-			accountType: AccountType.Bot
-		};
-		assignableUsers.push(copilotReviewer);
+		assignableUsers.push(COPILOT_REVIEWER_ACCOUNT);
 	}
 
 	// Suggested reviewers

src/github/utils.ts

@@ -696,7 +696,7 @@ export function parseGraphQLReviewers(data: GraphQL.GetReviewRequestsResponse, r
 		if (GraphQL.isTeam(reviewer.requestedReviewer)) {
 			const team: ITeam = parseTeam(reviewer.requestedReviewer, repository);
 			reviewers.push(team);
-		} else if (GraphQL.isAccount(reviewer.requestedReviewer)) {
+		} else if (GraphQL.isAccount(reviewer.requestedReviewer) || GraphQL.isBot(reviewer.requestedReviewer)) {
 			const account: IAccount = parseAccount(reviewer.requestedReviewer, repository);
 			reviewers.push(account);
 		}

src/github/views.ts

@@ -67,6 +67,7 @@ export interface Issue {
 	isDarkTheme: boolean;
 	isEnterprise: boolean;
 	canAssignCopilot: boolean;
+	canRequestCopilotReview: boolean;
 	reactions: Reaction[];
 	busy?: boolean;
 }
@@ -120,6 +121,10 @@ export interface ChangeAssigneesReply {
 	events: TimelineEvent[];
 }
 
+export interface ChangeReviewersReply {
+	reviewers: ReviewState[];
+}
+
 export interface SubmitReviewReply {
 	events?: TimelineEvent[];
 	reviewedEvent: ReviewEvent | CommentEvent;

webviews/common/context.tsx

@@ -93,6 +93,7 @@ export class PRContext {
 	public readyForReviewAndMerge = (args: { mergeMethod: MergeMethod }): Promise<ReadyForReview> => this.postMessage({ command: 'pr.readyForReviewAndMerge', args });
 
 	public addReviewers = () => this.postMessage({ command: 'pr.change-reviewers' });
+	public addReviewerCopilot = () => this.postMessage({ command: 'pr.add-reviewer-copilot' });
 	public changeProjects = (): Promise<ProjectItemsReply> => this.postMessage({ command: 'pr.change-projects' });
 	public removeProject = (project: IProjectItem) => this.postMessage({ command: 'pr.remove-project', args: project });
 	public addMilestone = () => this.postMessage({ command: 'pr.add-milestone' });

webviews/components/sidebar.tsx

@@ -8,8 +8,8 @@ import { closeIcon, copilotIcon, settingsIcon } from './icon';
 import { Reviewer } from './reviewer';
 import { COPILOT_LOGINS } from '../../src/common/copilot';
 import { gitHubLabelColor } from '../../src/common/utils';
-import { IAccount, IMilestone, IProjectItem, reviewerId, reviewerLabel, ReviewState } from '../../src/github/interface';
-import { PullRequest } from '../../src/github/views';
+import { IAccount, IMilestone, IProjectItem, isITeam, reviewerId, reviewerLabel, ReviewState } from '../../src/github/interface';
+import { ChangeReviewersReply, PullRequest } from '../../src/github/views';
 import PullRequestContext from '../common/context';
 import { Label } from '../common/label';
 import { AuthorLink, Avatar } from '../components/user';
@@ -53,9 +53,10 @@ function Section({
 	);
 }
 
-export default function Sidebar({ reviewers, labels, hasWritePermission, isIssue, projectItems: projects, milestone, assignees, canAssignCopilot }: PullRequest) {
+export default function Sidebar({ reviewers, labels, hasWritePermission, isIssue, projectItems: projects, milestone, assignees, canAssignCopilot, canRequestCopilotReview }: PullRequest) {
 	const {
 		addReviewers,
+		addReviewerCopilot,
 		addAssignees,
 		addAssigneeYourself,
 		addAssigneeCopilot,
@@ -68,8 +69,10 @@ export default function Sidebar({ reviewers, labels, hasWritePermission, isIssue
 	} = useContext(PullRequestContext);
 
 	const [assigningCopilot, setAssigningCopilot] = useState(false);
+	const [requestingCopilotReview, setRequestingCopilotReview] = useState(false);
 
 	const shouldShowCopilotButton = canAssignCopilot && assignees.every(assignee => !COPILOT_LOGINS.includes(assignee.login));
+	const shouldShowCopilotReviewButton = canRequestCopilotReview && reviewers.every(reviewer => !isITeam(reviewer.reviewer) && !COPILOT_LOGINS.includes(reviewer.reviewer.login));
 
 	const updateProjects = async () => {
 		const newProjects = await changeProjects();
@@ -83,10 +86,43 @@ export default function Sidebar({ reviewers, labels, hasWritePermission, isIssue
 					id="reviewers"
 					title="Reviewers"
 					hasWritePermission={hasWritePermission}
-					onHeaderClick={async () => {
+					onHeaderClick={async (e) => {
+						const target = e?.target as HTMLElement;
+						if (target?.closest && target.closest('#request-copilot-review-btn')) {
+							return;
+						}
 						const newReviewers = await addReviewers();
 						updatePR({ reviewers: newReviewers.reviewers });
 					}}
+					iconButtonGroup={hasWritePermission && (
+						<div className="icon-button-group">
+							{shouldShowCopilotReviewButton ? (
+								<button
+									id="request-copilot-review-btn"
+									className="icon-button"
+									title="Request review from Copilot"
+									disabled={requestingCopilotReview}
+									onClick={async (e) => {
+										e.stopPropagation();
+										setRequestingCopilotReview(true);
+										try {
+											const newReviewers: ChangeReviewersReply = await addReviewerCopilot();
+											updatePR({ reviewers: newReviewers.reviewers });
+										} finally {
+											setRequestingCopilotReview(false);
+										}
+									}}>
+									{copilotIcon}
+								</button>
+							) : null}
+							<button
+								className="icon-button"
+								title="Add Reviewers"
+							>
+								{settingsIcon}
+							</button>
+						</div>
+					)}
 				>
 					{reviewers && reviewers.length ? (
 						reviewers.map(state => (