Make linked issues clickable links to open in browser

Adds the issue url to the GraphQL query and through the IssueReference
type, then wraps the issue label in an <a href> in the sidebar. VS Code's
webview intercepts the click and opens the URL via openExternal, matching
the behavior of AuthorLink in the same view.

Author: mohamedamara1

src/github/graphql.ts

@@ -773,7 +773,8 @@ export interface PullRequest extends Issue {
 			id: number,
 			title: string,
 			number: number,
-			state: 'CLOSED' | 'OPEN'
+			state: 'CLOSED' | 'OPEN',
+			url: string,
 		}[];
 	};
 }

src/github/interface.ts

@@ -228,6 +228,7 @@ export interface IssueReference {
 	number: number;
 	title: string;
 	state: GithubItemStateEnum;
+	url: string;
 }
 
 export interface PullRequest extends Issue {

src/github/queries.gql

@@ -230,6 +230,7 @@ fragment PullRequestFragment on PullRequest {
 			number
 			title
 			state
+			url
 		}
 	}
 	merged

src/github/utils.ts

@@ -1070,8 +1070,8 @@ function parseSuggestedReviewers(
 }
 
 function parseClosingIssuesReferences(
-	closingIssuesReferences: Array<{ id: number, number: number, title: string, state: string }> | undefined
-): Array<{ id: number, number: number, title: string, state: GithubItemStateEnum }> {
+	closingIssuesReferences: Array<{ id: number, number: number, title: string, state: string, url: string }> | undefined
+): Array<{ id: number, number: number, title: string, state: GithubItemStateEnum, url: string }> {
 	if (!closingIssuesReferences) {
 		return [];
 	}
@@ -1081,6 +1081,7 @@ function parseClosingIssuesReferences(
 		number: issue.number,
 		title: issue.title,
 		state: issue.state === 'OPEN' ? GithubItemStateEnum.Open : GithubItemStateEnum.Closed,
+		url: issue.url,
 	}));
 }
 

src/github/views.ts

@@ -32,6 +32,7 @@ export interface IssueReference {
 	number: number;
 	title: string;
 	state: GithubItemStateEnum;
+	url: string;
 }
 
 export interface DisplayLabel extends ILabel {

webviews/components/sidebar.tsx

@@ -598,7 +598,7 @@ function IssueItem({ issue }: { issue: IssueReference }) {
 	return (
 		<div className="avatar-with-author">
 			{issue.state === GithubItemStateEnum.Open ? issueIcon : issueClosedIcon}
-			<span>#{issue.number} {issue.title}</span>
+			<a href={issue.url} title={issue.url}>#{issue.number} {issue.title}</a>
 		</div>
 	);
 }