Add "Convert to draft" action in PR reviewers section (#8258)

* Initial plan

* Initial plan for adding "Convert to draft" feature

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

* Add convert to draft functionality - fix function replacement error

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

* Remove unrelated change from chatParticipantAdditions.d.ts

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

* Clean up

* Change Convert to draft from button to link style

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

* Clean up

---------

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/github/graphql.ts

@@ -506,6 +506,16 @@ export interface MarkPullRequestReadyForReviewResponse {
 	};
 }
 
+export interface ConvertPullRequestToDraftResponse {
+	convertPullRequestToDraft: {
+		pullRequest: {
+			isDraft: boolean;
+			mergeable: 'MERGEABLE' | 'CONFLICTING' | 'UNKNOWN';
+			mergeStateStatus: 'BEHIND' | 'BLOCKED' | 'CLEAN' | 'DIRTY' | 'HAS_HOOKS' | 'UNKNOWN' | 'UNSTABLE';
+		};
+	};
+}
+
 export interface MergeQueueForBranchResponse {
 	repository: {
 		mergeQueue?: {

src/github/interface.ts

@@ -50,6 +50,11 @@ export interface ReadyForReview {
 	allowAutoMerge: boolean;
 }
 
+export interface ConvertToDraft {
+	isDraft: boolean;
+	mergeable: PullRequestMergeability;
+}
+
 export interface IActor {
 	login: string;
 	avatarUrl?: string;

src/github/pullRequestModel.ts

@@ -19,6 +19,7 @@ import {
 	AddReactionResponse,
 	AddReviewRequestResponse as AddReviewsResponse,
 	AddReviewThreadResponse,
+	ConvertPullRequestToDraftResponse,
 	DeleteReactionResponse,
 	DeleteReviewResponse,
 	DequeuePullRequestResponse,
@@ -45,6 +46,7 @@ import {
 } from './graphql';
 import {
 	AccountType,
+	ConvertToDraft,
 	GithubItemStateEnum,
 	IAccount,
 	IGitTreeItem,
@@ -1846,6 +1848,44 @@ export class PullRequestModel extends IssueModel<PullRequest> implements IPullRe
 		}
 	}
 
+	/**
+	 * Convert a pull request to draft.
+	 */
+	async convertToDraft(): Promise<ConvertToDraft> {
+		try {
+			const { mutate, schema } = await this.githubRepository.ensure();
+
+			const { data } = await mutate<ConvertPullRequestToDraftResponse>({
+				mutation: schema.ConvertToDraft,
+				variables: {
+					input: {
+						pullRequestId: this.graphNodeId,
+					},
+				},
+			});
+
+			/* __GDPR__
+				"pr.convertToDraft.success" : {}
+			*/
+			this._telemetry.sendTelemetryEvent('pr.convertToDraft.success');
+
+			const result: ConvertToDraft = {
+				isDraft: data!.convertPullRequestToDraft.pullRequest.isDraft,
+				mergeable: parseMergeability(data!.convertPullRequestToDraft.pullRequest.mergeable, data!.convertPullRequestToDraft.pullRequest.mergeStateStatus),
+			};
+			this.item.isDraft = result.isDraft;
+			this.item.mergeable = result.mergeable;
+			this._onDidChange.fire({ draft: true });
+			return result;
+		} catch (e) {
+			/* __GDPR__
+				"pr.convertToDraft.failure" : {}
+			*/
+			this._telemetry.sendTelemetryErrorEvent('pr.convertToDraft.failure');
+			throw e;
+		}
+	}
+
 	private updateCommentReactions(graphNodeId: string, reactionGroups: ReactionGroup[]) {
 		const reviewThread = this._reviewThreadsCache?.find(thread =>
 			thread.comments.some(c => c.graphNodeId === graphNodeId),

src/github/pullRequestOverview.ts

@@ -393,6 +393,8 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 				return this.setReadyForReview(message);
 			case 'pr.readyForReviewAndMerge':
 				return this.setReadyForReviewAndMerge(message);
+			case 'pr.convertToDraft':
+				return this.setConvertToDraft(message);
 			case 'pr.approve':
 				return this.approvePullRequestMessage(message);
 			case 'pr.request-changes':
@@ -683,6 +685,10 @@ export class PullRequestOverviewPanel extends IssueOverviewPanel<PullRequestMode
 		return PullRequestReviewCommon.setReadyForReviewAndMerge(this.getReviewContext(), message);
 	}
 
+	private async setConvertToDraft(message: IRequestMessage<{}>): Promise<void> {
+		return PullRequestReviewCommon.setConvertToDraft(this.getReviewContext(), message);
+	}
+
 	private async readyForReviewCommand(): Promise<void> {
 		return PullRequestReviewCommon.readyForReviewCommand(this.getReviewContext());
 	}

src/github/pullRequestReviewCommon.ts

@@ -9,7 +9,7 @@ import { FolderRepositoryManager } from './folderRepositoryManager';
 import { IAccount, isITeam, ITeam, MergeMethod, PullRequestMergeability, reviewerId, ReviewState } from './interface';
 import { BranchInfo } from './pullRequestGitHelper';
 import { PullRequestModel } from './pullRequestModel';
-import { PullRequest, ReadyForReviewReply, ReviewType, SubmitReviewReply } from './views';
+import { ConvertToDraftReply, PullRequest, ReadyForReviewReply, ReviewType, SubmitReviewReply } from './views';
 import { DEFAULT_DELETION_METHOD, PR_SETTINGS_NAMESPACE, SELECT_LOCAL_BRANCH, SELECT_REMOTE } from '../common/settingKeys';
 import { ReviewEvent, TimelineEvent } from '../common/timelineEvent';
 import { Schemes } from '../common/uri';
@@ -230,6 +230,16 @@ export namespace PullRequestReviewCommon {
 		}
 	}
 
+	export async function setConvertToDraft(ctx: ReviewContext, _message: IRequestMessage<{}>): Promise<void> {
+		try {
+			const result: ConvertToDraftReply = await ctx.item.convertToDraft();
+			ctx.replyMessage(_message, result);
+		} catch (e) {
+			vscode.window.showErrorMessage(vscode.l10n.t('Unable to convert pull request to draft. {0}', formatError(e)));
+			ctx.throwError(_message, '');
+		}
+	}
+
 	export async function readyForReviewCommand(ctx: ReviewContext): Promise<void> {
 		ctx.postMessage({
 			command: 'pr.readying-for-review'

src/github/queriesShared.gql

@@ -740,6 +740,16 @@ mutation ReadyForReview($input: MarkPullRequestReadyForReviewInput!) {
 	}
 }
 
+mutation ConvertToDraft($input: ConvertPullRequestToDraftInput!) {
+	convertPullRequestToDraft(input: $input) {
+		pullRequest {
+			isDraft
+			mergeable
+			mergeStateStatus
+		}
+	}
+}
+
 mutation StartReview($input: AddPullRequestReviewInput!) {
 	addPullRequestReview(input: $input) {
 		pullRequestReview {

src/github/views.ts

@@ -138,6 +138,10 @@ export interface ReadyForReviewReply {
 	autoMerge?: boolean;
 }
 
+export interface ConvertToDraftReply {
+	isDraft: boolean;
+}
+
 export interface MergeArguments {
 	title: string | undefined;
 	description: string | undefined;

webviews/common/context.tsx

@@ -11,7 +11,7 @@ import { CloseResult, OpenCommitChangesArgs } from '../../common/views';
 import { IComment } from '../../src/common/comment';
 import { EventType, ReviewEvent, SessionLinkInfo, TimelineEvent } from '../../src/common/timelineEvent';
 import { IProjectItem, MergeMethod, ReadyForReview } from '../../src/github/interface';
-import { CancelCodingAgentReply, ChangeAssigneesReply, DeleteReviewResult, MergeArguments, MergeResult, ProjectItemsReply, PullRequest, ReadyForReviewReply, SubmitReviewReply } from '../../src/github/views';
+import { CancelCodingAgentReply, ChangeAssigneesReply, ConvertToDraftReply, DeleteReviewResult, MergeArguments, MergeResult, ProjectItemsReply, PullRequest, ReadyForReviewReply, SubmitReviewReply } from '../../src/github/views';
 
 export class PRContext {
 	constructor(
@@ -92,6 +92,8 @@ export class PRContext {
 
 	public readyForReviewAndMerge = (args: { mergeMethod: MergeMethod }): Promise<ReadyForReview> => this.postMessage({ command: 'pr.readyForReviewAndMerge', args });
 
+	public convertToDraft = (): Promise<ConvertToDraftReply> => this.postMessage({ command: 'pr.convertToDraft' });
+
 	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' });

webviews/components/sidebar.tsx

@@ -131,6 +131,9 @@ export default function Sidebar({ reviewers, labels, hasWritePermission, isIssue
 					) : (
 						<div className="section-placeholder">None yet</div>
 					)}
+					{!pr!.isDraft && (hasWritePermission || pr!.isAuthor) && (
+						<ConvertToDraft />
+					)}
 				</Section>
 			)}
 
@@ -543,3 +546,34 @@ function Project(project: IProjectItem & { canDelete: boolean }) {
 		</div>
 	);
 }
+
+function ConvertToDraft() {
+	const { convertToDraft, updatePR, pr } = useContext(PullRequestContext);
+	const [isBusy, setBusy] = useState(false);
+
+	const handleConvertToDraft = async () => {
+		try {
+			setBusy(true);
+			const result = await convertToDraft();
+			updatePR({ isDraft: result.isDraft });
+		} finally {
+			setBusy(false);
+		}
+	};
+
+	return (
+		<div className="section-placeholder" style={{ marginTop: '8px' }}>
+			Still in progress?{' '}
+			<a
+				onClick={handleConvertToDraft}
+				style={{
+					pointerEvents: (isBusy || pr?.busy) ? 'none' : 'auto',
+					opacity: (isBusy || pr?.busy) ? 0.5 : 1,
+					cursor: 'pointer'
+				}}
+			>
+				Convert to draft
+			</a>
+		</div>
+	);
+}