From 32b5d759c722dc621c4c539551e6e2c8ff4cc915 Mon Sep 17 00:00:00 2001
From: Lena <meowcodes@gmail.com>
Date: Wed, 20 May 2020 12:02:29 -0700
Subject: [PATCH] add enum

---
 .../DataDocChartCell/DataDocChartComposer.tsx          |  9 +++++----
 datahub/webapp/const/dataDocChart.ts                   | 10 ++++++++--
 datahub/webapp/lib/chart/chart-meta-processing.ts      |  8 +++++---
 3 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/datahub/webapp/components/DataDocChartCell/DataDocChartComposer.tsx b/datahub/webapp/components/DataDocChartCell/DataDocChartComposer.tsx
index 5d3fd6bdb..b87b8ff72 100644
--- a/datahub/webapp/components/DataDocChartCell/DataDocChartComposer.tsx
+++ b/datahub/webapp/components/DataDocChartCell/DataDocChartComposer.tsx
@@ -18,6 +18,7 @@ import {
     aggTypes,
     IChartAxisMeta,
     ChartScaleType,
+    chartValueDisplayType,
 } from 'const/dataDocChart';
 import { colorPalette, colorPaletteNames } from 'const/chartColors';
 
@@ -731,15 +732,15 @@ const DataDocChartComposerComponent: React.FunctionComponent<
                     type="react-select"
                     options={[
                         {
-                            value: 0,
+                            value: chartValueDisplayType.FALSE,
                             label: 'Hide Values',
                         },
                         {
-                            value: 1,
+                            value: chartValueDisplayType.TRUE,
                             label: 'Show Values',
                         },
                         {
-                            value: 2,
+                            value: chartValueDisplayType.AUTO,
                             label: 'Show Values without Overlap',
                         },
                     ]}
@@ -1021,7 +1022,7 @@ function formValsToMeta(vals: IChartFormValues, meta: IDataChartCellMeta) {
         draft.title = vals.title;
         draft.visual.legend_position = vals.legendPosition;
         draft.visual.values = {
-            display: vals.valueDisplay ?? 0,
+            display: vals.valueDisplay ?? chartValueDisplayType.FALSE,
             position: vals.valuePosition,
             alignment: vals.valueAlignment,
         };
diff --git a/datahub/webapp/const/dataDocChart.ts b/datahub/webapp/const/dataDocChart.ts
index bd3485aac..2224d08ca 100644
--- a/datahub/webapp/const/dataDocChart.ts
+++ b/datahub/webapp/const/dataDocChart.ts
@@ -102,10 +102,16 @@ export interface IChartChartMeta {
 
 export type ChartLegendPositionType = 'top' | 'bottom' | 'right' | 'left';
 
+export enum chartValueDisplayType {
+    FALSE = 0,
+    TRUE,
+    AUTO,
+}
+
 export interface IChartVisualMeta {
     legend_position: ChartLegendPositionType;
     values: {
-        display: number;
+        display: chartValueDisplayType;
         position: 'center' | 'start' | 'end';
         alignment:
             | 'center'
@@ -171,7 +177,7 @@ export interface IChartFormValues {
 
     title: string;
     legendPosition: 'top' | 'bottom' | 'right' | 'left';
-    valueDisplay: number;
+    valueDisplay: chartValueDisplayType;
     valuePosition: 'center' | 'start' | 'end';
     valueAlignment:
         | 'center'
diff --git a/datahub/webapp/lib/chart/chart-meta-processing.ts b/datahub/webapp/lib/chart/chart-meta-processing.ts
index 6567eaeaa..6690893bf 100644
--- a/datahub/webapp/lib/chart/chart-meta-processing.ts
+++ b/datahub/webapp/lib/chart/chart-meta-processing.ts
@@ -8,6 +8,7 @@ import {
     IChartFormValues,
     ChartScaleType,
     ChartType,
+    chartValueDisplayType,
 } from 'const/dataDocChart';
 import { fontColor, fillColor, backgroundColor } from 'const/chartColors';
 import { formatNumber } from './chart-utils';
@@ -123,7 +124,8 @@ export function mapMetaToFormVals(
         // labels
         title: meta.title || '',
         legendPosition: meta.visual.legend_position || 'top',
-        valueDisplay: meta.visual.values?.display ?? 0,
+        valueDisplay:
+            meta.visual.values?.display ?? chartValueDisplayType.FALSE,
         valuePosition: meta.visual.values?.position,
         valueAlignment: meta.visual.values?.alignment,
     };
@@ -136,9 +138,9 @@ export function mapMetaToChartOptions(
     yAxesScaleType: ChartScaleType
 ): ChartOptions {
     const valueDisplay =
-        meta.visual.values?.display === 1
+        meta.visual.values?.display === chartValueDisplayType.TRUE
             ? true
-            : meta.visual.values?.display === 2
+            : meta.visual.values?.display === chartValueDisplayType.AUTO
             ? 'auto'
             : false;
     const optionsObj: ChartOptions = {