You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by ru...@apache.org on 2025/08/18 20:49:41 UTC

(superset) branch move-controls updated: Revert "refactor: Split control panel to work with existing Superset tabs"

This is an automated email from the ASF dual-hosted git repository.

rusackas pushed a commit to branch move-controls
in repository https://gitbox.apache.org/repos/asf/superset.git


The following commit(s) were added to refs/heads/move-controls by this push:
     new 2670c3e951 Revert "refactor: Split control panel to work with existing Superset tabs"
2670c3e951 is described below

commit 2670c3e951fa7772dc104361bf635055ad37ff96
Author: Evan Rusackas <ev...@rusackas.com>
AuthorDate: Mon Aug 18 13:49:23 2025 -0700

    Revert "refactor: Split control panel to work with existing Superset tabs"
    
    This reverts commit 0f60a8d57b8b3f7a003ef35a7bc4bbcbc281578f.
---
 .../src/Pie/PieControlPanelSimple.tsx              | 102 +++++++++++----------
 1 file changed, 52 insertions(+), 50 deletions(-)

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Pie/PieControlPanelSimple.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Pie/PieControlPanelSimple.tsx
index 280e13c243..8e6a1f02cf 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Pie/PieControlPanelSimple.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Pie/PieControlPanelSimple.tsx
@@ -16,8 +16,9 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { FC } from 'react';
+import { FC, useState } from 'react';
 import { t } from '@superset-ui/core';
+import { Tabs } from 'antd';
 import {
   ColorSchemeControl,
   D3_FORMAT_OPTIONS,
@@ -46,9 +47,9 @@ interface PieControlPanelProps {
 }
 
 /**
- * Data tab content - Query controls
+ * A modern React component-based control panel for Pie charts.
  */
-export const PieDataPanel: FC<PieControlPanelProps> = ({
+export const PieControlPanel: FC<PieControlPanelProps> = ({
   onChange,
   value,
   datasource,
@@ -87,7 +88,11 @@ export const PieDataPanel: FC<PieControlPanelProps> = ({
   // Get form values
   const formValues = form_data || value || {};
 
-  return (
+  // State for active tab
+  const [activeTab, setActiveTab] = useState('data');
+
+  // Data tab content
+  const dataTabContent = (
     <div>
       {/* Group by */}
       <div style={{ marginBottom: 16 }}>
@@ -195,40 +200,9 @@ export const PieDataPanel: FC<PieControlPanelProps> = ({
       </div>
     </div>
   );
-};
 
-// Mark as modern panel
-(PieDataPanel as any).isModernPanel = true;
-
-/**
- * Customize tab content - Chart customization controls
- */
-export const PieCustomizePanel: FC<PieControlPanelProps> = ({
-  onChange,
-  value,
-  datasource,
-  form_data,
-  actions,
-  controls,
-}) => {
-  // If no valid data yet, show loading state
-  if (!form_data) {
-    return <div>Loading customize panel...</div>;
-  }
-
-  // Helper to handle control changes
-  const handleChange = (field: string) => (val: any) => {
-    if (actions?.setControlValue) {
-      actions.setControlValue(field, val);
-    } else if (onChange) {
-      onChange(field, val);
-    }
-  };
-
-  // Get form values
-  const formValues = form_data || value || {};
-
-  return (
+  // Customize tab content
+  const customizeTabContent = (
     <div>
       {/* Chart Options Section */}
       <div style={{ marginBottom: 24 }}>
@@ -513,26 +487,54 @@ export const PieCustomizePanel: FC<PieControlPanelProps> = ({
       </div>
     </div>
   );
+
+  // Tab items
+  const tabItems = [
+    {
+      key: 'data',
+      label: t('Data'),
+      children: dataTabContent,
+    },
+    {
+      key: 'customize',
+      label: t('Customize'),
+      children: customizeTabContent,
+    },
+  ];
+
+  return (
+    <div style={{ padding: '16px' }}>
+      {/* Chart/Viz Type Picker */}
+      <div style={{ marginBottom: 16, padding: '12px', borderRadius: '4px' }}>
+        <div style={{ fontSize: '16px', fontWeight: 500, marginBottom: '8px' }}>
+          {t('Pie Chart')}
+        </div>
+        <div style={{ fontSize: '12px', color: '#666' }}>
+          {t('Visualize data as a pie or donut chart')}
+        </div>
+      </div>
+
+      {/* Tabs for Data and Customize */}
+      <Tabs
+        activeKey={activeTab}
+        onChange={setActiveTab}
+        items={tabItems}
+        size="large"
+      />
+    </div>
+  );
 };
 
-// Mark as modern panel
-(PieCustomizePanel as any).isModernPanel = true;
+// Mark this component as a modern panel
+(PieControlPanel as any).isModernPanel = true;
 
-// Provide the config with both panels in proper sections
+// Provide a minimal config structure to prevent errors
 const config = {
   controlPanelSections: [
-    // Data tab content
-    {
-      label: t('Query'),
-      expanded: true,
-      controlSetRows: [[PieDataPanel as any]],
-    },
-    // Customize tab content - multiple sections will all go in Customize
     {
-      label: t('Chart Options'),
+      label: null,
       expanded: true,
-      tabOverride: 'customize',
-      controlSetRows: [[PieCustomizePanel as any]],
+      controlSetRows: [[PieControlPanel as any]],
     },
   ],
   // Provide default control overrides