Basic assigned and cross referenced events (#6810)

alexr00 · web-flow · commit dfd97fb5feb8 · 2025-04-23T08:30:27.000-07:00
Part of microsoft/vscode-internalbacklog#5449
diff --git a/resources/icons/link.svg b/resources/icons/link.svg
@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path d="M1.5 1H6v1H2v12h12v-4h1v4.5l-.5.5h-13l-.5-.5v-13l.5-.5z"/><path d="M15 1.5V8h-1V2.707L7.243 9.465l-.707-.708L13.293 2H8V1h6.5l.5.5z"/></svg>
diff --git a/src/common/timelineEvent.ts b/src/common/timelineEvent.ts
@@ -18,6 +18,7 @@ export enum EventType {
 	Assigned,
 	HeadRefDeleted,
 	Merged,
+	CrossReferenced,
 	Other,
 }
 
@@ -94,8 +95,9 @@ export interface MergedEvent {
 export interface AssignEvent {
 	id: number;
 	event: EventType.Assigned;
-	user: IAccount;
+	assignee: IAccount;
 	actor: IActor;
+	createdAt: string;
 }
 
 export interface HeadRefDeleteEvent {
@@ -106,4 +108,17 @@ export interface HeadRefDeleteEvent {
 	headRef: string;
 }
 
-export type TimelineEvent = CommitEvent | ReviewEvent | CommentEvent | NewCommitsSinceReviewEvent | MergedEvent | AssignEvent | HeadRefDeleteEvent;
+export interface CrossReferencedEvent {
+	id: string;
+	event: EventType.CrossReferenced
+	actor: IActor;
+	createdAt: string;
+	source: {
+		number: number;
+		url: string;
+		title: string;
+	};
+	willCloseTarget: boolean;
+}
+
+export type TimelineEvent = CommitEvent | ReviewEvent | CommentEvent | NewCommitsSinceReviewEvent | MergedEvent | AssignEvent | HeadRefDeleteEvent | CrossReferencedEvent;
diff --git a/src/github/graphql.ts b/src/github/graphql.ts
@@ -34,6 +34,19 @@ export interface HeadRefDeletedEvent {
 	headRefName: string;
 }
 
+export interface CrossReferencedEvent {
+	__typename: string;
+	id: string;
+	actor: Actor;
+	createdAt: string;
+	source: {
+		number: number;
+		url: string;
+		title: string;
+	};
+	willCloseTarget: boolean;
+}
+
 export interface AbbreviatedIssueComment {
 	author: Account;
 	body: string;
@@ -157,6 +170,7 @@ export interface AssignedEvent {
 	id: number;
 	actor: Actor;
 	user: Account;
+	createdAt: string;
 }
 
 export interface MergeQueueEntry {
diff --git a/src/github/queriesShared.gql b/src/github/queriesShared.gql
@@ -137,6 +137,29 @@ fragment AssignedEvent on AssignedEvent {
 		...Actor
 		...User
 	}
+	createdAt
+}
+
+fragment CrossReferencedEvent on CrossReferencedEvent {
+	id
+	actor {
+		...Node
+		...Actor
+	}
+	createdAt
+	source {
+		... on PullRequest {
+			number
+			url
+			title
+		}
+		... on Issue {
+			number
+			url
+			title
+		}
+	}
+	willCloseTarget
 }
 
 fragment Review on PullRequestReview {
@@ -233,6 +256,7 @@ query TimelineEvents($owner: String!, $name: String!, $number: Int!, $last: Int
 					...Commit
 					...AssignedEvent
 					...HeadRefDeleted
+					...CrossReferencedEvent
 				}
 			}
 		}
@@ -250,6 +274,7 @@ query IssueTimelineEvents($owner: String!, $name: String!, $number: Int!, $last:
 					__typename
 					...Comment
 					...AssignedEvent
+					...CrossReferencedEvent
 				}
 			}
 		}
diff --git a/src/github/utils.ts b/src/github/utils.ts
@@ -458,7 +458,8 @@ export function convertGraphQLEventType(text: string) {
 			return Common.EventType.Reviewed;
 		case 'MergedEvent':
 			return Common.EventType.Merged;
-
+		case 'CrossReferencedEvent':
+			return Common.EventType.CrossReferenced;
 		default:
 			return Common.EventType.Other;
 	}
@@ -964,6 +965,7 @@ export function parseGraphQLTimelineEvents(
 		| GraphQL.Commit
 		| GraphQL.AssignedEvent
 		| GraphQL.HeadRefDeletedEvent
+		| GraphQL.CrossReferencedEvent
 	)[],
 	githubRepository: GitHubRepository,
 ): Common.TimelineEvent[] {
@@ -1037,8 +1039,9 @@ export function parseGraphQLTimelineEvents(
 				normalizedEvents.push({
 					id: assignEv.id,
 					event: type,
-					user: parseAccount(assignEv.user, githubRepository),
-					actor: assignEv.actor,
+					assignee: parseAccount(assignEv.user, githubRepository),
+					actor: parseAccount(assignEv.actor),
+					createdAt: assignEv.createdAt,
 				});
 				return;
 			case Common.EventType.HeadRefDeleted:
@@ -1047,11 +1050,27 @@ export function parseGraphQLTimelineEvents(
 				normalizedEvents.push({
 					id: deletedEv.id,
 					event: type,
-					actor: parseActor(deletedEv.actor, githubRepository),
+					actor: parseAccount(deletedEv.actor, githubRepository),
 					createdAt: deletedEv.createdAt,
 					headRef: deletedEv.headRefName,
 				});
 				return;
+			case Common.EventType.CrossReferenced:
+				const crossRefEv = event as GraphQL.CrossReferencedEvent;
+
+				normalizedEvents.push({
+					id: crossRefEv.id,
+					event: type,
+					actor: parseAccount(crossRefEv.actor, githubRepository),
+					createdAt: crossRefEv.createdAt,
+					source: {
+						url: crossRefEv.source.url,
+						number: crossRefEv.source.number,
+						title: crossRefEv.source.title
+					},
+					willCloseTarget: crossRefEv.willCloseTarget
+				});
+				return;
 			default:
 				break;
 		}
diff --git a/webviews/components/icon.tsx b/webviews/components/icon.tsx
@@ -45,3 +45,4 @@ export const sparkleIcon = <Icon src={require('../../resources/icons/sparkle.svg
 export const stopCircleIcon = <Icon src={require('../../resources/icons/stop-circle.svg')} />;
 export const issueIcon = <Icon src={require('../../resources/icons/issue.svg')} />;
 export const issueClosedIcon = <Icon src={require('../../resources/icons/issue_closed.svg')} />;
+export const linkIcon = <Icon src={require('../../resources/icons/link.svg')} />;
diff --git a/webviews/components/timeline.tsx b/webviews/components/timeline.tsx
@@ -9,6 +9,7 @@ import {
 	AssignEvent,
 	CommentEvent,
 	CommitEvent,
+	CrossReferencedEvent,
 	EventType,
 	HeadRefDeleteEvent,
 	MergedEvent,
@@ -20,7 +21,7 @@ import { ReviewType } from '../../src/github/views';
 import PullRequestContext from '../common/context';
 import { CommentView } from './comment';
 import Diff from './diff';
-import { commitIcon, mergeIcon, plusIcon } from './icon';
+import { assigneeIcon, commitIcon, linkIcon, mergeIcon, plusIcon } from './icon';
 import { nbsp } from './space';
 import { Timestamp } from './timestamp';
 import { AuthorLink, Avatar } from './user';
@@ -41,6 +42,8 @@ export const Timeline = ({ events }: { events: TimelineEvent[] }) => (
 					return <AssignEventView key={`assign${event.id}`} {...event} />;
 				case EventType.HeadRefDeleted:
 					return <HeadDeleteEventView key={`head${event.id}`} {...event} />;
+				case EventType.CrossReferenced:
+					return <CrossReferencedEventView key={`cross${event.id}`} {...event} />;
 				case EventType.NewCommitsSinceReview:
 					return <NewCommitsSinceReviewEventView key={`newCommits${event.id}`} />;
 				default:
@@ -282,6 +285,44 @@ const HeadDeleteEventView = (event: HeadRefDeleteEvent) => (
 	</div>
 );
 
-// TODO: We should show these, but the pre-React overview page didn't. Add
-// support in a separate PR.
-const AssignEventView = (event: AssignEvent) => null;
+const CrossReferencedEventView = (event: CrossReferencedEvent) => {
+	const { source } = event;
+	return (
+		<div className="comment-container commit">
+			<div className="commit-message">
+				{linkIcon}
+				{nbsp}
+				<div className="avatar-container">
+					<Avatar for={event.actor} />
+				</div>
+				<AuthorLink for={event.actor} />
+				<div className="message">
+					linked <a href={source.url}>#{source.number}</a> {source.title}
+					{nbsp}
+					{event.willCloseTarget ? 'which will close this issue' : ''}
+				</div>
+			</div>
+			<Timestamp date={event.createdAt} />
+		</div>
+	);
+};
+
+const AssignEventView = (event: AssignEvent) => {
+	const { actor, assignee } = event;
+	return (
+		<div className="comment-container commit">
+			<div className="commit-message">
+				{assigneeIcon}
+				{nbsp}
+				<div className="avatar-container">
+					<Avatar for={actor} />
+				</div>
+				<AuthorLink for={actor} />
+				<div className="message">
+					assigned <AuthorLink for={assignee} /> to this pull request
+				</div>
+			</div>
+			<Timestamp date={event.createdAt} />
+		</div>
+	);
+};

Original file line number	Diff line number	Diff line change
`@@ -137,6 +137,29 @@ fragment AssignedEvent on AssignedEvent {`
`137`	`137`	`...Actor`
`138`	`138`	`...User`
`139`	`139`	`}`
	`140`	`+ createdAt`
	`141`	`+}`
	`142`	`+`
	`143`	`+fragment CrossReferencedEvent on CrossReferencedEvent {`
	`144`	`+ id`
	`145`	`+ actor {`
	`146`	`+ ...Node`
	`147`	`+ ...Actor`
	`148`	`+ }`
	`149`	`+ createdAt`
	`150`	`+ source {`
	`151`	`+ ... on PullRequest {`
	`152`	`+ number`
	`153`	`+ url`
	`154`	`+ title`
	`155`	`+ }`
	`156`	`+ ... on Issue {`
	`157`	`+ number`
	`158`	`+ url`
	`159`	`+ title`
	`160`	`+ }`
	`161`	`+ }`
	`162`	`+ willCloseTarget`
`140`	`163`	`}`
`141`	`164`
`142`	`165`	`fragment Review on PullRequestReview {`
`@@ -233,6 +256,7 @@ query TimelineEvents($owner: String!, $name: String!, $number: Int!, $last: Int`
`233`	`256`	`...Commit`
`234`	`257`	`...AssignedEvent`
`235`	`258`	`...HeadRefDeleted`
	`259`	`+ ...CrossReferencedEvent`
`236`	`260`	`}`
`237`	`261`	`}`
`238`	`262`	`}`
`@@ -250,6 +274,7 @@ query IssueTimelineEvents($owner: String!, $name: String!, $number: Int!, $last:`
`250`	`274`	`__typename`
`251`	`275`	`...Comment`
`252`	`276`	`...AssignedEvent`
	`277`	`+ ...CrossReferencedEvent`
`253`	`278`	`}`
`254`	`279`	`}`
`255`	`280`	`}`