Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
import * as _ from 'lodash';
import * as React from 'react';
import { ChartDonut } from '@patternfly/react-charts';
import {
/* eslint-disable camelcase */
chart_color_blue_100 as blue100,
chart_color_blue_200 as blue200,
chart_color_blue_300 as blue300,
/* eslint-enable camelcase */
} from '@patternfly/react-tokens';
import { useRefWidth } from '@console/internal/components/utils';
import { Descriptor } from '../types';
const colorScale = [blue300.value, blue200.value, blue100.value];
export const PodStatusChart: React.SFC = ({ statuses, statusDescriptor }) => {
const [ref, width] = useRefWidth();
const data = _.map(statuses, (podList, status) => {
const x = status;
const y = podList.length;
return {
label: `${y} ${x}`,
x,
y,
};
});
const total = data.reduce((sum, dataPoint) => sum + dataPoint.y, 0);
return (
<div></div>chart_color_orange_200,
chart_color_orange_300,
chart_color_orange_400,
chart_color_orange_500,
chart_color_black_100,
chart_color_black_200,
chart_color_black_300,
chart_color_black_400,
chart_color_black_500
} from '@patternfly/react-tokens';
import { ColorTheme } from '../color-theme';
// The color order below improves the color contrast in unordered charts; area & line
// See https://github.com/patternfly/patternfly-next/issues/1551
const COLOR_SCALE = [
chart_color_blue_300.value,
chart_color_gold_300.value,
chart_color_green_300.value,
chart_color_purple_300.value,
chart_color_orange_300.value,
chart_color_cyan_300.value,
chart_color_black_300.value,
chart_color_blue_100.value,
chart_color_gold_500.value,
chart_color_green_100.value,
chart_color_purple_500.value,
chart_color_orange_100.value,
chart_color_cyan_500.value,
chart_color_black_100.value,
chart_color_blue_500.value,
chart_color_gold_100.value,
chart_color_green_500.value,/* eslint-disable camelcase */
import {
chart_color_blue_100,
chart_color_blue_200,
chart_color_blue_300,
chart_color_blue_400,
chart_color_blue_500
} from '@patternfly/react-tokens';
import { ColorTheme } from '../color-theme';
// Color scale
// See https://docs.google.com/document/d/1cw10pJFXWruB1SA8TQwituxn5Ss6KpxYPCOYGrH8qAY/edit
const COLOR_SCALE = [
chart_color_blue_300.value,
chart_color_blue_100.value,
chart_color_blue_500.value,
chart_color_blue_200.value,
chart_color_blue_400.value
];
export const LightBlueColorTheme = ColorTheme({
COLOR_SCALE
});/* eslint-disable camelcase */
import {
chart_color_blue_100,
chart_color_blue_200,
chart_color_blue_300,
chart_color_blue_400,
chart_color_blue_500
} from '@patternfly/react-tokens';
import { ColorTheme } from '../color-theme';
// Color scale
// See https://docs.google.com/document/d/1cw10pJFXWruB1SA8TQwituxn5Ss6KpxYPCOYGrH8qAY/edit
const COLOR_SCALE = [
chart_color_blue_300.value,
chart_color_blue_100.value,
chart_color_blue_500.value,
chart_color_blue_200.value,
chart_color_blue_400.value
];
export const DarkBlueColorTheme = ColorTheme({
COLOR_SCALE
});chart_color_orange_200,
chart_color_orange_300,
chart_color_orange_400,
chart_color_orange_500,
chart_color_black_100,
chart_color_black_200,
chart_color_black_300,
chart_color_black_400,
chart_color_black_500
} from '@patternfly/react-tokens';
import { ColorTheme } from '../color-theme';
// The color order below improves the color contrast in unordered charts; area & line
// See https://github.com/patternfly/patternfly-next/issues/1551
const COLOR_SCALE = [
chart_color_blue_300.value,
chart_color_gold_300.value,
chart_color_green_300.value,
chart_color_purple_300.value,
chart_color_orange_300.value,
chart_color_cyan_300.value,
chart_color_black_300.value,
chart_color_blue_100.value,
chart_color_gold_500.value,
chart_color_green_100.value,
chart_color_purple_500.value,
chart_color_orange_100.value,
chart_color_cyan_500.value,
chart_color_black_100.value,
chart_color_blue_500.value,
chart_color_gold_100.value,
chart_color_green_500.value,