diff options
Diffstat (limited to 'server/sonar-web/src')
4 files changed, 58 insertions, 63 deletions
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/__tests__/CodingRules-it.ts b/server/sonar-web/src/main/js/apps/coding-rules/__tests__/CodingRules-it.ts index 1ec9fd4567d..4134304b6c6 100644 --- a/server/sonar-web/src/main/js/apps/coding-rules/__tests__/CodingRules-it.ts +++ b/server/sonar-web/src/main/js/apps/coding-rules/__tests__/CodingRules-it.ts @@ -24,7 +24,11 @@ import { RULE_TYPES } from '../../../helpers/constants'; import { parseDate } from '../../../helpers/dates'; import { mockCurrentUser, mockLoggedInUser } from '../../../helpers/testMocks'; import { dateInputEvent, renderAppRoutes } from '../../../helpers/testReactTestingUtils'; -import { CleanCodeAttributeCategory, SoftwareQuality } from '../../../types/clean-code-taxonomy'; +import { + CleanCodeAttribute, + CleanCodeAttributeCategory, + SoftwareQuality, +} from '../../../types/clean-code-taxonomy'; import { CurrentUser } from '../../../types/users'; import routes from '../routes'; import { getPageObjects } from '../utils-tests'; @@ -360,6 +364,11 @@ describe('Rule app details', () => { renderCodingRulesApp(undefined, 'coding_rules?open=rule1'); await ui.appLoaded(); expect(ui.ruleTitle('Awsome java rule').get()).toBeInTheDocument(); + expect( + ui.ruleCleanCodeAttributeCategory(CleanCodeAttributeCategory.Adaptable).get() + ).toBeInTheDocument(); + expect(ui.ruleCleanCodeAttribute(CleanCodeAttribute.Clear).get()).toBeInTheDocument(); + expect(ui.ruleSoftwareQuality(SoftwareQuality.Maintainability).get()).toBeInTheDocument(); expect(document.title).toEqual('page_title.template.with_category.coding_rules.page'); expect(screen.getByText('Why')).toBeInTheDocument(); expect(screen.getByText('Because')).toBeInTheDocument(); 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 05ed99d1f50..e0a6f151548 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 @@ -24,10 +24,10 @@ 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 SeverityHelper from '../../../components/shared/SeverityHelper'; +import { CleanCodeAttributePill } from '../../../components/shared/CleanCodeAttributePill'; +import SoftwareImpactPill from '../../../components/shared/SoftwareImpactPill'; import TagsList from '../../../components/tags/TagsList'; import { PopupPlacement } from '../../../components/ui/popups'; import { translate, translateWithParameters } from '../../../helpers/l10n'; @@ -45,29 +45,6 @@ interface Props { const EXTERNAL_RULE_REPO_PREFIX = 'external_'; export default class RuleDetailsMeta extends React.PureComponent<Props> { - renderType = () => { - const { ruleDetails } = this.props; - return ( - <Tooltip overlay={translate('coding_rules.type.tooltip', ruleDetails.type)}> - <li className="coding-rules-detail-property" data-meta="type"> - <IssueTypeIcon className="little-spacer-right" query={ruleDetails.type} /> - {translate('issue.type', ruleDetails.type)} - </li> - </Tooltip> - ); - }; - - renderSeverity = () => ( - <Tooltip overlay={translate('default_severity')}> - <li className="coding-rules-detail-property" data-meta="severity"> - <SeverityHelper - className="display-inline-flex-center" - severity={this.props.ruleDetails.severity} - /> - </li> - </Tooltip> - ); - renderStatus = () => { const { ruleDetails } = this.props; if (ruleDetails.status === 'READY') { @@ -224,6 +201,15 @@ export default class RuleDetailsMeta extends React.PureComponent<Props> { const hasTypeData = !ruleDetails.isExternal || ruleDetails.type !== 'UNKNOWN'; return ( <div className="js-rule-meta"> + {ruleDetails.cleanCodeAttributeCategory !== undefined && ( + <CleanCodeAttributePill + className="big-spacer-bottom" + cleanCodeAttributeCategory={ruleDetails.cleanCodeAttributeCategory} + cleanCodeAttribute={ruleDetails.cleanCodeAttribute} + type="rule" + /> + )} + <div className="page-header"> <div className="pull-right"> {this.renderKey()} @@ -240,24 +226,42 @@ export default class RuleDetailsMeta extends React.PureComponent<Props> { <h1 className="page-title coding-rules-detail-header">{ruleDetails.name}</h1> </div> - {hasTypeData && ( - <ul className="coding-rules-detail-properties"> - {this.renderType()} - {this.renderSeverity()} - {!ruleDetails.isExternal && this.renderStatus()} - {this.renderTags()} - {!ruleDetails.isExternal && this.renderCreationDate()} - {this.renderRepository()} - {!ruleDetails.isExternal && ( - <> - {this.renderTemplate()} - {this.renderParentTemplate()} - {this.renderRemediation()} - </> - )} - {ruleDetails.isExternal && this.renderExternalBadge()} - </ul> - )} + <div className="display-flex-center"> + {ruleDetails.impacts !== undefined && ( + <div className="sw-flex sw-items-center flex-1"> + <span>{translate('issue.software_qualities.label')}</span> + <ul className="sw-flex sw-gap-2"> + {ruleDetails.impacts.map(({ severity, softwareQuality }) => ( + <li key={softwareQuality}> + <SoftwareImpactPill + className="little-spacer-left" + severity={severity} + quality={softwareQuality} + type="rule" + /> + </li> + ))} + </ul> + </div> + )} + + {hasTypeData && ( + <ul className="coding-rules-detail-properties"> + {!ruleDetails.isExternal && this.renderStatus()} + {this.renderTags()} + {!ruleDetails.isExternal && this.renderCreationDate()} + {this.renderRepository()} + {!ruleDetails.isExternal && ( + <> + {this.renderTemplate()} + {this.renderParentTemplate()} + {this.renderRemediation()} + </> + )} + {ruleDetails.isExternal && this.renderExternalBadge()} + </ul> + )} + </div> </div> ); } diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsProfiles.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsProfiles.tsx index e2b7b9790cf..b5e37e7893f 100644 --- a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsProfiles.tsx +++ b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsProfiles.tsx @@ -24,8 +24,6 @@ import InstanceMessage from '../../../components/common/InstanceMessage'; import Link from '../../../components/common/Link'; import { Button } from '../../../components/controls/buttons'; import ConfirmButton from '../../../components/controls/ConfirmButton'; -import Tooltip from '../../../components/controls/Tooltip'; -import SeverityHelper from '../../../components/shared/SeverityHelper'; import { translate, translateWithParameters } from '../../../helpers/l10n'; import { getQualityProfileUrl } from '../../../helpers/urls'; import { Dict, RuleActivation, RuleDetails } from '../../../types/types'; @@ -82,21 +80,6 @@ export default class RuleDetailsProfiles extends React.PureComponent<Props> { ); }; - renderSeverity = (activation: RuleActivation, parentActivation?: RuleActivation) => ( - <td className="coding-rules-detail-quality-profile-severity"> - <Tooltip overlay={translate('coding_rules.activation_severity')}> - <span> - <SeverityHelper className="display-inline-flex-center" severity={activation.severity} /> - </span> - </Tooltip> - {parentActivation !== undefined && activation.severity !== parentActivation.severity && ( - <div className="coding-rules-detail-quality-profile-inheritance"> - {translate('coding_rules.original')} {translate('severity', parentActivation.severity)} - </div> - )} - </td> - ); - renderParameter = (param: { key: string; value: string }, parentActivation?: RuleActivation) => { const originalParam = parentActivation && parentActivation.params.find((p) => p.key === param.key); @@ -212,7 +195,6 @@ export default class RuleDetailsProfiles extends React.PureComponent<Props> { {this.renderInheritedProfile(activation, profile)} </td> - {this.renderSeverity(activation, parentActivation)} {!ruleDetails.templateKey && this.renderParameters(activation, parentActivation)} {this.renderActions(activation, profile)} </tr> diff --git a/server/sonar-web/src/main/js/apps/coding-rules/styles.css b/server/sonar-web/src/main/js/apps/coding-rules/styles.css index 85c9abac74c..bb7548b2a16 100644 --- a/server/sonar-web/src/main/js/apps/coding-rules/styles.css +++ b/server/sonar-web/src/main/js/apps/coding-rules/styles.css @@ -100,7 +100,7 @@ .coding-rules-detail-property { display: flex; align-items: center; - margin-right: calc(2 * var(--gridSize)); + margin-right: var(--gridSize); margin-bottom: var(--gridSize); font-size: var(--smallFontSize); } |