From 90367c1c3c7d8d0f68a7565fc9a6bb3d1b8f238f Mon Sep 17 00:00:00 2001
From: Patrick Browne <pt.browne@gmail.com>
Date: Thu, 16 May 2024 14:18:30 +0200
Subject: [PATCH] refactor: Use only one provider

---
 app/components/chart-published.tsx | 116 +++++++++++++++--------------
 1 file changed, 60 insertions(+), 56 deletions(-)

diff --git a/app/components/chart-published.tsx b/app/components/chart-published.tsx
index 1b2afeb07..489b7d374 100644
--- a/app/components/chart-published.tsx
+++ b/app/components/chart-published.tsx
@@ -82,66 +82,70 @@ export const ChartPublished = (props: ChartPublishedProps) => {
     [configKey, dataSource, state]
   );
 
-  return state.layout.type === "dashboard" ? (
+  return (
     <InteractiveFiltersProvider chartConfigs={state.chartConfigs}>
-      <Box
-        sx={{
-          mb:
-            state.layout.meta.title[locale] ||
-            state.layout.meta.description[locale]
-              ? 4
-              : 0,
-        }}
-      >
-        {state.layout.meta.title[locale] && (
-          <Title text={state.layout.meta.title[locale]} />
-        )}
-        {state.layout.meta.description[locale] && (
-          <Description text={state.layout.meta.description[locale]} />
-        )}
-      </Box>
-      {state.layout.layout === "tall" ? (
-        <ChartPanelLayoutTall
-          chartConfigs={state.chartConfigs}
-          renderChart={renderChart}
-        />
+      {state.layout.type === "dashboard" ? (
+        <>
+          <Box
+            sx={{
+              mb:
+                state.layout.meta.title[locale] ||
+                state.layout.meta.description[locale]
+                  ? 4
+                  : 0,
+            }}
+          >
+            {state.layout.meta.title[locale] && (
+              <Title text={state.layout.meta.title[locale]} />
+            )}
+            {state.layout.meta.description[locale] && (
+              <Description text={state.layout.meta.description[locale]} />
+            )}
+          </Box>
+          {state.layout.layout === "tall" ? (
+            <ChartPanelLayoutTall
+              chartConfigs={state.chartConfigs}
+              renderChart={renderChart}
+            />
+          ) : (
+            <ChartPanelLayoutVertical
+              chartConfigs={state.chartConfigs}
+              renderChart={renderChart}
+            />
+          )}
+        </>
       ) : (
-        <ChartPanelLayoutVertical
-          chartConfigs={state.chartConfigs}
-          renderChart={renderChart}
-        />
+        <>
+          <Flex
+            sx={{
+              flexDirection: "column",
+              mb:
+                state.layout.meta.title[locale] ||
+                state.layout.meta.description[locale]
+                  ? 4
+                  : 0,
+            }}
+          >
+            {state.layout.meta.title[locale] && (
+              <Title text={state.layout.meta.title[locale]} />
+            )}
+            {state.layout.meta.description[locale] && (
+              <Description text={state.layout.meta.description[locale]} />
+            )}
+          </Flex>
+          <ChartTablePreviewProvider>
+            <ChartWrapper layoutType={state.layout.type}>
+              <ChartPublishedInner
+                dataSource={dataSource}
+                state={state}
+                chartConfig={getChartConfig(state)}
+                configKey={configKey}
+              />
+            </ChartWrapper>
+          </ChartTablePreviewProvider>
+        </>
       )}
     </InteractiveFiltersProvider>
-  ) : (
-    <InteractiveFiltersProvider chartConfigs={state.chartConfigs}>
-      <Flex
-        sx={{
-          flexDirection: "column",
-          mb:
-            state.layout.meta.title[locale] ||
-            state.layout.meta.description[locale]
-              ? 4
-              : 0,
-        }}
-      >
-        {state.layout.meta.title[locale] && (
-          <Title text={state.layout.meta.title[locale]} />
-        )}
-        {state.layout.meta.description[locale] && (
-          <Description text={state.layout.meta.description[locale]} />
-        )}
-      </Flex>
-      <ChartTablePreviewProvider>
-        <ChartWrapper layoutType={state.layout.type}>
-          <ChartPublishedInner
-            dataSource={dataSource}
-            state={state}
-            chartConfig={getChartConfig(state)}
-            configKey={configKey}
-          />
-        </ChartWrapper>
-      </ChartTablePreviewProvider>
-    </InteractiveFiltersProvider>
   );
 };