Revert `onSnippetAction` and copy buttons. Bump 0.6.0-10.
This commit is contained in:
Jeff King
Родитель
69cf30dc5f
Коммит
326032e1e5
|
|
@ -22,7 +22,6 @@ import {ExpandableTreeCell, ITreeColumn} from 'azure-devops-ui/TreeEx'
|
|||
import {ITreeItemEx, ITreeItem} from 'azure-devops-ui/Utilities/TreeItemProvider'
|
||||
import {Icon, IconSize} from 'azure-devops-ui/Icon'
|
||||
import { renderPathCell } from './RunCard.renderPathCell'
|
||||
import { SnippetActionContext } from './Viewer'
|
||||
|
||||
const colspan = 99 // No easy way to parameterize this, however extra does not hurt, so using an arbitrarily large value.
|
||||
|
||||
|
|
@ -113,12 +112,7 @@ export function renderCell<T extends ISimpleTableCell>(
|
|||
renderers={{ link: ({href, children}) => <a href={href} target="_blank">{children}</a> }} />
|
||||
</div> // Div to cancel out containers display flex row.
|
||||
: <Hi>{renderMessageWithEmbeddedLinks(result, formattedMessage)}</Hi> || ''}
|
||||
{tryOr(() => <SnippetActionContext.Consumer>
|
||||
{onSnippetAction => {
|
||||
// Optional chaining required here as the Context Consumer bypasses the tryOr
|
||||
return <Snippet ploc={result.locations?.[0]?.physicalLocation} action={() => onSnippetAction?.(result)} />
|
||||
}}
|
||||
</SnippetActionContext.Consumer>)}
|
||||
<Snippet ploc={result.locations?.[0]?.physicalLocation} />
|
||||
</>
|
||||
case 'Rule':
|
||||
return <>
|
||||
|
|
|
|||
|
|
@ -2,20 +2,13 @@
|
|||
// Licensed under the MIT License.
|
||||
|
||||
.swcSnippet {
|
||||
margin: 4px 0; // override user agent
|
||||
padding-right: 4px; // Override the 2px from _platformCommon.scss so the ClipboardButton looks right.
|
||||
font-size: 12px;
|
||||
overflow: hidden;
|
||||
position: relative; // For gradient
|
||||
display: flex; // For line number column.
|
||||
|
||||
&.swcSnippetInline {
|
||||
margin: 4px 0; // override user agent
|
||||
padding-right: 4px; // Override the 2px from _platformCommon.scss so the ClipboardButton looks right.
|
||||
overflow: hidden;
|
||||
position: relative; // For gradient
|
||||
}
|
||||
|
||||
&.swcSnippetFullScreen {
|
||||
background-color: transparent; // Override the _platformCommon.scss grey for <pre>.
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: SFMono-Regular, monospace;
|
||||
} // Override UA default 'monospace'.
|
||||
|
|
@ -35,14 +28,6 @@
|
|||
.swcRegion {
|
||||
background-color: rgba(255, 230, 0, 0.5);
|
||||
}
|
||||
|
||||
.swcHoverButton {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:hover > .swcHoverButton {
|
||||
display: unset;
|
||||
}
|
||||
}
|
||||
|
||||
code.lineNumber {
|
||||
|
|
@ -54,14 +39,7 @@ code.lineNumber {
|
|||
.swcSnippet .hljs {
|
||||
color: inherit;
|
||||
display: initial;
|
||||
overflow-x: initial;
|
||||
padding: initial;
|
||||
background: initial;
|
||||
}
|
||||
|
||||
.swcSnippet.swcSnippetInline .hljs {
|
||||
overflow-x: hidden; // For inline, if we overflow auto, then the hover buttons will get pushed off screen.
|
||||
}
|
||||
|
||||
.swcSnippet.swcSnippetFullScreen .hljs {
|
||||
overflow-x: auto; // For full screen, if we overflow hidden, then the parent panel won't scroll.
|
||||
}
|
||||
|
|
@ -17,18 +17,12 @@ import {Hi} from './Hi'
|
|||
import {PhysicalLocation} from 'sarif'
|
||||
import {tryOr} from './try'
|
||||
|
||||
import { Button } from 'azure-devops-ui/Button'
|
||||
import { ClipboardButton } from "azure-devops-ui/Clipboard"
|
||||
import { CustomDialog } from 'azure-devops-ui/Dialog'
|
||||
import { ContentSize } from 'azure-devops-ui/Callout'
|
||||
|
||||
@observer export class Snippet extends React.Component<{ ploc?: PhysicalLocation, style?: React.CSSProperties, action?: () => void }> {
|
||||
@observer export class Snippet extends React.Component<{ ploc?: PhysicalLocation, style?: React.CSSProperties }> {
|
||||
static contextType = FilterKeywordContext
|
||||
@observable showAll = false
|
||||
@observable fullScreen = false
|
||||
|
||||
render () {
|
||||
const {ploc, action} = this.props
|
||||
const {ploc} = this.props
|
||||
if (!ploc) return null
|
||||
if (!ploc.region) return null
|
||||
|
||||
|
|
@ -121,22 +115,9 @@ import { ContentSize } from 'azure-devops-ui/Callout'
|
|||
</code>
|
||||
</>
|
||||
|
||||
const HoverButton = (props: { iconName: string, text: string, onClick: () => void }) =>
|
||||
<div className="bolt-clipboard-button flex-self-start margin-left-4 swcHoverButton">{/* Borrowing the bolt-clipboard-button style. */}
|
||||
<Button
|
||||
ariaLabel={props.text}
|
||||
iconProps={{ iconName: props.iconName }}
|
||||
onClick={e => {
|
||||
e.stopPropagation() // Prevent showAll
|
||||
props.onClick()
|
||||
}}
|
||||
tooltipProps={{ text: props.text }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
// title={JSON.stringify(ploc, null, ' ')}
|
||||
return <>
|
||||
<pre className="swcSnippet swcSnippetInline"
|
||||
<pre className="swcSnippet"
|
||||
style={{ ...this.props.style, maxHeight: this.showAll ? undefined : 108 } as any} // 108px is a 6-line snippet which is very common.
|
||||
key={Date.now()} onClick={() => this.showAll = !this.showAll}
|
||||
ref={pre => {
|
||||
|
|
@ -146,27 +127,7 @@ import { ContentSize } from 'azure-devops-ui/Callout'
|
|||
else pre.classList.remove('clipped')
|
||||
}}>
|
||||
{lineNumbersAndCode}
|
||||
<ClipboardButton
|
||||
className="flex-self-start margin-left-4 swcHoverButton"
|
||||
getContent={() => ploc.region?.snippet?.text ?? ''}
|
||||
showCopiedTooltip={'Copied snippet!'}
|
||||
tooltipProps={{ text: 'Copy snippet' }}
|
||||
/>
|
||||
<HoverButton iconName="NavigateExternalInline" text="View this Secret Hash in a new Tab" onClick={() => action?.()} />
|
||||
<HoverButton iconName="FullScreen" text="Full screen" onClick={() => this.fullScreen = true} />
|
||||
</pre>
|
||||
{this.fullScreen && <CustomDialog onDismiss={() => this.fullScreen = false} modal={true} contentSize={ContentSize.ExtraLarge}>
|
||||
<div className="scroll-auto">
|
||||
<pre className="margin-horizontal-8 margin-vertical-16 swcSnippet swcSnippetFullScreen">
|
||||
{lineNumbersAndCode}
|
||||
<ClipboardButton
|
||||
className="flex-self-start margin-left-4 swcHoverButton"
|
||||
getContent={() => ploc.contextRegion?.snippet?.text ?? ploc.region?.snippet?.text ?? ''}
|
||||
showCopiedTooltip={true}
|
||||
/>
|
||||
</pre>
|
||||
</div>
|
||||
</CustomDialog>}
|
||||
</>
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,6 @@ import './extension'
|
|||
|
||||
// Contexts must come before renderCell or anything the uses this.
|
||||
export const FilterKeywordContext = React.createContext('')
|
||||
export const SnippetActionContext = React.createContext<(result: Result) => void>(undefined)
|
||||
|
||||
import { FilterBar, MobxFilter, recommendedDefaultState } from './FilterBar'
|
||||
import { RunCard } from './RunCard'
|
||||
|
|
@ -67,11 +66,6 @@ interface ViewerProps {
|
|||
* then the behavior is undefined. The current implementation will never communicate success.
|
||||
*/
|
||||
successMessage?: string
|
||||
|
||||
/**
|
||||
* The is a custom button on the top-right of every snippet. Clicking that will call this.
|
||||
*/
|
||||
onSnippetAction?: (result: Result) => void
|
||||
}
|
||||
|
||||
@observer export class Viewer extends Component<ViewerProps> {
|
||||
|
|
@ -108,7 +102,7 @@ interface ViewerProps {
|
|||
}
|
||||
|
||||
render() {
|
||||
const {hideBaseline, hideLevel, showSuppression, showAge, successMessage, onSnippetAction} = this.props
|
||||
const {hideBaseline, hideLevel, showSuppression, showAge, successMessage} = this.props
|
||||
|
||||
// Computed values fail to cache if called from onRenderNearElement() for unknown reasons. Thus call them in advance.
|
||||
const currentfilterState = this.filter.getState()
|
||||
|
|
@ -177,20 +171,18 @@ interface ViewerProps {
|
|||
})() as JSX.Element
|
||||
|
||||
return <FilterKeywordContext.Provider value={filterKeywords ?? ''}>
|
||||
<SnippetActionContext.Provider value={onSnippetAction}>
|
||||
<SurfaceContext.Provider value={{ background: SurfaceBackground.neutral }}>
|
||||
<Page>
|
||||
<div className="swcShim"></div>
|
||||
<FilterBar filter={this.filter} groupByAge={this.groupByAge.get()} hideBaseline={hideBaseline} hideLevel={hideLevel} showSuppression={showSuppression} showAge={showAge} />
|
||||
{this.warnOldVersion && <MessageCard
|
||||
severity={MessageCardSeverity.Warning}
|
||||
onDismiss={() => this.warnOldVersion = false}>
|
||||
Pre-SARIF-2.1 logs have been omitted. Use the Artifacts explorer to access all files.
|
||||
</MessageCard>}
|
||||
{nearElement}
|
||||
</Page>
|
||||
</SurfaceContext.Provider>
|
||||
</SnippetActionContext.Provider>
|
||||
<SurfaceContext.Provider value={{ background: SurfaceBackground.neutral }}>
|
||||
<Page>
|
||||
<div className="swcShim"></div>
|
||||
<FilterBar filter={this.filter} groupByAge={this.groupByAge.get()} hideBaseline={hideBaseline} hideLevel={hideLevel} showSuppression={showSuppression} showAge={showAge} />
|
||||
{this.warnOldVersion && <MessageCard
|
||||
severity={MessageCardSeverity.Warning}
|
||||
onDismiss={() => this.warnOldVersion = false}>
|
||||
Pre-SARIF-2.1 logs have been omitted. Use the Artifacts explorer to access all files.
|
||||
</MessageCard>}
|
||||
{nearElement}
|
||||
</Page>
|
||||
</SurfaceContext.Provider>
|
||||
</FilterKeywordContext.Provider>
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@microsoft/sarif-web-component",
|
||||
"version": "0.6.0-9",
|
||||
"version": "0.6.0-10",
|
||||
"author": "Microsoft",
|
||||
"description": "Sarif Viewer",
|
||||
"license": "MIT",
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче