Create remote file links to GitHub URL (#1209)

Co-authored-by: Charis Kyriakou <charisk@github.com>

Author: shati-patel

extensions/ql-vscode/src/pure/bqrs-utils.ts

@@ -4,6 +4,7 @@ import {
   LineColumnLocation,
   WholeFileLocation
 } from './bqrs-cli-types';
+import { createRemoteFileRef } from './location-link-utils';
 
 /**
  * The CodeQL filesystem libraries use this pattern in `getURL()` predicates
@@ -93,3 +94,30 @@ export function isWholeFileLoc(loc: UrlValue): loc is WholeFileLocation {
 export function isStringLoc(loc: UrlValue): loc is string {
   return typeof loc === 'string';
 }
+
+export function tryGetRemoteLocation(
+  loc: UrlValue | undefined,
+  fileLinkPrefix: string
+): string | undefined {
+  const resolvableLocation = tryGetResolvableLocation(loc);
+  if (!resolvableLocation) {
+    return undefined;
+  }
+
+  // Remote locations have the following format:
+  // file:/home/runner/work/<repo>/<repo/relative/path/to/file
+  // So we need to drop the first 6 parts of the path.
+
+  // TODO: We can make this more robust to other path formats.
+  const locationParts = resolvableLocation.uri.split('/');
+  const trimmedLocation = locationParts.slice(6, locationParts.length).join('/');
+
+  const fileLink = {
+    fileLinkPrefix,
+    filePath: trimmedLocation,
+  };
+  return createRemoteFileRef(
+    fileLink,
+    resolvableLocation.startLine,
+    resolvableLocation.endLine);
+}

extensions/ql-vscode/src/pure/location-link-utils.ts

@@ -0,0 +1,15 @@
+import { FileLink } from '../remote-queries/shared/analysis-result';
+
+export function createRemoteFileRef(
+  fileLink: FileLink,
+  startLine?: number,
+  endLine?: number
+): string {
+  if (startLine && endLine) {
+    return `${fileLink.fileLinkPrefix}/${fileLink.filePath}#L${startLine}-L${endLine}`;
+  } else if (startLine) {
+    return `${fileLink.fileLinkPrefix}/${fileLink.filePath}#L${startLine}`;
+  } else {
+    return `${fileLink.fileLinkPrefix}/${fileLink.filePath}`;
+  }
+}

extensions/ql-vscode/src/remote-queries/analyses-results-manager.ts

@@ -121,17 +121,19 @@ export class AnalysesResultsManager {
       throw new Error(`Could not download the analysis results for ${analysis.nwo}: ${e.message}`);
     }
 
+    const fileLinkPrefix = this.createGitHubDotcomFileLinkPrefix(analysis.nwo, analysis.databaseSha);
+
     let newAnaysisResults: AnalysisResults;
     const fileExtension = path.extname(artifactPath);
     if (fileExtension === '.sarif') {
-      const queryResults = await this.readSarifResults(artifactPath);
+      const queryResults = await this.readSarifResults(artifactPath, fileLinkPrefix);
       newAnaysisResults = {
         ...analysisResults,
         interpretedResults: queryResults,
         status: 'Completed'
       };
     } else if (fileExtension === '.bqrs') {
-      const queryResults = await this.readBqrsResults(artifactPath);
+      const queryResults = await this.readBqrsResults(artifactPath, fileLinkPrefix);
       newAnaysisResults = {
         ...analysisResults,
         rawResults: queryResults,
@@ -148,15 +150,15 @@ export class AnalysesResultsManager {
     void publishResults([...resultsForQuery]);
   }
 
-  private async readBqrsResults(filePath: string): Promise<AnalysisRawResults> {
-    return await extractRawResults(this.cliServer, this.logger, filePath);
+  private async readBqrsResults(filePath: string, fileLinkPrefix: string): Promise<AnalysisRawResults> {
+    return await extractRawResults(this.cliServer, this.logger, filePath, fileLinkPrefix);
   }
 
-  private async readSarifResults(filePath: string): Promise<AnalysisAlert[]> {
+  private async readSarifResults(filePath: string, fileLinkPrefix: string): Promise<AnalysisAlert[]> {
     const sarifLog = await sarifParser(filePath);
 
-    const processedSarif = extractAnalysisAlerts(sarifLog);
-    if (processedSarif.errors) {
+    const processedSarif = extractAnalysisAlerts(sarifLog, fileLinkPrefix);
+    if (processedSarif.errors.length) {
       void this.logger.log(`Error processing SARIF file: ${os.EOL}${processedSarif.errors.join(os.EOL)}`);
     }
 
@@ -166,4 +168,8 @@ export class AnalysesResultsManager {
   private isAnalysisInMemory(analysis: AnalysisSummary): boolean {
     return this.internalGetAnalysesResults(analysis.downloadLink.queryId).some(x => x.nwo === analysis.nwo);
   }
+
+  private createGitHubDotcomFileLinkPrefix(nwo: string, sha: string): string {
+    return `https://github.com/${nwo}/blob/${sha}`;
+  }
 }

extensions/ql-vscode/src/remote-queries/bqrs-processing.ts

@@ -7,7 +7,8 @@ import { MAX_RAW_RESULTS } from './shared/result-limits';
 export async function extractRawResults(
   cliServer: CodeQLCliServer,
   logger: Logger,
-  filePath: string
+  filePath: string,
+  fileLinkPrefix: string,
 ): Promise<AnalysisRawResults> {
   const bqrsInfo = await cliServer.bqrsInfo(filePath);
   const resultSets = bqrsInfo['result-sets'];
@@ -30,5 +31,5 @@ export async function extractRawResults(
 
   const capped = !!chunk.next;
 
-  return { schema, resultSet, capped };
+  return { schema, resultSet, fileLinkPrefix, capped };
 }

extensions/ql-vscode/src/remote-queries/remote-queries-interface.ts

@@ -319,7 +319,7 @@ export class RemoteQueriesInterfaceManager {
 
     return sortedAnalysisSummaries.map((analysisResult) => ({
       nwo: analysisResult.nwo,
-      databaseSha: analysisResult.databaseSha,
+      databaseSha: analysisResult.databaseSha || 'HEAD',
       resultCount: analysisResult.resultCount,
       downloadLink: analysisResult.downloadLink,
       fileSize: this.formatFileSize(analysisResult.fileSizeInBytes)

extensions/ql-vscode/src/remote-queries/sarif-processing.ts

@@ -15,7 +15,8 @@ import {
 const defaultSeverity = 'Warning';
 
 export function extractAnalysisAlerts(
-  sarifLog: sarif.Log
+  sarifLog: sarif.Log,
+  fileLinkPrefix: string
 ): {
   alerts: AnalysisAlert[],
   errors: string[]
@@ -26,7 +27,7 @@ export function extractAnalysisAlerts(
   for (const run of sarifLog.runs ?? []) {
     for (const result of run.results ?? []) {
       try {
-        alerts.push(...extractResultAlerts(run, result));
+        alerts.push(...extractResultAlerts(run, result, fileLinkPrefix));
       } catch (e) {
         errors.push(`Error when processing SARIF result: ${e}`);
         continue;
@@ -39,14 +40,15 @@ export function extractAnalysisAlerts(
 
 function extractResultAlerts(
   run: sarif.Run,
-  result: sarif.Result
+  result: sarif.Result,
+  fileLinkPrefix: string
 ): AnalysisAlert[] {
   const alerts: AnalysisAlert[] = [];
 
-  const message = getMessage(result);
+  const message = getMessage(result, fileLinkPrefix);
   const rule = tryGetRule(run, result);
   const severity = tryGetSeverity(run, result, rule) || defaultSeverity;
-  const codeFlows = getCodeFlows(result);
+  const codeFlows = getCodeFlows(result, fileLinkPrefix);
   const shortDescription = getShortDescription(rule, message!);
 
   for (const location of result.locations ?? []) {
@@ -60,7 +62,10 @@ function extractResultAlerts(
     const analysisAlert: AnalysisAlert = {
       message,
       shortDescription,
-      filePath,
+      fileLink: {
+        fileLinkPrefix,
+        filePath,
+      },
       severity,
       codeSnippet,
       highlightedRegion,
@@ -177,7 +182,8 @@ function getHighlightedRegion(region: sarif.Region): HighlightedRegion {
 }
 
 function getCodeFlows(
-  result: sarif.Result
+  result: sarif.Result,
+  fileLinkPrefix: string
 ): CodeFlow[] {
   const codeFlows = [];
 
@@ -195,7 +201,10 @@ function getCodeFlows(
             : undefined;
 
           threadFlows.push({
-            filePath,
+            fileLink: {
+              fileLinkPrefix,
+              filePath,
+            },
             codeSnippet,
             highlightedRegion
           } as ThreadFlow);
@@ -209,7 +218,7 @@ function getCodeFlows(
   return codeFlows;
 }
 
-function getMessage(result: sarif.Result): AnalysisMessage {
+function getMessage(result: sarif.Result, fileLinkPrefix: string): AnalysisMessage {
   const tokens: AnalysisMessageToken[] = [];
 
   const messageText = result.message!.text!;
@@ -224,7 +233,10 @@ function getMessage(result: sarif.Result): AnalysisMessage {
         t: 'location',
         text: messagePart.text,
         location: {
-          filePath: relatedLocation!.physicalLocation!.artifactLocation!.uri!,
+          fileLink: {
+            fileLinkPrefix: fileLinkPrefix,
+            filePath: relatedLocation!.physicalLocation!.artifactLocation!.uri!,
+          },
           highlightedRegion: getHighlightedRegion(relatedLocation!.physicalLocation!.region!),
         }
       });

extensions/ql-vscode/src/remote-queries/shared/analysis-result.ts

@@ -10,21 +10,27 @@ export interface AnalysisResults {
 }
 
 export interface AnalysisRawResults {
-  schema: ResultSetSchema,
-  resultSet: RawResultSet,
+  schema: ResultSetSchema;
+  resultSet: RawResultSet;
+  fileLinkPrefix: string;
   capped: boolean;
 }
 
 export interface AnalysisAlert {
   message: AnalysisMessage;
   shortDescription: string;
   severity: ResultSeverity;
-  filePath: string;
+  fileLink: FileLink;
   codeSnippet: CodeSnippet;
   highlightedRegion?: HighlightedRegion;
   codeFlows: CodeFlow[];
 }
 
+export interface FileLink {
+  fileLinkPrefix: string;
+  filePath: string;
+}
+
 export interface CodeSnippet {
   startLine: number;
   endLine: number;
@@ -43,7 +49,7 @@ export interface CodeFlow {
 }
 
 export interface ThreadFlow {
-  filePath: string;
+  fileLink: FileLink;
   codeSnippet: CodeSnippet;
   highlightedRegion?: HighlightedRegion;
   message?: AnalysisMessage;
@@ -66,7 +72,7 @@ export interface AnalysisMessageLocationToken {
   t: 'location';
   text: string;
   location: {
-    filePath: string;
+    fileLink: FileLink;
     highlightedRegion?: HighlightedRegion;
   };
 }

extensions/ql-vscode/src/remote-queries/view/AnalysisAlertResult.tsx

@@ -7,7 +7,7 @@ const AnalysisAlertResult = ({ alert }: { alert: AnalysisAlert }) => {
   const showPathsLink = alert.codeFlows.length > 0;
 
   return <FileCodeSnippet
-    filePath={alert.filePath}
+    fileLink={alert.fileLink}
     codeSnippet={alert.codeSnippet}
     highlightedRegion={alert.highlightedRegion}
     severity={alert.severity}

extensions/ql-vscode/src/remote-queries/view/CodePaths.tsx

@@ -71,7 +71,7 @@ const CodePath = ({
 
         <VerticalSpace size={2} />
         <FileCodeSnippet
-          filePath={threadFlow.filePath}
+          fileLink={threadFlow.fileLink}
           codeSnippet={threadFlow.codeSnippet}
           highlightedRegion={threadFlow.highlightedRegion}
           severity={severity}
@@ -82,7 +82,7 @@ const CodePath = ({
 };
 
 const getCodeFlowName = (codeFlow: CodeFlow) => {
-  const filePath = codeFlow.threadFlows[codeFlow.threadFlows.length - 1].filePath;
+  const filePath = codeFlow.threadFlows[codeFlow.threadFlows.length - 1].fileLink.filePath;
   return filePath.substring(filePath.lastIndexOf('/') + 1);
 };
 

extensions/ql-vscode/src/remote-queries/view/FileCodeSnippet.tsx

@@ -1,8 +1,9 @@
 import * as React from 'react';
 import styled from 'styled-components';
-import { CodeSnippet, HighlightedRegion, AnalysisMessage, ResultSeverity } from '../shared/analysis-result';
+import { CodeSnippet, FileLink, HighlightedRegion, AnalysisMessage, ResultSeverity } from '../shared/analysis-result';
 import { Box, Link } from '@primer/react';
 import VerticalSpace from './VerticalSpace';
+import { createRemoteFileRef } from '../../pure/location-link-utils';
 
 const borderColor = 'var(--vscode-editor-snippetFinalTabstopHighlightBorder)';
 const warningColor = '#966C23';
@@ -106,7 +107,14 @@ const Message = ({
             case 'text':
               return <span key={`token-${index}`}>{token.text}</span>;
             case 'location':
-              return <Link key={`token-${index}`} href='TODO'>{token.text}</Link>;
+              return <Link
+                key={`token-${index}`}
+                href={createRemoteFileRef(
+                  token.location.fileLink,
+                  token.location.highlightedRegion?.startLine,
+                  token.location.highlightedRegion?.endLine)}>
+                {token.text}
+              </Link>;
             default:
               return <></>;
           }
@@ -165,14 +173,14 @@ const CodeLine = ({
 };
 
 const FileCodeSnippet = ({
-  filePath,
+  fileLink,
   codeSnippet,
   highlightedRegion,
   severity,
   message,
   messageChildren,
 }: {
-  filePath: string,
+  fileLink: FileLink,
   codeSnippet: CodeSnippet,
   highlightedRegion?: HighlightedRegion,
   severity?: ResultSeverity,
@@ -183,11 +191,17 @@ const FileCodeSnippet = ({
   const code = codeSnippet.text.split('\n');
 
   const startingLine = codeSnippet.startLine;
+  const endingLine = codeSnippet.endLine;
+
+  const titleFileUri = createRemoteFileRef(
+    fileLink,
+    startingLine,
+    endingLine);
 
   return (
     <Container>
       <TitleContainer>
-        <Link>{filePath}</Link>
+        <Link href={titleFileUri}>{fileLink.filePath}</Link>
       </TitleContainer>
       <CodeContainer>
         {code.map((line, index) => (