feat(dashboard): Enables pivot table download option at dashboard level (#29123)

Co-authored-by: adimyth <aditya@fnp.dev>

superset-frontend/src/dashboard/components/SliceHeader/index.tsx

@@ -142,6 +142,7 @@ const SliceHeader: FC<SliceHeaderProps> = ({
   supersetCanExplore = false,
   supersetCanShare = false,
   supersetCanCSV = false,
+  exportPivotCSV,
   exportFullCSV,
   exportFullXLSX,
   slice,
@@ -266,6 +267,7 @@ const SliceHeader: FC<SliceHeaderProps> = ({
                 logExploreChart={logExploreChart}
                 logEvent={logEvent}
                 exportCSV={exportCSV}
+                exportPivotCSV={exportPivotCSV}
                 exportFullCSV={exportFullCSV}
                 exportXLSX={exportXLSX}
                 exportFullXLSX={exportFullXLSX}

superset-frontend/src/dashboard/components/SliceHeaderControls/index.tsx

@@ -152,6 +152,7 @@ export interface SliceHeaderControlsProps {
   logEvent?: (eventName: string, eventData?: object) => void;
   toggleExpandSlice?: (sliceId: number) => void;
   exportCSV?: (sliceId: number) => void;
+  exportPivotCSV?: (sliceId: number) => void;
   exportFullCSV?: (sliceId: number) => void;
   exportXLSX?: (sliceId: number) => void;
   exportFullXLSX?: (sliceId: number) => void;
@@ -608,6 +609,10 @@ const SliceHeaderControls = (props: SliceHeaderControlsPropsWithRouter) => {
         // eslint-disable-next-line no-unused-expressions
         props.exportCSV?.(props.slice.slice_id);
         break;
+      case MenuKeys.ExportPivotCsv:
+        // eslint-disable-next-line no-unused-expressions
+        props.exportPivotCSV?.(props.slice.slice_id);
+        break;
       case MenuKeys.Fullscreen:
         props.handleToggleFullSize();
         break;
@@ -685,6 +690,7 @@ const SliceHeaderControls = (props: SliceHeaderControlsPropsWithRouter) => {
     isCached = [],
   } = props;
   const isTable = slice.viz_type === 'table';
+  const isPivotTable = slice.viz_type === 'pivot_table_v2';
   const cachedWhen = (cachedDttm || []).map(itemCachedDttm =>
     moment.utc(itemCachedDttm).fromNow(),
   );
@@ -866,6 +872,14 @@ const SliceHeaderControls = (props: SliceHeaderControlsPropsWithRouter) => {
           >
             {t('Export to .CSV')}
           </Menu.Item>
+          {isPivotTable && (
+            <Menu.Item
+              key={MenuKeys.ExportPivotCsv}
+              icon={<Icons.FileOutlined css={dropdownIconsStyles} />}
+            >
+              {t('Export to Pivoted .CSV')}
+            </Menu.Item>
+          )}
           <Menu.Item
             key={MenuKeys.ExportXlsx}
             icon={<Icons.FileOutlined css={dropdownIconsStyles} />}

superset-frontend/src/dashboard/components/gridComponents/Chart.jsx

@@ -134,6 +134,7 @@ class Chart extends Component {
     this.handleFilterMenuOpen = this.handleFilterMenuOpen.bind(this);
     this.handleFilterMenuClose = this.handleFilterMenuClose.bind(this);
     this.exportCSV = this.exportCSV.bind(this);
+    this.exportPivotCSV = this.exportPivotCSV.bind(this);
     this.exportFullCSV = this.exportFullCSV.bind(this);
     this.exportXLSX = this.exportXLSX.bind(this);
     this.exportFullXLSX = this.exportFullXLSX.bind(this);
@@ -330,6 +331,10 @@ class Chart extends Component {
     this.exportTable('csv', isFullCSV);
   }
 
+  exportPivotCSV() {
+    this.exportTable('csv', false, true);
+  }
+
   exportXLSX() {
     this.exportTable('xlsx', false);
   }
@@ -338,7 +343,7 @@ class Chart extends Component {
     this.exportTable('xlsx', true);
   }
 
-  exportTable(format, isFullCSV) {
+  exportTable(format, isFullCSV, isPivot = false) {
     const logAction =
       format === 'csv'
         ? LOG_ACTIONS_EXPORT_CSV_DASHBOARD_CHART
@@ -351,7 +356,7 @@ class Chart extends Component {
       formData: isFullCSV
         ? { ...this.props.formData, row_limit: this.props.maxRows }
         : this.props.formData,
-      resultType: 'full',
+      resultType: isPivot ? 'post_processed' : 'full',
       resultFormat: format,
       force: true,
       ownState: this.props.ownState,
@@ -444,6 +449,7 @@ class Chart extends Component {
           logEvent={logEvent}
           onExploreChart={this.onExploreChart}
           exportCSV={this.exportCSV}
+          exportPivotCSV={this.exportPivotCSV}
           exportXLSX={this.exportXLSX}
           exportFullCSV={this.exportFullCSV}
           exportFullXLSX={this.exportFullXLSX}

superset-frontend/src/dashboard/types.ts

@@ -244,6 +244,7 @@ export enum MenuKeys {
   DownloadAsImage = 'download_as_image',
   ExploreChart = 'explore_chart',
   ExportCsv = 'export_csv',
+  ExportPivotCsv = 'export_pivot_csv',
   ExportFullCsv = 'export_full_csv',
   ExportXlsx = 'export_xlsx',
   ExportFullXlsx = 'export_full_xlsx',