Split handling of highlighted code lines into helper function

This commit is contained in:
shati-patel
2022-04-13 15:03:11 +01:00
committed by Shati Patel
parent 8ec19777b5
commit 8ff45d2aee
2 changed files with 68 additions and 34 deletions

View File

@@ -1,4 +1,5 @@
import * as Sarif from 'sarif';
import { HighlightedRegion } from '../remote-queries/shared/analysis-result';
import { ResolvableLocationValue } from './bqrs-cli-types';
export interface SarifLink {
@@ -173,3 +174,65 @@ export function parseSarifRegion(
export function isNoLocation(loc: ParsedSarifLocation): loc is NoLocation {
return 'hint' in loc;
}
// Some helpers for highlighting specific regions from a SARIF code snippet
/**
* Checks whether a particular line (determined by its line number in the original file)
* is part of the highlighted region of a SARIF code snippet.
*/
export function shouldHighlightLine(
lineNumber: number,
highlightedRegion: HighlightedRegion
): boolean {
if (lineNumber < highlightedRegion.startLine) {
return false;
}
if (highlightedRegion.endLine == undefined) {
return lineNumber == highlightedRegion.startLine;
}
return lineNumber <= highlightedRegion.endLine;
}
/**
* A line of code split into: plain text before the highlighted section, the highlighted
* text itself, and plain text after the highlighted section.
*/
interface partiallyHighlightedLine {
plainSection1: string;
highlightedSection: string;
plainSection2: string;
}
/**
* Splits a line of code into the highlighted and non-highlighted sections.
*/
export function parseHighlightedLine(
line: string,
lineNumber: number,
highlightedRegion: HighlightedRegion
): partiallyHighlightedLine {
const isSingleLineHighlight = highlightedRegion.endLine === undefined;
const isFirstHighlightedLine = lineNumber === highlightedRegion.startLine;
const isLastHighlightedLine = lineNumber === highlightedRegion.endLine;
const highlightStartColumn = isSingleLineHighlight
? highlightedRegion.startColumn
: isFirstHighlightedLine
? highlightedRegion.startColumn
: 0;
const highlightEndColumn = isSingleLineHighlight
? highlightedRegion.endColumn
: isLastHighlightedLine
? highlightedRegion.endColumn
: line.length + 1;
const plainSection1 = line.substring(0, highlightStartColumn - 1);
const highlightedSection = line.substring(highlightStartColumn - 1, highlightEndColumn - 1);
const plainSection2 = line.substring(highlightEndColumn - 1, line.length);
return { plainSection1, highlightedSection, plainSection2 };
}

View File

@@ -4,6 +4,7 @@ import { CodeSnippet, FileLink, HighlightedRegion, AnalysisMessage, ResultSeveri
import { Box, Link } from '@primer/react';
import VerticalSpace from './VerticalSpace';
import { createRemoteFileRef } from '../../pure/location-link-utils';
import { parseHighlightedLine, shouldHighlightLine } from '../../pure/sarif-utils';
const borderColor = 'var(--vscode-editor-snippetFinalTabstopHighlightBorder)';
const warningColor = '#966C23';
@@ -22,18 +23,6 @@ const getSeverityColor = (severity: ResultSeverity) => {
const replaceSpaceChar = (text: string) => text.replaceAll(' ', '\u00a0');
const shouldHighlightLine = (lineNumber: number, highlightedRegion: HighlightedRegion) => {
if (lineNumber < highlightedRegion.startLine) {
return false;
}
if (highlightedRegion.endLine == undefined) {
return lineNumber == highlightedRegion.startLine;
}
return lineNumber <= highlightedRegion.endLine;
};
const Container = styled.div`
font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
font-size: x-small;
@@ -142,31 +131,13 @@ const CodeLine = ({
return <PlainLine text={line} />;
}
const isSingleLineHighlight = highlightedRegion.endLine === undefined;
const isFirstHighlightedLine = lineNumber === highlightedRegion.startLine;
const isLastHighlightedLine = lineNumber === highlightedRegion.endLine;
const highlightStartColumn = isSingleLineHighlight
? highlightedRegion.startColumn
: isFirstHighlightedLine
? highlightedRegion.startColumn
: 0;
const highlightEndColumn = isSingleLineHighlight
? highlightedRegion.endColumn
: isLastHighlightedLine
? highlightedRegion.endColumn
: line.length + 1;
const section1 = line.substring(0, highlightStartColumn - 1);
const section2 = line.substring(highlightStartColumn - 1, highlightEndColumn - 1);
const section3 = line.substring(highlightEndColumn - 1, line.length);
const partiallyHighlightedLine = parseHighlightedLine(line, lineNumber, highlightedRegion);
return (
<>
<PlainLine text={section1} />
<HighlightedLine text={section2} />
<PlainLine text={section3} />
<PlainLine text={partiallyHighlightedLine.plainSection1} />
<HighlightedLine text={partiallyHighlightedLine.highlightedSection} />
<PlainLine text={partiallyHighlightedLine.plainSection2} />
</>
);
};