From 9f1aafa628e4c6632039367416574152c49f9dfc Mon Sep 17 00:00:00 2001
From: Ville Brofeldt <33317356+villebro@users.noreply.github.com>
Date: Wed, 26 Aug 2020 09:02:38 +0300
Subject: [PATCH] feat(color): add official ECharts color schemes (#751)

* feat(color): add echarts colors

* rename categorical schemes
---
 .../src/colorSchemes/categorical/echarts.ts   | 38 +++++++++++++++++++
 .../src/colorSchemes/sequential/common.ts     |  6 +++
 .../test/colorSchemes.test.ts                 |  2 +
 .../ColorPallettesStories.jsx                 |  2 +
 4 files changed, 48 insertions(+)
 create mode 100644 superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/categorical/echarts.ts

diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/categorical/echarts.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/categorical/echarts.ts
new file mode 100644
index 000000000000..1aada39a1d71
--- /dev/null
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/categorical/echarts.ts
@@ -0,0 +1,38 @@
+import CategoricalScheme from '../../CategoricalScheme';
+
+const schemes = [
+  {
+    id: 'echarts4Colors',
+    label: 'ECharts v4.x Colors',
+    colors: [
+      '#c23531',
+      '#2f4554',
+      '#61a0a8',
+      '#d48265',
+      '#91c7ae',
+      '#749f83',
+      '#ca8622',
+      '#bda29a',
+      '#6e7074',
+      '#546570',
+      '#c4ccd3',
+    ],
+  },
+  {
+    id: 'echarts5Colors',
+    label: 'ECharts v5.x Colors',
+    colors: [
+      '#5470C6',
+      '#91CC75',
+      '#FAC858',
+      '#EE6666',
+      '#73C0DE',
+      '#3BA272',
+      '#FC8452',
+      '#9A60B4',
+      '#EA7CCC',
+    ],
+  },
+].map(s => new CategoricalScheme(s));
+
+export default schemes;
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/sequential/common.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/sequential/common.ts
index 9c23ba559ff8..d0a144c195a5 100644
--- a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/sequential/common.ts
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/src/colorSchemes/sequential/common.ts
@@ -193,6 +193,12 @@ const schemes = [
       '#3AA3B2',
     ],
   },
+  {
+    id: 'echarts_gradient',
+    label: 'ECharts gradient',
+    isDiverging: false,
+    colors: ['#f6EFA6', '#D88273', '#BF444C'],
+  },
 ].map(s => new SequentialScheme(s));
 
 export default schemes;
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/test/colorSchemes.test.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/test/colorSchemes.test.ts
index f4c07a90251b..76766461c7df 100644
--- a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/test/colorSchemes.test.ts
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-color/test/colorSchemes.test.ts
@@ -1,4 +1,5 @@
 import categoricalAirbnb from '../src/colorSchemes/categorical/airbnb';
+import categoricalEcharts from '../src/colorSchemes/categorical/echarts';
 import categoricalSuperset from '../src/colorSchemes/categorical/superset';
 import categoricalPreset from '../src/colorSchemes/categorical/preset';
 import categoricalD3 from '../src/colorSchemes/categorical/d3';
@@ -14,6 +15,7 @@ describe('Color Schemes', () => {
     it('returns an array of CategoricalScheme', () => {
       [
         categoricalAirbnb,
+        categoricalEcharts,
         categoricalD3,
         categoricalGoogle,
         categoricalLyft,
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-demo/storybook/stories/superset-ui-color/ColorPallettesStories.jsx b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-demo/storybook/stories/superset-ui-color/ColorPallettesStories.jsx
index 3d68f67cb97e..9948c8669f5f 100644
--- a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-demo/storybook/stories/superset-ui-color/ColorPallettesStories.jsx
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-demo/storybook/stories/superset-ui-color/ColorPallettesStories.jsx
@@ -2,6 +2,7 @@ import React from 'react';
 
 import AirbnbPalettes from '@superset-ui/color/src/colorSchemes/categorical/airbnb';
 import D3Palettes from '@superset-ui/color/src/colorSchemes/categorical/d3';
+import EchartsPalettes from '@superset-ui/color/src/colorSchemes/categorical/echarts';
 import GooglePalettes from '@superset-ui/color/src/colorSchemes/categorical/google';
 import LyftPalettes from '@superset-ui/color/src/colorSchemes/categorical/lyft';
 import PresetPalettes from '@superset-ui/color/src/colorSchemes/categorical/preset';
@@ -21,6 +22,7 @@ export const categoricalPalettes = () =>
     { palettes: SupersetPalettes, storyName: 'Superset' },
     { palettes: AirbnbPalettes, storyName: 'Airbnb' },
     { palettes: D3Palettes, storyName: 'd3' },
+    { palettes: EchartsPalettes, storyName: 'ECharts' },
     { palettes: GooglePalettes, storyName: 'Google' },
     { palettes: LyftPalettes, storyName: 'Lyft' },
     { palettes: PresetPalettes, storyName: 'Preset' },