From 46862a9ae9071b7e902381fcdc93236588a7cae1 Mon Sep 17 00:00:00 2001 From: stanislavh Date: Wed, 23 Aug 2023 15:40:43 +0200 Subject: [PATCH] SONAR-20197 Adjust tooltips and add deprecated fields --- .../design-system/src/components/Pill.tsx | 1 - .../components/RuleDetailsMeta.tsx | 89 +++++++++++++++---- .../coding-rules/components/RuleListItem.tsx | 19 ++-- .../src/main/js/apps/coding-rules/styles.css | 4 + .../main/js/components/icons/SeverityIcon.tsx | 10 +-- .../shared/CleanCodeAttributePill.tsx | 19 ++-- .../js/components/shared/SeverityHelper.tsx | 5 +- server/sonar-web/src/main/js/types/types.ts | 2 +- .../resources/org/sonar/l10n/core.properties | 5 ++ 9 files changed, 108 insertions(+), 46 deletions(-) diff --git a/server/sonar-web/design-system/src/components/Pill.tsx b/server/sonar-web/design-system/src/components/Pill.tsx index 6f576d55226..59a0f54287e 100644 --- a/server/sonar-web/design-system/src/components/Pill.tsx +++ b/server/sonar-web/design-system/src/components/Pill.tsx @@ -50,7 +50,6 @@ export function Pill({ children, variant, ...rest }: PillProps) { const StyledPill = styled.span<{ color: ThemeColors; }>` - ${tw`sw-cursor-pointer`}; ${tw`sw-body-sm`}; ${tw`sw-w-fit`}; ${tw`sw-inline-block`}; diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsMeta.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsMeta.tsx index e0a6f151548..5aec7b822a5 100644 --- a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsMeta.tsx +++ b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsMeta.tsx @@ -19,14 +19,18 @@ */ import * as React from 'react'; +import { colors } from '../../../app/theme'; +import DocumentationTooltip from '../../../components/common/DocumentationTooltip'; import Link from '../../../components/common/Link'; import Dropdown from '../../../components/controls/Dropdown'; import HelpTooltip from '../../../components/controls/HelpTooltip'; import Tooltip from '../../../components/controls/Tooltip'; import { ButtonLink } from '../../../components/controls/buttons'; +import IssueTypeIcon from '../../../components/icons/IssueTypeIcon'; import LinkIcon from '../../../components/icons/LinkIcon'; import DateFormatter from '../../../components/intl/DateFormatter'; import { CleanCodeAttributePill } from '../../../components/shared/CleanCodeAttributePill'; +import SeverityHelper from '../../../components/shared/SeverityHelper'; import SoftwareImpactPill from '../../../components/shared/SoftwareImpactPill'; import TagsList from '../../../components/tags/TagsList'; import { PopupPlacement } from '../../../components/ui/popups'; @@ -45,6 +49,56 @@ interface Props { const EXTERNAL_RULE_REPO_PREFIX = 'external_'; export default class RuleDetailsMeta extends React.PureComponent { + renderType = () => { + const { ruleDetails } = this.props; + return ( +
  • + +

    {translate('coding_rules.type.deprecation.title')}

    +

    {translate('coding_rules.type.deprecation.filter_by')}

    + + } + links={[ + { + href: '/user-guide/rules', + label: translate('learn_more'), + }, + ]} + > + + {translate('issue.type', ruleDetails.type)} +     +
    • + ); + }; + + renderSeverity = () => ( +
  • + +

    {translate('coding_rules.severity.deprecation.title')}

    +

    {translate('coding_rules.severity.deprecation.filter_by')}

    + + } + links={[ + { + href: '/user-guide/rules', + label: translate('learn_more'), + }, + ]} + > + +     +
    • + ); + renderStatus = () => { const { ruleDetails } = this.props; if (ruleDetails.status === 'READY') { @@ -65,7 +119,7 @@ export default class RuleDetailsMeta extends React.PureComponent { const allTags = [...sysTags, ...tags]; return ( -
  • +
    {this.props.canWrite ? ( { tags={tags} /> } - overlayPlacement={PopupPlacement.BottomLeft} + overlayPlacement={PopupPlacement.BottomRight} > { tags={allTags.length > 0 ? allTags : [translate('coding_rules.no_tags')]} /> )} -
    • + ); }; @@ -201,17 +255,15 @@ export default class RuleDetailsMeta extends React.PureComponent { const hasTypeData = !ruleDetails.isExternal || ruleDetails.type !== 'UNKNOWN'; return (
    - {ruleDetails.cleanCodeAttributeCategory !== undefined && ( - - )} - -
    -
    +
    + {ruleDetails.cleanCodeAttributeCategory !== undefined && ( + + )} +
    {this.renderKey()} {!ruleDetails.isExternal && ( { )}
    +
    + +

    {ruleDetails.name}

    + {this.renderTags()}
    - {ruleDetails.impacts !== undefined && ( + {!!ruleDetails.impacts.length && (
    {translate('issue.software_qualities.label')}
      @@ -247,8 +303,9 @@ export default class RuleDetailsMeta extends React.PureComponent { {hasTypeData && (
        + {this.renderType()} + {this.renderSeverity()} {!ruleDetails.isExternal && this.renderStatus()} - {this.renderTags()} {!ruleDetails.isExternal && this.renderCreationDate()} {this.renderRepository()} {!ruleDetails.isExternal && ( diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleListItem.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleListItem.tsx index 152976ad5cc..31281f1a830 100644 --- a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleListItem.tsx +++ b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleListItem.tsx @@ -247,16 +247,15 @@ export default class RuleListItem extends React.PureComponent { {rule.langName} - {rule.impacts !== undefined && - rule.impacts.map(({ severity, softwareQuality }) => ( - - ))} + {rule.impacts.map(({ severity, softwareQuality }) => ( + + ))} {allTags.length > 0 && ( ); @@ -62,7 +62,7 @@ function CriticalSeverityIcon(iconProps: IconProps) { ); @@ -73,7 +73,7 @@ function MajorSeverityIcon(iconProps: IconProps) { ); @@ -84,7 +84,7 @@ function MinorSeverityIcon(iconProps: IconProps) { ); @@ -95,7 +95,7 @@ function InfoSeverityIcon(iconProps: IconProps) { ); diff --git a/server/sonar-web/src/main/js/components/shared/CleanCodeAttributePill.tsx b/server/sonar-web/src/main/js/components/shared/CleanCodeAttributePill.tsx index 43bcfcf23ea..56f0f6d2fb9 100644 --- a/server/sonar-web/src/main/js/components/shared/CleanCodeAttributePill.tsx +++ b/server/sonar-web/src/main/js/components/shared/CleanCodeAttributePill.tsx @@ -33,7 +33,6 @@ export interface Props { export function CleanCodeAttributePill(props: Props) { const { className, cleanCodeAttributeCategory, cleanCodeAttribute, type = 'issue' } = props; - const showAdvice = type === 'issue'; return ( - {showAdvice && ( -

        - {translate( - type, - cleanCodeAttribute ? 'clean_code_attribute' : 'clean_code_attribute_category', - cleanCodeAttribute ?? cleanCodeAttributeCategory, - 'advice' - )} -

        - )} +

        + {translate( + 'issue', + cleanCodeAttribute ? 'clean_code_attribute' : 'clean_code_attribute_category', + cleanCodeAttribute ?? cleanCodeAttributeCategory, + 'advice' + )} +

        } links={[ diff --git a/server/sonar-web/src/main/js/components/shared/SeverityHelper.tsx b/server/sonar-web/src/main/js/components/shared/SeverityHelper.tsx index 1d3e2a145b5..c88881d28ba 100644 --- a/server/sonar-web/src/main/js/components/shared/SeverityHelper.tsx +++ b/server/sonar-web/src/main/js/components/shared/SeverityHelper.tsx @@ -23,16 +23,17 @@ import { translate } from '../../helpers/l10n'; interface Props { className?: string; + fill?: string; severity: string; } -export default function SeverityHelper({ className, severity }: Props) { +export default function SeverityHelper({ className, severity, fill }: Props) { if (!severity) { return null; } return ( - + {translate('severity', severity)} ); diff --git a/server/sonar-web/src/main/js/types/types.ts b/server/sonar-web/src/main/js/types/types.ts index aa26d7d3192..27dc1a9542c 100644 --- a/server/sonar-web/src/main/js/types/types.ts +++ b/server/sonar-web/src/main/js/types/types.ts @@ -535,7 +535,7 @@ export type RawQuery = Dict; export interface Rule { cleanCodeAttributeCategory?: CleanCodeAttributeCategory; cleanCodeAttribute?: CleanCodeAttribute; - impacts?: Array<{ + impacts: Array<{ softwareQuality: SoftwareQuality; severity: SoftwareImpactSeverity; }>; diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties index d2ab93e2495..fa2dd3db8eb 100644 --- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties +++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties @@ -2273,6 +2273,11 @@ coding_rules.type.tooltip.CODE_SMELL=Code Smell Detection Rule coding_rules.type.tooltip.BUG=Bug Detection Rule coding_rules.type.tooltip.VULNERABILITY=Vulnerability Detection Rule coding_rules.type.tooltip.SECURITY_HOTSPOT=Security Hotspot Detection Rule +coding_rules.type.deprecation.title=Types of detection rules are deprecated. +coding_rules.type.deprecation.filter_by=You can now filter rules by Clean Code Attribute and Software Quality. +coding_rules.severity.deprecation.title=Severities are now directly tied to the software quality impacted. This old severity is deprecated and can no longer be modified. +coding_rules.severity.deprecation.filter_by=You can now filter rules by Software Quality and new Severity. + coding_rules.update_custom_rule=Update Custom Rule coding_rules.filters.activation=Activation -- 2.39.5