From 1948544ed0d2441d4aae7f95411cea4430c3e51c Mon Sep 17 00:00:00 2001 From: 7PH Date: Mon, 15 May 2023 11:10:22 +0200 Subject: [PATCH] SONAR-19236 Implement sidebar hotspot list using the new design system --- .../main/js/app/components/GlobalMessage.tsx | 2 +- .../security-hotspots/SecurityHotspotsApp.tsx | 3 +- .../SecurityHotspotsAppRenderer.tsx | 47 ++----- .../security-hotspots/__tests__/utils-test.ts | 20 +-- .../components/HotspotCategory.tsx | 115 ++++++++-------- .../components/HotspotList.css | 127 ------------------ .../components/HotspotList.tsx | 107 ++++++++------- .../components/HotspotListItem.tsx | 63 +++++---- .../main/js/apps/security-hotspots/styles.css | 9 -- .../main/js/apps/security-hotspots/utils.ts | 8 +- .../js/helpers/mocks/security-hotspots.ts | 6 +- .../src/main/js/types/security-hotspots.ts | 11 +- 12 files changed, 189 insertions(+), 329 deletions(-) delete mode 100644 server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.css diff --git a/server/sonar-web/src/main/js/app/components/GlobalMessage.tsx b/server/sonar-web/src/main/js/app/components/GlobalMessage.tsx index af2208f3f2c..46e83ae2ddf 100644 --- a/server/sonar-web/src/main/js/app/components/GlobalMessage.tsx +++ b/server/sonar-web/src/main/js/app/components/GlobalMessage.tsx @@ -34,7 +34,7 @@ export default function GlobalMessage(props: GlobalMessageProps) { const { message } = props; return ( diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx index 9d6818d14c6..b39c2c0b297 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx @@ -43,7 +43,7 @@ import { Component, Dict } from '../../types/types'; import { CurrentUser, isLoggedIn } from '../../types/users'; import SecurityHotspotsAppRenderer from './SecurityHotspotsAppRenderer'; import './styles.css'; -import { getLocations, SECURITY_STANDARDS } from './utils'; +import { SECURITY_STANDARDS, getLocations } from './utils'; const PAGE_SIZE = 500; interface DispatchProps { @@ -526,7 +526,6 @@ export class SecurityHotspotsApp extends React.PureComponent { onLocationClick={this.handleLocationClick} securityCategories={standards[SecurityStandard.SONARSOURCE]} selectedHotspot={selectedHotspot} - selectedHotspotLocation={selectedHotspotLocationIndex} standards={standards} /> ); diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx index 3f084399815..6ef57e100d6 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx @@ -17,7 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { useTheme } from '@emotion/react'; +import { withTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { LargeCenteredLayout, @@ -94,21 +94,6 @@ export default function SecurityHotspotsAppRenderer(props: SecurityHotspotsAppRe standards, } = props; - const theme = useTheme(); - - React.useEffect(() => { - if (!selectedHotspot) { - return; - } - // Wait for next tick, in case newly selected hotspot is not yet expanded - setTimeout(() => { - document.querySelector(`[data-hotspot-key="${selectedHotspot.key}"]`)?.scrollIntoView({ - block: 'center', - behavior: 'smooth', - }); - }); - }, [selectedHotspot]); - return ( <> @@ -142,10 +127,7 @@ export default function SecurityHotspotsAppRenderer(props: SecurityHotspotsAppRe /> ) : ( <> - + {filterByCategory || filterByCWE || filterByFile ? ( ` -position: sticky; -box-sizing: border-box; -overflow-x: hidden; -overflow-y: auto; -background-color: ${themeColor('filterbar')(props)}; -border-right: ${themeBorder('default', 'filterbarBorder')(props)}; -// ToDo set proper hegiht -height: calc(100vh - ${'100px'}); - -&.border-left { - border-left: ${themeBorder('default', 'filterbarBorder')(props)}; -}` +const FilterbarStyled = withTheme( + styled.div` + position: sticky; + box-sizing: border-box; + overflow-x: hidden; + overflow-y: auto; + background-color: ${themeColor('filterbar')}; + border-right: ${themeBorder('default', 'filterbarBorder')}; + // ToDo set proper height + height: calc(100vh - ${'100px'}); + ` ); diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/__tests__/utils-test.ts b/server/sonar-web/src/main/js/apps/security-hotspots/__tests__/utils-test.ts index 1f0040b8bbb..73eeed4ec54 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/__tests__/utils-test.ts +++ b/server/sonar-web/src/main/js/apps/security-hotspots/__tests__/utils-test.ts @@ -17,6 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ +import { HotspotRatingEnum } from 'design-system'; import { mockHotspot, mockRawHotspot } from '../../../helpers/mocks/security-hotspots'; import { mockUser } from '../../../helpers/testMocks'; import { @@ -26,7 +27,6 @@ import { HotspotStatusOption, RawHotspot, ReviewHistoryType, - RiskExposure, } from '../../../types/security-hotspots'; import { FlowLocation, IssueChangelog } from '../../../types/types'; import { @@ -43,55 +43,55 @@ import { const hotspots = [ mockRawHotspot({ key: '3', - vulnerabilityProbability: RiskExposure.HIGH, + vulnerabilityProbability: HotspotRatingEnum.HIGH, securityCategory: 'object-injection', message: 'tfdh', }), mockRawHotspot({ key: '5', - vulnerabilityProbability: RiskExposure.MEDIUM, + vulnerabilityProbability: HotspotRatingEnum.MEDIUM, securityCategory: 'xpath-injection', message: 'asdf', }), mockRawHotspot({ key: '1', - vulnerabilityProbability: RiskExposure.HIGH, + vulnerabilityProbability: HotspotRatingEnum.HIGH, securityCategory: 'dos', message: 'a', }), mockRawHotspot({ key: '7', - vulnerabilityProbability: RiskExposure.LOW, + vulnerabilityProbability: HotspotRatingEnum.LOW, securityCategory: 'ssrf', message: 'rrrr', }), mockRawHotspot({ key: '2', - vulnerabilityProbability: RiskExposure.HIGH, + vulnerabilityProbability: HotspotRatingEnum.HIGH, securityCategory: 'dos', message: 'b', }), mockRawHotspot({ key: '8', - vulnerabilityProbability: RiskExposure.LOW, + vulnerabilityProbability: HotspotRatingEnum.LOW, securityCategory: 'ssrf', message: 'sssss', }), mockRawHotspot({ key: '4', - vulnerabilityProbability: RiskExposure.MEDIUM, + vulnerabilityProbability: HotspotRatingEnum.MEDIUM, securityCategory: 'log-injection', message: 'asdf', }), mockRawHotspot({ key: '9', - vulnerabilityProbability: RiskExposure.LOW, + vulnerabilityProbability: HotspotRatingEnum.LOW, securityCategory: 'xxe', message: 'aaa', }), mockRawHotspot({ key: '6', - vulnerabilityProbability: RiskExposure.LOW, + vulnerabilityProbability: HotspotRatingEnum.LOW, securityCategory: 'xss', message: 'zzz', }), diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx index 4a736d9e1bb..e34ad991cf0 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx @@ -17,32 +17,33 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import classNames from 'classnames'; -import * as React from 'react'; -import { ButtonPlain } from '../../../components/controls/buttons'; -import ChevronDownIcon from '../../../components/icons/ChevronDownIcon'; -import ChevronUpIcon from '../../../components/icons/ChevronUpIcon'; +import styled from '@emotion/styled'; +import { Badge, HotspotRating, HotspotRatingEnum, SubnavigationAccordion } from 'design-system'; +import React, { memo } from 'react'; import { RawHotspot } from '../../../types/security-hotspots'; import HotspotListItem from './HotspotListItem'; -export interface HotspotCategoryProps { - categoryKey: string; +interface HotspotCategoryProps { expanded: boolean; + onSetExpanded: (expanded: boolean) => void; hotspots: RawHotspot[]; + isLastAndIncomplete: boolean; onHotspotClick: (hotspot: RawHotspot) => void; - onToggleExpand?: (categoryKey: string, value: boolean) => void; onLocationClick: (index: number) => void; + rating: HotspotRatingEnum; selectedHotspot: RawHotspot; selectedHotspotLocation?: number; title: string; - isLastAndIncomplete: boolean; } export default function HotspotCategory(props: HotspotCategoryProps) { const { - categoryKey, expanded, + onSetExpanded, hotspots, + onLocationClick, + onHotspotClick, + rating, selectedHotspot, title, isLastAndIncomplete, @@ -56,49 +57,55 @@ export default function HotspotCategory(props: HotspotCategoryProps) { const risk = hotspots[0].vulnerabilityProbability; return ( -
- {props.onToggleExpand ? ( - props.onToggleExpand && props.onToggleExpand(categoryKey, !expanded)} - aria-expanded={expanded} - > - {title} - - - {hotspots.length} - {isLastAndIncomplete && '+'} - - {expanded ? ( - - ) : ( - - )} - - - ) : ( -
- {title} -
- )} - {expanded && ( -
    - {hotspots.map((h) => ( -
  • - -
    • - ))} -
- )} -
+ + } + id={`hotspot-category-${risk}`} + expanded={expanded} + onSetExpanded={onSetExpanded} + > + {hotspots.map((hotspot) => ( + + ))} + + ); +} + +type NavigationHeaderProps = Pick< + HotspotCategoryProps, + 'hotspots' | 'isLastAndIncomplete' | 'rating' | 'title' +>; + +function NavigationHeader(props: NavigationHeaderProps) { + const { hotspots, isLastAndIncomplete, rating, title } = props; + const counter = hotspots.length + (isLastAndIncomplete ? '+' : ''); + + return ( + +
+ + {title} +
+ {counter} + ); } + +const MemoizedHeader = memo(NavigationHeader); + +const SubNavigationContainer = styled.div` + width: calc(100% - 1.5rem); +`; diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.css b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.css deleted file mode 100644 index 1f65c3e9640..00000000000 --- a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.css +++ /dev/null @@ -1,127 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2023 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -.hotspot-list-header { - padding: calc(2 * var(--gridSize)) var(--gridSize); -} - -.hotspot-risk-header { - padding: var(--gridSize); -} - -.hotspot-category { - background-color: white; - border: 1px solid var(--barBorderColor); -} - -.hotspot-category .hotspot-category-header { - width: 100%; - padding: calc(2 * var(--gridSize)) var(--gridSize); - color: var(--baseFontColor); - border-bottom: none; - border-left: 4px solid; - box-sizing: border-box; -} - -.hotspot-category strong { - text-align: left; -} - -.hotspot-category .hotspot-category-header:hover, -.hotspot-category .hotspot-category-header.contains-selected-hotspot { - color: var(--blue); -} - -.hotspot-category.HIGH .hotspot-category-header { - border-left-color: var(--error400); -} - -.hotspot-category.MEDIUM .hotspot-category-header { - border-left-color: var(--warningAccent); -} - -.hotspot-category.LOW .hotspot-category-header { - border-left-color: var(--warningVariant); -} - -.hotspot-category .hotspot-item { - color: var(--baseFontColor); - display: block; - padding: var(--gridSize) calc(2 * var(--gridSize)); - border: 2px solid transparent; - border-top-color: var(--barBorderColor); - transition: padding 0s, border 0s; - width: 100%; - text-align: left; -} - -.hotspot-category button.hotspot-item:focus { - color: var(--baseFontColor); -} - -.hotspot-category .hotspot-item:hover { - background-color: var(--veryLightBlue); - border: 2px dashed var(--blue); - color: var(--baseFontColor); -} - -.hotspot-category .hotspot-item.highlight:hover { - background-color: transparent; -} - -.hotspot-category .hotspot-item.highlight { - color: var(--baseFontColor); - border: 2px solid var(--blue); - cursor: unset; -} - -.hotspot-risk-badge { - text-transform: uppercase; - display: inline-block; - text-align: center; - padding: 0 calc(var(--gridSize) / 2); - font-weight: bold; - border-radius: 3px; -} - -.hotspot-risk-badge.HIGH { - color: var(--blacka87); - background-color: var(--error400); -} -.hotspot-risk-badge.MEDIUM { - color: var(--blacka87); - background-color: var(--warningAccent); -} -.hotspot-risk-badge.LOW { - color: var(--blacka87); - background-color: var(--warningVariant); -} - -.hotspot-box-filename { - direction: rtl; -} - -.hotspot-header .issue-message-highlight-CODE { - background-color: var(--blacka06); - border-radius: 5px; -} - -.hotspot-item .issue-message-highlight-CODE { - background-color: var(--blacka06); -} diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx index 2f72ebdd5dc..acb87ce24e9 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx @@ -17,18 +17,19 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import classNames from 'classnames'; +import { withTheme } from '@emotion/react'; +import styled from '@emotion/styled'; +import { HotspotRating, HotspotRatingEnum, SubnavigationHeading, themeColor } from 'design-system'; import { groupBy } from 'lodash'; import * as React from 'react'; +import { FormattedMessage } from 'react-intl'; import ListFooter from '../../../components/controls/ListFooter'; -import SecurityHotspotIcon from '../../../components/icons/SecurityHotspotIcon'; -import { translate, translateWithParameters } from '../../../helpers/l10n'; -import { addSideBarClass, removeSideBarClass } from '../../../helpers/pages'; -import { HotspotStatusFilter, RawHotspot, RiskExposure } from '../../../types/security-hotspots'; +import { translate } from '../../../helpers/l10n'; +import { removeSideBarClass } from '../../../helpers/pages'; +import { HotspotStatusFilter, RawHotspot } from '../../../types/security-hotspots'; import { Dict, StandardSecurityCategories } from '../../../types/types'; -import { groupByCategory, RISK_EXPOSURE_LEVELS } from '../utils'; +import { RISK_EXPOSURE_LEVELS, groupByCategory } from '../utils'; import HotspotCategory from './HotspotCategory'; -import './HotspotList.css'; interface Props { hotspots: RawHotspot[]; @@ -47,7 +48,7 @@ interface Props { interface State { expandedCategories: Dict; groupedHotspots: Array<{ - risk: RiskExposure; + risk: HotspotRatingEnum; categories: Array<{ key: string; hotspots: RawHotspot[]; title: string }>; }>; } @@ -62,10 +63,6 @@ export default class HotspotList extends React.Component { }; } - componentDidMount() { - addSideBarClass(); - } - componentDidUpdate(prevProps: Props) { // Force open the category of selected hotspot if ( @@ -109,9 +106,14 @@ export default class HotspotList extends React.Component { }; handleToggleCategory = (categoryKey: string, value: boolean) => { - this.setState(({ expandedCategories }) => ({ - expandedCategories: { ...expandedCategories, [categoryKey]: value }, - })); + this.setState(({ expandedCategories }) => { + return { + expandedCategories: { + ...expandedCategories, + [categoryKey]: value, + }, + }; + }); }; render() { @@ -128,61 +130,74 @@ export default class HotspotList extends React.Component { const { expandedCategories, groupedHotspots } = this.state; return ( -
-

- - {translateWithParameters( - isStaticListOfHotspots ? 'hotspots.list_title' : `hotspots.list_title.${statusFilter}`, - hotspotsTotal - )} -

-
    + + + {hotspotsTotal}, + }} + /> + +
    {groupedHotspots.map((riskGroup, riskGroupIndex) => { const isLastRiskGroup = riskGroupIndex === groupedHotspots.length - 1; return ( -
  • -
    - {translate('hotspots.risk_exposure')}: -
    +
    + +
    + + {translate('hotspots.risk_exposure')}: + + {translate('risk_exposure', riskGroup.risk)}
    -
    -
      - {riskGroup.categories.map((cat, categoryIndex) => { + +
      + {riskGroup.categories.map((category, categoryIndex) => { const isLastCategory = categoryIndex === riskGroup.categories.length - 1; return ( -
    • +
      -
      • +
      ); })} -
    -
    • +
    +
); })} - + - + ); } } + +const StyledContainer = withTheme(styled.div` + background-color: ${themeColor('subnavigation')}; +`); diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotListItem.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotListItem.tsx index a04129e4853..2a4dca91052 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotListItem.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotListItem.tsx @@ -17,17 +17,13 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import classNames from 'classnames'; -import * as React from 'react'; -import { ButtonPlain } from '../../../components/controls/buttons'; -import QualifierIcon from '../../../components/icons/QualifierIcon'; -import { IssueMessageHighlighting } from '../../../components/issue/IssueMessageHighlighting'; +import { SubnavigationItem } from 'design-system'; +import React, { useCallback } from 'react'; import LocationsList from '../../../components/locations/LocationsList'; -import { ComponentQualifier } from '../../../types/component'; import { RawHotspot } from '../../../types/security-hotspots'; -import { getFilePath, getLocations } from '../utils'; +import { getLocations } from '../utils'; -export interface HotspotListItemProps { +interface HotspotListItemProps { hotspot: RawHotspot; onClick: (hotspot: RawHotspot) => void; onLocationClick: (index?: number) => void; @@ -38,33 +34,34 @@ export interface HotspotListItemProps { export default function HotspotListItem(props: HotspotListItemProps) { const { hotspot, selected, selectedHotspotLocation } = props; const locations = getLocations(hotspot.flows, undefined); - const path = getFilePath(hotspot.component, hotspot.project); + + // Use useCallback instead of useEffect/useRef combination to be notified of the ref changes + const itemRef = useCallback( + (node) => { + if (selected && node) { + node.scrollIntoView({ + block: 'center', + behavior: 'smooth', + }); + } + }, + [selected] + ); + + const handleClick = () => { + if (!selected) { + props.onClick(hotspot); + } + }; return ( - !selected && props.onClick(hotspot)} + - {/* This is not a real interaction it is only for scrolling */ - /* eslint-disable-next-line jsx-a11y/no-static-element-interactions */} -
props.onLocationClick() : undefined} - > - -
-
- -
- {/* is used to avoid some cases where the path is wrongly displayed */} - {/* because of the parent's direction=rtl */} - {path} -
-
+
{hotspot.message}
{selected && ( )} - + ); } diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/styles.css b/server/sonar-web/src/main/js/apps/security-hotspots/styles.css index cb388941c31..b336939bb10 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/styles.css +++ b/server/sonar-web/src/main/js/apps/security-hotspots/styles.css @@ -66,12 +66,3 @@ background: white; box-sizing: border-box; } - -#security_hotspots .invisible { - height: 0; - overflow: hidden; -} - -#security_hotspots .hotspots-list-single-category .hotspot-category .hotspot-category-header { - color: var(--blue); -} diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/utils.ts b/server/sonar-web/src/main/js/apps/security-hotspots/utils.ts index e7a79986fb1..6e12fe7d629 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/utils.ts +++ b/server/sonar-web/src/main/js/apps/security-hotspots/utils.ts @@ -17,6 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ +import { HotspotRatingEnum } from 'design-system'; import { flatten, groupBy, sortBy } from 'lodash'; import { renderCWECategory, @@ -37,7 +38,6 @@ import { RawHotspot, ReviewHistoryElement, ReviewHistoryType, - RiskExposure, } from '../../types/security-hotspots'; import { Dict, @@ -48,7 +48,11 @@ import { const OTHERS_SECURITY_CATEGORY = 'others'; -export const RISK_EXPOSURE_LEVELS = [RiskExposure.HIGH, RiskExposure.MEDIUM, RiskExposure.LOW]; +export const RISK_EXPOSURE_LEVELS = [ + HotspotRatingEnum.HIGH, + HotspotRatingEnum.MEDIUM, + HotspotRatingEnum.LOW, +]; export const SECURITY_STANDARDS = [ SecurityStandard.SONARSOURCE, SecurityStandard.OWASP_TOP10, diff --git a/server/sonar-web/src/main/js/helpers/mocks/security-hotspots.ts b/server/sonar-web/src/main/js/helpers/mocks/security-hotspots.ts index 946b1f79a24..8e20ba3d8c0 100644 --- a/server/sonar-web/src/main/js/helpers/mocks/security-hotspots.ts +++ b/server/sonar-web/src/main/js/helpers/mocks/security-hotspots.ts @@ -17,6 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ +import { HotspotRatingEnum } from 'design-system'; import { ComponentQualifier } from '../../types/component'; import { Standards } from '../../types/security'; import { @@ -29,7 +30,6 @@ import { RawHotspot, ReviewHistoryElement, ReviewHistoryType, - RiskExposure, } from '../../types/security-hotspots'; import { mockFlowLocation, mockUser } from '../testMocks'; @@ -42,7 +42,7 @@ export function mockRawHotspot(overrides: Partial = {}): RawHotspot status: HotspotStatus.TO_REVIEW, resolution: undefined, securityCategory: 'command-injection', - vulnerabilityProbability: RiskExposure.HIGH, + vulnerabilityProbability: HotspotRatingEnum.HIGH, message: "'3' is a magic number.", line: 81, author: 'Developer 1', @@ -113,7 +113,7 @@ export function mockHotspotRule(overrides?: Partial): HotspotRule { return { key: 'squid:S2077', name: 'That rule', - vulnerabilityProbability: RiskExposure.HIGH, + vulnerabilityProbability: HotspotRatingEnum.HIGH, securityCategory: 'sql-injection', ...overrides, }; diff --git a/server/sonar-web/src/main/js/types/security-hotspots.ts b/server/sonar-web/src/main/js/types/security-hotspots.ts index f759c59ac21..9fd212b3d70 100644 --- a/server/sonar-web/src/main/js/types/security-hotspots.ts +++ b/server/sonar-web/src/main/js/types/security-hotspots.ts @@ -17,17 +17,12 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ +import { HotspotRatingEnum } from 'design-system'; import { ComponentQualifier } from './component'; import { MessageFormatting } from './issues'; import { FlowLocation, IssueChangelog, IssueChangelogDiff, Paging, TextRange } from './types'; import { UserBase } from './users'; -export enum RiskExposure { - LOW = 'LOW', - MEDIUM = 'MEDIUM', - HIGH = 'HIGH', -} - export enum HotspotStatus { TO_REVIEW = 'TO_REVIEW', REVIEWED = 'REVIEWED', @@ -74,7 +69,7 @@ export interface RawHotspot { securityCategory: string; status: HotspotStatus; updateDate: string; - vulnerabilityProbability: RiskExposure; + vulnerabilityProbability: HotspotRatingEnum; flows?: Array<{ locations?: Array>; }>; @@ -128,7 +123,7 @@ export interface HotspotRule { key: string; name: string; securityCategory: string; - vulnerabilityProbability: RiskExposure; + vulnerabilityProbability: HotspotRatingEnum; } export interface HotspotComment { -- 2.39.5