From c8cd6b9bd8ac7ff8e53d506dc9e4922061c80786 Mon Sep 17 00:00:00 2001
From: Yassine <d.yassine@hexastack.com>
Date: Mon, 24 Oct 2022 18:03:43 +0100
Subject: [PATCH] fix: rtl revert data order

---
 packages/ez-react/src/components/Chart.tsx               | 4 ++--
 packages/ez-react/src/recipes/column/ColumnChart.tsx     | 1 +
 packages/ez-react/src/recipes/column/LineColumnChart.tsx | 2 ++
 packages/ez-vue/src/components/Chart.tsx                 | 2 +-
 packages/ez-vue/src/recipes/column/ColumnChart.tsx       | 1 +
 packages/ez-vue/src/recipes/column/LineColumnChart.tsx   | 2 ++
 6 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/packages/ez-react/src/components/Chart.tsx b/packages/ez-react/src/components/Chart.tsx
index 882eb91..748ff8f 100644
--- a/packages/ez-react/src/components/Chart.tsx
+++ b/packages/ez-react/src/components/Chart.tsx
@@ -117,8 +117,8 @@ export const Chart: FC<ChartProps> = ({
 
   const chartData = useMemo(() => {
     const values = Object.values(dataDict);
-    return isRTL ? values.reverse() : values;
-  }, [dataDict, isRTL]);
+    return values;
+  }, [dataDict]);
 
   const onLegendResize = useCallback(
     ({ height }: Dimensions) => setLegendHeight(height),
diff --git a/packages/ez-react/src/recipes/column/ColumnChart.tsx b/packages/ez-react/src/recipes/column/ColumnChart.tsx
index f82a619..a77c0cb 100644
--- a/packages/ez-react/src/recipes/column/ColumnChart.tsx
+++ b/packages/ez-react/src/recipes/column/ColumnChart.tsx
@@ -91,6 +91,7 @@ export const ColumnChart: FC<ColumnChartProps> = ({
           definition: {
             direction: Direction.HORIZONTAL,
             domainKey: xAxis.domainKey,
+            reverse: isRTL,
           },
         }}
         yScaleConfig={{
diff --git a/packages/ez-react/src/recipes/column/LineColumnChart.tsx b/packages/ez-react/src/recipes/column/LineColumnChart.tsx
index a15b3ca..0614111 100644
--- a/packages/ez-react/src/recipes/column/LineColumnChart.tsx
+++ b/packages/ez-react/src/recipes/column/LineColumnChart.tsx
@@ -95,6 +95,7 @@ export const LineColumnChart: FC<LineColumnChartProps> = ({
           definition: {
             direction: Direction.HORIZONTAL,
             domainKey: xAxis.domainKey,
+            reverse: isRTL,
           },
         }}
         yScaleConfig={{
@@ -122,6 +123,7 @@ export const LineColumnChart: FC<LineColumnChartProps> = ({
           definition: {
             direction: Direction.HORIZONTAL,
             domainKey: xAxis.domainKey,
+            reverse: isRTL,
           },
         }}
         yScaleConfig={{
diff --git a/packages/ez-vue/src/components/Chart.tsx b/packages/ez-vue/src/components/Chart.tsx
index 9bf91f0..185fcc1 100644
--- a/packages/ez-vue/src/components/Chart.tsx
+++ b/packages/ez-vue/src/components/Chart.tsx
@@ -152,7 +152,7 @@ export default class Chart extends Vue {
   @Watch('chart.dataDict', { deep: true })
   onDataDictChange() {
     const data = Object.values(this.chart.dataDict);
-    this.chart.data = this.isRTL ? data.reverse() : data;
+    this.chart.data = data;
   }
 
   @Watch('isRTL')
diff --git a/packages/ez-vue/src/recipes/column/ColumnChart.tsx b/packages/ez-vue/src/recipes/column/ColumnChart.tsx
index fa242ec..8632c58 100644
--- a/packages/ez-vue/src/recipes/column/ColumnChart.tsx
+++ b/packages/ez-vue/src/recipes/column/ColumnChart.tsx
@@ -170,6 +170,7 @@ export default class ColumnChart extends mixins(ToggleDatumMixin) {
             definition: {
               direction: Direction.HORIZONTAL,
               domainKey: xAxis.domainKey,
+              reverse: isRTL,
             },
           }}
           yScaleConfig={{
diff --git a/packages/ez-vue/src/recipes/column/LineColumnChart.tsx b/packages/ez-vue/src/recipes/column/LineColumnChart.tsx
index a0bbdad..a5ff1be 100644
--- a/packages/ez-vue/src/recipes/column/LineColumnChart.tsx
+++ b/packages/ez-vue/src/recipes/column/LineColumnChart.tsx
@@ -218,6 +218,7 @@ export default class LineColumnChart extends mixins(ToggleDatumMixin) {
             definition: {
               direction: Direction.HORIZONTAL,
               domainKey: xAxis.domainKey,
+              reverse: isRTL,
             },
           }}
           yScaleConfig={{
@@ -255,6 +256,7 @@ export default class LineColumnChart extends mixins(ToggleDatumMixin) {
             definition: {
               direction: Direction.HORIZONTAL,
               domainKey: xAxis.domainKey,
+              reverse: isRTL,
             },
           }}
           yScaleConfig={{