feat: support multiple columns with time grain in Table Chart (#21547)

superset-frontend/plugins/plugin-chart-table/src/buildQuery.ts

@@ -17,9 +17,13 @@
  * under the License.
  */
 import {
+  AdhocColumn,
   buildQueryContext,
   ensureIsArray,
+  FeatureFlag,
   getMetricLabel,
+  isFeatureEnabled,
+  isPhysicalColumn,
   QueryMode,
   QueryObject,
   removeDuplicates,
@@ -63,7 +67,7 @@ const buildQuery: BuildQuery<TableChartFormData> = (
   }
 
   return buildQueryContext(formDataCopy, baseQueryObject => {
-    let { metrics, orderby = [] } = baseQueryObject;
+    let { metrics, orderby = [], columns = [] } = baseQueryObject;
     let postProcessing: PostProcessingRule[] = [];
 
     if (queryMode === QueryMode.aggregate) {
@@ -95,6 +99,24 @@ const buildQuery: BuildQuery<TableChartFormData> = (
           },
         ];
       }
+
+      columns = columns.map(col => {
+        if (
+          isPhysicalColumn(col) &&
+          formData.time_grain_sqla &&
+          isFeatureEnabled(FeatureFlag.GENERIC_CHART_AXES) &&
+          formData?.datetime_columns_lookup?.[col]
+        ) {
+          return {
+            timeGrain: formData.time_grain_sqla,
+            columnType: 'BASE_AXIS',
+            sqlExpression: col,
+            label: col,
+            expressionType: 'SQL',
+          } as AdhocColumn;
+        }
+        return col;
+      });
     }
 
     const moreProps: Partial<QueryObject> = {};
@@ -108,6 +130,7 @@ const buildQuery: BuildQuery<TableChartFormData> = (
 
     let queryObject = {
       ...baseQueryObject,
+      columns,
       orderby,
       metrics,
       post_processing: postProcessing,