chore(charts): modified donut threshold & utilization charts per code…

… review comments

packages/patternfly-4/react-charts/package.json

@@ -50,7 +50,8 @@
     "hoist-non-react-statics": "^3.3.0",
     "lodash": "^4.17.11",
     "victory": "^32.2.3",
-    "victory-core": "^32.2.3"
+    "victory-core": "^32.2.3",
+    "victory-legend": "^32.2.3"
   },
   "devDependencies": {
     "@babel/cli": "^7.0.0",

packages/patternfly-4/react-charts/src/components/ChartContainer/ChartContainer.js

@@ -1,17 +1,40 @@
-/* eslint-disable react/require-default-props */
+/* eslint-disable react/require-default-props,react/prop-types */
 import React from 'react';
 import PropTypes from 'prop-types';
 import hoistNonReactStatics from 'hoist-non-react-statics';
 import { VictoryContainer } from 'victory';
+import { getTheme } from '../ChartUtils/chart-theme';
 
 export const propTypes = {
   /**
    * See TypeScript API docs: https://formidable.com/open-source/victory/docs/victory-container/
    */
-  '': PropTypes.any
+  '': PropTypes.any,
+  /**
+   * Specifies the theme color. Valid values are 'blue', 'green', 'grey' (recomended), 'multi', etc.
+   *
+   * Note: Not compatible with theme prop
+   *
+   * @example themeColor={ChartThemeColor.blue}
+   */
+  themeColor: PropTypes.string,
+  /**
+   * Specifies the theme variant. Valid values are 'dark' or 'light'
+   *
+   * Note: Not compatible with theme prop
+   *
+   * @example themeVariant={ChartThemeVariant.light}
+   */
+  themeVariant: PropTypes.string
 };
 
-const ChartContainer = props => <VictoryContainer {...props} />;
+// const ChartContainer = props => <VictoryContainer {...props} />;
+const ChartContainer = ({
+  themeColor,
+  themeVariant,
+  theme = getTheme(themeColor, themeVariant), // destructure last
+  ...rest
+}) => <VictoryContainer {...rest} />;
 
 // Note: VictoryContainer.role must be hoisted
 hoistNonReactStatics(ChartContainer, VictoryContainer);