Add gear icon to Description label that opens pullRequestDescription setting (#8248)

* Initial plan

* Initial plan for adding gear icon to Description label

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

* Add gear icon to Description label that opens pull request description settings

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

* Fix keyboard accessibility - use event.type instead of 'in' operator

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

* Use button element instead of anchor and improve keyboard handling

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

* Add aria-label and refactor event handler for better code quality

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

* clean up

* tab

* Undo css

---------

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/createPRViewProvider.ts

@@ -535,6 +535,10 @@ export abstract class BaseCreatePullRequestViewProvider<T extends BasePullReques
 		return this._replyMessage(message, undefined);
 	}
 
+	private async openDescriptionSettings(): Promise<void> {
+		return vscode.commands.executeCommand('workbench.action.openSettings', 'githubPullRequests.pullRequestDescription');
+	}
+
 	protected override async _onDidReceiveMessage(message: IRequestMessage<any>) {
 		const result = await super._onDidReceiveMessage(message);
 		if (result !== this.MESSAGE_UNHANDLED) {
@@ -569,6 +573,9 @@ export abstract class BaseCreatePullRequestViewProvider<T extends BasePullReques
 			case 'pr.removeLabel':
 				return this.removeLabel(message);
 
+			case 'pr.openDescriptionSettings':
+				return this.openDescriptionSettings();
+
 			default:
 				return this.MESSAGE_UNHANDLED;
 		}

webviews/createPullRequestViewNew/app.tsx

@@ -13,7 +13,7 @@ import PullRequestContextNew from '../common/createContextNew';
 import { ErrorBoundary } from '../common/errorBoundary';
 import { LabelCreate } from '../common/label';
 import { ContextDropdown } from '../components/contextDropdown';
-import { accountIcon, feedbackIcon, gitCompareIcon, milestoneIcon, notebookTemplate, prMergeIcon, projectIcon, sparkleIcon, stopCircleIcon, tagIcon } from '../components/icon';
+import { accountIcon, feedbackIcon, gitCompareIcon, milestoneIcon, notebookTemplate, prMergeIcon, projectIcon, settingsIcon, sparkleIcon, stopCircleIcon, tagIcon } from '../components/icon';
 import { Avatar } from '../components/user';
 
 type CreateMethod = 'create-draft' | 'create' | 'create-automerge-squash' | 'create-automerge-rebase' | 'create-automerge-merge';
@@ -173,6 +173,10 @@ export function main() {
 					}
 				}
 
+				function openDescriptionSettings(_event: React.MouseEvent | React.KeyboardEvent): void {
+					ctx.postMessage({ command: 'pr.openDescriptionSettings' });
+				}
+
 				async function generateTitle(useCopilot?: boolean) {
 					setGeneratingTitle(true);
 					await ctx.generateTitle(!!useCopilot);
@@ -337,6 +341,7 @@ export function main() {
 						<label htmlFor='description' className='input-title'>Description</label>
 						{ctx.createParams.usingTemplate ?
 							<a title='Change template' className={`title-action icon-button${isBusy || !ctx.initialized ? ' disabled' : ''}`} onClick={() => changeTemplate()} tabIndex={0}>{notebookTemplate}</a> : null}
+						<a role='button' title='Open pull request description settings' aria-label='Open pull request description settings' className='icon-button' onClick={openDescriptionSettings} tabIndex={0}>{settingsIcon}</a>
 					</div>
 					<div className='group-description'>
 						<textarea