${tw`sw-rounded-1`};
`;
+const LightGreyCardStyled = styled(CardStyled)`
+ border: ${themeBorder('default')};
+`;
+
const GreyCardStyled = styled(CardStyled)`
border: ${themeBorder('default', 'almCardBorder')};
`;
border-bottom: none;
font-weight: 600;
color: ${themeColor('linkNaked')};
+
+ &:hover,
+ &:focus,
+ &:active {
+ color: ${themeColor('linkActive')};
+ }
`;
export const DrilldownLink = styled(StyledBaseLink)`
// project
projectCardBackground: COLORS.white,
projectCardBorder: COLORS.blueGrey[100],
+ projectLightGreyCardBorder: COLORS.grey[50],
// overview
overviewCardDefaultIcon: secondary.light,
overviewCardSuccessIcon: COLORS.green[200],
// overview software impact breakdown
- overviewSoftwareImpactSeverityNeutral: COLORS.blueGrey[50],
+ overviewSoftwareImpactSeverityNeutral: [247, 249, 252],
overviewSoftwareImpactSeverityHigh: COLORS.red[100],
overviewSoftwareImpactSeverityMedium: COLORS.yellow[100],
overviewSoftwareImpactSeverityLow: COLORS.blue[100],
});
result.component.measures?.push({
metric: MetricKey.maintainability_issues,
- period: {
- index: 0,
- value: JSON.stringify({
- total: 3,
- high: 1,
- medium: 1,
- low: 1,
- }),
- },
+ value: JSON.stringify({
+ total: 3,
+ high: 1,
+ medium: 1,
+ low: 1,
+ }),
});
}
if (metrics.includes(MetricKey.reliability_issues)) {
});
result.component.measures?.push({
metric: MetricKey.reliability_issues,
- period: {
- index: 0,
- value: JSON.stringify({
- total: 2,
- high: 0,
- medium: 1,
- low: 1,
- }),
- },
+ value: JSON.stringify({
+ total: 2,
+ high: 0,
+ medium: 1,
+ low: 1,
+ }),
});
}
if (metrics.includes(MetricKey.security_issues)) {
});
result.component.measures?.push({
metric: MetricKey.security_issues,
- period: {
- index: 0,
- value: JSON.stringify({
- total: 1,
- high: 0,
- medium: 0,
- low: 1,
- }),
- },
+ value: JSON.stringify({
+ total: 1,
+ high: 0,
+ medium: 0,
+ low: 1,
+ }),
});
}
return result;
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-import styled from '@emotion/styled';
-import { Card, CardSeparator, NakedLink, TextBold, TextSubdued, themeBorder } from 'design-system';
+import { BasicSeparator, LightGreyCard, NakedLink, TextBold, TextSubdued } from 'design-system';
import * as React from 'react';
import { useIntl } from 'react-intl';
import { DEFAULT_ISSUES_QUERY } from '../../../components/shared/utils';
: null;
return (
- <StyledCard className="sw-w-1/3 sw-rounded-2 sw-p-4 sw-flex-col">
+ <LightGreyCard className="sw-w-1/3 sw-rounded-2 sw-p-4 sw-flex-col">
<TextBold name={intl.formatMessage({ id: `software_quality.${softwareQuality}` })} />
- <CardSeparator className="sw--mx-4" />
+ <BasicSeparator className="sw--mx-4" />
<div className="sw-flex sw-flex-col sw-gap-3">
<div className="sw-flex sw-gap-1 sw-items-end">
<NakedLink
))}
</div>
</div>
- </StyledCard>
+ </LightGreyCard>
);
}
-const StyledCard = styled(Card)`
- border: ${themeBorder('default')};
-`;
-
export default SoftwareImpactMeasureCard;
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-import styled from '@emotion/styled';
-import { BasicSeparator, MetricsRatingBadge, Tooltip, themeColor } from 'design-system';
+import { MetricsRatingBadge, Tooltip } from 'design-system';
import * as React from 'react';
import { useIntl } from 'react-intl';
import { formatRating } from '../../../helpers/measures';
-import { SoftwareImpactSeverity, SoftwareQuality } from '../../../types/clean-code-taxonomy';
+import { SoftwareQuality } from '../../../types/clean-code-taxonomy';
+import SoftwareImpactRatingTooltip from './SoftwareImpactRatingTooltip';
export interface SoftwareImpactMeasureRatingProps {
softwareQuality: SoftwareQuality;
const rating = formatRating(value);
- function ratingToWorseSeverity(rating: string): SoftwareImpactSeverity {
- switch (rating) {
- case 'B':
- return SoftwareImpactSeverity.Low;
- case 'C':
- return SoftwareImpactSeverity.Medium;
- case 'D':
- case 'E':
- return SoftwareImpactSeverity.High;
- default:
- return SoftwareImpactSeverity.Low;
- }
- }
-
- function getTooltipContent() {
- if (!rating || rating === 'A') {
- return null;
- }
-
- const softwareQualityLabel = intl.formatMessage({
- id: `software_quality.${softwareQuality}`,
- });
- const severityLabel = intl.formatMessage({
- id: `overview.measures.software_impact.severity.${ratingToWorseSeverity(
- rating,
- )}.improve_tooltip`,
- });
-
- return (
- <div className="sw-flex sw-flex-col sw-gap-1">
- <span className="sw-font-semibold">
- {intl.formatMessage({
- id: 'overview.measures.software_impact.improve_rating_tooltip.title',
- })}
- </span>
-
- <span>
- {intl.formatMessage(
- {
- id: 'overview.measures.software_impact.improve_rating_tooltip.content.1',
- },
- {
- softwareQuality: softwareQualityLabel,
- ratingLabel: rating,
- severity: severityLabel,
- },
- )}
- </span>
-
- <span className="sw-mt-4">
- {intl.formatMessage({
- id: 'overview.measures.software_impact.improve_rating_tooltip.content.2',
- })}
- </span>
- </div>
- );
- }
-
return (
- <Tooltip overlay={getTooltipContent()}>
+ <Tooltip
+ overlay={SoftwareImpactRatingTooltip({
+ rating,
+ softwareQuality,
+ })}
+ >
<MetricsRatingBadge
size="lg"
className="sw-text-sm"
);
}
-export const StyledSeparator = styled(BasicSeparator)`
- background-color: ${themeColor('projectCardBorder')};
-`;
-
export default SoftwareImpactMeasureRating;
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2024 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.
+ */
+import * as React from 'react';
+import { useIntl } from 'react-intl';
+import { SoftwareImpactSeverity, SoftwareQuality } from '../../../types/clean-code-taxonomy';
+
+export interface SoftwareImpactRatingTooltipProps {
+ rating?: string;
+ softwareQuality: SoftwareQuality;
+}
+
+export function SoftwareImpactRatingTooltip(props: Readonly<SoftwareImpactRatingTooltipProps>) {
+ const { rating, softwareQuality } = props;
+
+ const intl = useIntl();
+
+ if (!rating || rating === 'A') {
+ return null;
+ }
+
+ function ratingToWorseSeverity(rating: string): SoftwareImpactSeverity {
+ return (
+ {
+ B: SoftwareImpactSeverity.Low,
+ C: SoftwareImpactSeverity.Medium,
+ D: SoftwareImpactSeverity.High,
+ E: SoftwareImpactSeverity.High,
+ }[rating] ?? SoftwareImpactSeverity.Low
+ );
+ }
+
+ const softwareQualityLabel = intl.formatMessage({
+ id: `software_quality.${softwareQuality}`,
+ });
+ const severityLabel = intl.formatMessage({
+ id: `overview.measures.software_impact.severity.${ratingToWorseSeverity(
+ rating,
+ )}.improve_tooltip`,
+ });
+
+ return (
+ <div className="sw-flex sw-flex-col sw-gap-1">
+ <span className="sw-font-semibold">
+ {intl.formatMessage({
+ id: 'overview.measures.software_impact.improve_rating_tooltip.title',
+ })}
+ </span>
+
+ <span>
+ {intl.formatMessage(
+ {
+ id: 'overview.measures.software_impact.improve_rating_tooltip.content.1',
+ },
+ {
+ softwareQuality: softwareQualityLabel,
+ ratingLabel: rating,
+ severity: severityLabel,
+ },
+ )}
+ </span>
+
+ <span className="sw-mt-4">
+ {intl.formatMessage({
+ id: 'overview.measures.software_impact.improve_rating_tooltip.content.2',
+ })}
+ </span>
+ </div>
+ );
+}
+
+export default SoftwareImpactRatingTooltip;
projects / sonarqube.git / commitdiff