+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2019 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.
- */
-/* TODO remove this file */
-
-.line-chart-legend {
- color: var(--blue);
-}
-
-.line-chart-legend.line-chart-legend-1 {
- color: var(--darkBlue);
-}
-
-.line-chart-legend.line-chart-legend-2 {
- color: #24c6e0;
-}
@import './components/menu.css';
@import './components/page.css';
@import './components/component-name.css';
-@import './components/graphics.css';
@import './components/list-groups.css';
@import './components/panels.css';
@import './components/badges.css';
const hasData = hasDataValues(serie);
const legendItem = (
<GraphsLegendItem
+ index={idx}
metric={serie.name}
name={serie.translatedName}
removeMetric={removeMetric}
showWarning={!hasData}
- style={idx.toString()}
/>
);
if (!hasData) {
interface Props {
className?: string;
+ index: number;
metric: string;
name: string;
showWarning?: boolean;
- style: string;
removeMetric?: (metric: string) => void;
}
{this.props.showWarning ? (
<AlertWarnIcon className="spacer-right" />
) : (
- <ChartLegendIcon
- className={classNames(
- 'text-middle spacer-right line-chart-legend',
- 'line-chart-legend-' + this.props.style
- )}
- />
+ <ChartLegendIcon className="text-middle spacer-right" index={this.props.index} />
)}
<span className="text-middle">{this.props.name}</span>
{isActionable && (
{series.map((serie, idx) => (
<GraphsLegendItem
className="big-spacer-left big-spacer-right"
+ index={idx}
key={serie.name}
metric={serie.name}
name={serie.translatedName}
- style={idx.toString()}
/>
))}
</div>
if (this.props.graph === DEFAULT_GRAPH) {
return (
<GraphsTooltipsContentIssues
+ index={idx}
key={serie.name}
measuresHistory={this.props.measuresHistory}
name={serie.name}
- style={idx.toString()}
tooltipIdx={tooltipIdx}
translatedName={serie.translatedName}
value={this.props.formatValue(point.y)}
} else {
return (
<GraphsTooltipsContent
+ index={idx}
key={serie.name}
name={serie.name}
- style={idx.toString()}
translatedName={serie.translatedName}
value={this.props.formatValue(point.y)}
/>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
-import * as classNames from 'classnames';
import ChartLegendIcon from '../../../components/icons-components/ChartLegendIcon';
interface Props {
name: string;
- style: string;
+ index: number;
translatedName: string;
value: string;
}
-export default function GraphsTooltipsContent({ name, style, translatedName, value }: Props) {
+export default function GraphsTooltipsContent({ name, index, translatedName, value }: Props) {
return (
<tr className="project-activity-graph-tooltip-line" key={name}>
<td className="thin">
- <ChartLegendIcon
- className={classNames('spacer-right line-chart-legend', 'line-chart-legend-' + style)}
- />
+ <ChartLegendIcon className="spacer-right" index={index} />
</td>
<td className="project-activity-graph-tooltip-value text-right spacer-right thin">{value}</td>
<td>{translatedName}</td>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
-import * as classNames from 'classnames';
import ChartLegendIcon from '../../../components/icons-components/ChartLegendIcon';
import Rating from '../../../components/ui/Rating';
import { MeasureHistory } from '../utils';
interface Props {
+ index: number;
measuresHistory: MeasureHistory[];
name: string;
- style: string;
tooltipIdx: number;
translatedName: string;
value: string;
return (
<tr className="project-activity-graph-tooltip-issues-line" key={props.name}>
<td className="thin">
- <ChartLegendIcon
- className={classNames(
- 'spacer-right line-chart-legend',
- 'line-chart-legend-' + props.style
- )}
- />
+ <ChartLegendIcon className="spacer-right" index={props.index} />
</td>
<td className="text-right spacer-right">
<span className="project-activity-graph-tooltip-value">{props.value}</span>
import GraphsLegendItem from '../GraphsLegendItem';
it('should render correctly a legend', () => {
- expect(shallow(<GraphsLegendItem metric="bugs" name="Bugs" style="2" />)).toMatchSnapshot();
+ expect(shallow(<GraphsLegendItem index={2} metric="bugs" name="Bugs" />)).toMatchSnapshot();
});
it('should render correctly an actionable legend', () => {
shallow(
<GraphsLegendItem
className="myclass"
+ index={1}
metric="foo"
name="Foo"
removeMetric={() => {}}
- style="1"
/>
)
).toMatchSnapshot();
it('should render correctly legends with warning', () => {
expect(
shallow(
- <GraphsLegendItem className="myclass" metric="foo" name="Foo" showWarning={true} style="1" />
+ <GraphsLegendItem className="myclass" index={1} metric="foo" name="Foo" showWarning={true} />
)
).toMatchSnapshot();
});
import GraphsTooltipsContent from '../GraphsTooltipsContent';
const DEFAULT_PROPS = {
+ index: 1,
name: 'code_smells',
- style: '1',
translatedName: 'Code Smells',
value: '1.2k'
};
];
const DEFAULT_PROPS = {
+ index: 2,
measuresHistory: MEASURES_ISSUES,
name: 'bugs',
- style: '2',
tooltipIdx: 1,
translatedName: 'Bugs',
value: '1.2k'
key="bugs"
>
<GraphsLegendItem
+ index={0}
metric="bugs"
name="Bugs"
removeMetric={[Function]}
showWarning={false}
- style="0"
/>
</span>
<span
key="my_metric"
>
<GraphsLegendItem
+ index={1}
metric="my_metric"
name="My Metric"
removeMetric={[Function]}
showWarning={false}
- style="1"
/>
</span>
<Tooltip
className="spacer-left spacer-right"
>
<GraphsLegendItem
+ index={2}
metric="foo"
name="Foo"
removeMetric={[Function]}
showWarning={true}
- style="2"
/>
</span>
</Tooltip>
className=""
>
<ChartLegendIcon
- className="text-middle spacer-right line-chart-legend line-chart-legend-2"
+ className="text-middle spacer-right"
+ index={2}
/>
<span
className="text-middle"
className="project-activity-graph-legend-actionable myclass"
>
<ChartLegendIcon
- className="text-middle spacer-right line-chart-legend line-chart-legend-1"
+ className="text-middle spacer-right"
+ index={1}
/>
<span
className="text-middle"
>
<GraphsLegendItem
className="big-spacer-left big-spacer-right"
+ index={0}
key="bugs"
metric="bugs"
name="Bugs"
- style="0"
/>
<GraphsLegendItem
className="big-spacer-left big-spacer-right"
+ index={1}
key="code_smells"
metric="code_smells"
name="Code Smells"
- style="1"
/>
</div>
`;
>
<tbody>
<GraphsTooltipsContentIssues
+ index={0}
key="bugs"
measuresHistory={Array []}
name="bugs"
- style="0"
tooltipIdx={0}
translatedName="Bugs"
value="Formated.3"
/>
<GraphsTooltipsContentIssues
+ index={1}
key="code_smells"
measuresHistory={Array []}
name="code_smells"
- style="1"
tooltipIdx={0}
translatedName="Code Smells"
value="Formated.18"
/>
<GraphsTooltipsContentIssues
+ index={2}
key="vulnerabilities"
measuresHistory={Array []}
name="vulnerabilities"
- style="2"
tooltipIdx={0}
translatedName="Vulnerabilities"
value="Formated.0"
>
<tbody>
<GraphsTooltipsContent
+ index={0}
key="bugs"
name="bugs"
- style="0"
translatedName="Bugs"
value="Formated.0"
/>
<GraphsTooltipsContent
+ index={1}
key="code_smells"
name="code_smells"
- style="1"
translatedName="Code Smells"
value="Formated.15"
/>
<GraphsTooltipsContent
+ index={2}
key="vulnerabilities"
name="vulnerabilities"
- style="2"
translatedName="Vulnerabilities"
value="Formated.1"
/>
className="thin"
>
<ChartLegendIcon
- className="spacer-right line-chart-legend line-chart-legend-1"
+ className="spacer-right"
+ index={1}
/>
</td>
<td
className="thin"
>
<ChartLegendIcon
- className="spacer-right line-chart-legend line-chart-legend-2"
+ className="spacer-right"
+ index={2}
/>
</td>
<td
className="thin"
>
<ChartLegendIcon
- className="spacer-right line-chart-legend line-chart-legend-2"
+ className="spacer-right"
+ index={2}
/>
</td>
<td
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
-import Icon, { IconProps } from './Icon';
+import Icon from './Icon';
+import * as theme from '../../app/theme';
-export default function ChartLegendIcon({ className, fill = 'currentColor', size }: IconProps) {
+interface Props {
+ className?: string;
+ index: number;
+ size?: number;
+}
+
+const COLORS = [theme.blue, theme.darkBlue, '#24c6e0'];
+
+export default function ChartLegendIcon({ className, index, size }: Props) {
+ const fill = COLORS[index] || COLORS[0];
return (
<Icon className={className} size={size}>
<path
}
return (
<PreviewGraphTooltipsContent
+ index={idx}
key={serie.name}
- style={idx.toString()}
translatedName={serie.translatedName}
value={this.props.formatValue(point.y)}
/>
import ChartLegendIcon from '../icons-components/ChartLegendIcon';
interface Props {
- style: string;
+ index: number;
translatedName: string;
value: string;
}
-export default function PreviewGraphTooltipsContent({ style, translatedName, value }: Props) {
+export default function PreviewGraphTooltipsContent({ index, translatedName, value }: Props) {
return (
<tr className="overview-analysis-graph-tooltip-line">
<td className="thin">
- <ChartLegendIcon
- className={'little-spacer-right line-chart-legend line-chart-legend-' + style}
- />
+ <ChartLegendIcon className="little-spacer-right" index={index} />
</td>
<td className="overview-analysis-graph-tooltip-value text-right little-spacer-right thin">
{value}
import PreviewGraphTooltipsContent from '../PreviewGraphTooltipsContent';
const DEFAULT_PROPS = {
- style: '1',
+ index: 1,
translatedName: 'Code Smells',
value: '1.2k'
};
>
<tbody>
<PreviewGraphTooltipsContent
+ index={0}
key="code_smells"
- style="0"
translatedName="Code Smells"
value="Formated.15"
/>
<PreviewGraphTooltipsContent
+ index={1}
key="bugs"
- style="1"
translatedName="Bugs"
value="Formated.0"
/>
<PreviewGraphTooltipsContent
+ index={2}
key="vulnerabilities"
- style="2"
translatedName="Vulnerabilities"
value="Formated.1"
/>
className="thin"
>
<ChartLegendIcon
- className="little-spacer-right line-chart-legend line-chart-legend-1"
+ className="little-spacer-right"
+ index={1}
/>
</td>
<td
projects / sonarqube.git / commitdiff