Feature/cldn 1748

cccs-build/superset/Dockerfile

@@ -1,7 +1,7 @@
 # Vault CA container import
 ARG VAULT_CA_CONTAINER=uchimera.azurecr.io/cccs/hogwarts/vault-ca:master_2921_22315d60
 FROM $VAULT_CA_CONTAINER AS vault_ca
-FROM uchimera.azurecr.io/cccs/superset-base:cccs-2.0_20221014182839_b5135
+FROM uchimera.azurecr.io/cccs/superset-base:feature_CLDN-1748_20230202182346_b6134
 
 
 

superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/CccsGrid.tsx

@@ -53,6 +53,7 @@ import '@ag-grid-community/core/dist/styles/ag-grid.css';
 import '@ag-grid-community/core/dist/styles/ag-theme-balham.css';
 
 import { PAGE_SIZE_OPTIONS } from './plugin/controlPanel';
+import rison from 'rison';
 
 const DEFAULT_COLUMN_DEF = {
   editable: false,
@@ -81,14 +82,18 @@ export default function CccsGrid({
   enable_grouping = false,
   column_state,
   filters: initialFilters = {},
+  datasetColumns,
+  jumpActionConfigs,
 }: CccsGridTransformedProps) {
   LicenseManager.setLicenseKey(agGridLicenseKey);
   const dispatch = useDispatch();
   const crossFilterValue = useSelector<RootState, any>(
     state => state.dataMask[formData.slice_id]?.filterState?.value,
   );
+
+  const [selectedDataByColumnName, setSelectedDataColumnName] = useState<{[key: string]: string[] }>(initialFilters);
+  const [selectedDataByAdvancedType, setselectedDataByAdvancedType] = useState<{[key: string]: string[]}>(initialFilters);
 
-  const [filters, setFilters] = useState(initialFilters);
   const [principalColumnFilters, setPrincipalColumnFilters] = useState({});
   const [searchValue, setSearchValue] = useState('');
   const [pageSize, setPageSize] = useState<number>(page_length);
@@ -100,7 +105,6 @@ export default function CccsGrid({
       if (!emitFilter) {
         return;
       }
-
       const groupBy = Object.keys(filters);
       const groupByValues = Object.values(filters);
       setDataMask({
@@ -127,57 +131,131 @@ export default function CccsGrid({
         },
       });
     },
-    [emitFilter, setDataMask, filters, principalColumnFilters],
+    [emitFilter, setDataMask, selectedDataByColumnName, principalColumnFilters],
   ); // only take relevant page size options
 
+  const generateNativeFilterUrlString = (nativefilterID: string, urlSelectedData: any[], column: string = "" ) =>{
+    const stringSelectedData = urlSelectedData.map( e => {
+      return `${e.toString()}`
+    }) 
+    const navtiveFilter = {
+      extraFormData: {
+        filters: [
+          {col: column,
+          op: "IN",
+          val: stringSelectedData}
+        ]
+      },
+      filterState: {
+        label: stringSelectedData,
+        validateStatus: false,
+        value: stringSelectedData
+      },
+      id: nativefilterID,
+      ownState: {}
+    }
+   return navtiveFilter
+  } 
+  const getJumpToDashboardContextMenuItems = (selectedData: {[key: string]: string[] }, disableOveride: boolean): (string | MenuItemDef)[] => {
+
+    let sub_menu: any = []
+    for (let key in jumpActionConfigs) {
+
+      let advancedDataTypeNativeFilters = jumpActionConfigs[key];
+      let nativeFilterUrls: any = {};
+      let jumpActionName: string = ""
+      advancedDataTypeNativeFilters.forEach((element: any) => {
+        jumpActionName = element.name
+        let advancedDataType = element['advancedDataType'];
+        let nativefilters: any[] = element["nativefilters"];
+        let selectedDataForUrl = selectedData[advancedDataType];
+
+        if (selectedDataForUrl && nativefilters) {
+          nativefilters.forEach( filter => {
+            nativeFilterUrls[filter["value"]] =  generateNativeFilterUrlString(filter["value"], selectedDataForUrl, filter["column"])
+          });
+        }
+
+      });
+
+      if (Object.keys(nativeFilterUrls).length !== 0){
+
+        let action = () => {
+          let baseUrl =  location.protocol + '//' + location.host;
+          let url = `${baseUrl}/superset/dashboard/${key}/?native_filters=${rison.encode(nativeFilterUrls)}`
+          window.open(url, '_blank');
+        }
+
+        let DashboardMenuItem = {
+          name: jumpActionName,
+          action
+        }
+
+        sub_menu.push(DashboardMenuItem) 
+      }
+
+    }
+
+    const menu = {name: "Jump to dashboard", subMenu: sub_menu, disabled: disableOveride || sub_menu.length < 1, icon: '<span class="ag-icon ag-icon-pivot" unselectable="on" role="presentation"></span>' }  
+    return [ menu ]
+  }
+
   const getContextMenuItems = useCallback(
     (params: GetContextMenuItemsParams): (string | MenuItemDef)[] => {
+
       let result: (string | MenuItemDef)[] = [];
-      if (!emitFilter) {
-        result = ['copy', 'copyWithHeaders', 'paste', 'separator', 'export'];
-      } else {
-        result = [
-          'copy',
-          'copyWithHeaders',
-          'paste',
-          'separator',
-          {
-            name: 'Emit Filter(s)',
-            disabled: params.value === null,
-            action: () => handleChange(filters),
-            // eslint-disable-next-line theme-colors/no-literal-colors
-            icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" class=""><path fill-rule="evenodd" clip-rule="evenodd" d="M18.1573 17.864C21.2763 14.745 21.2763 9.66935 18.1573 6.5503C15.0382 3.43125 9.96264 3.43125 6.84359 6.5503L5.42938 5.13609C9.32836 1.2371 15.6725 1.2371 19.5715 5.13609C23.4705 9.03507 23.4705 15.3792 19.5715 19.2782C15.6725 23.1772 9.32836 23.1772 5.42938 19.2782L6.84359 17.864C9.96264 20.9831 15.0375 20.9838 18.1573 17.864ZM2.00035 11.5C2.00035 11.2239 2.2242 11 2.50035 11H5.00035L5.00035 10C5.00035 9.58798 5.47073 9.35279 5.80035 9.60001L9.00035 12C9.17125 12.1032 6.98685 13.637 5.77613 14.4703C5.44613 14.6975 5.00035 14.4601 5.00035 14.0595V13L2.50035 13C2.22421 13 2.00035 12.7761 2.00035 12.5L2.00035 11.5ZM9.67202 9.37873C11.2319 7.81885 13.7697 7.81956 15.3289 9.37873C16.888 10.9379 16.8887 13.4757 15.3289 15.0356C13.769 16.5955 11.2312 16.5948 9.67202 15.0356L8.2578 16.4498C10.5976 18.7896 14.4033 18.7896 16.7431 16.4498C19.0829 14.11 19.0829 10.3043 16.7431 7.96451C14.4033 5.6247 10.5976 5.6247 8.2578 7.96451L9.67202 9.37873Z" fill="#20A7C9"></path></svg>',
-          },
-          {
-            name: 'Emit Principal Column Filter(s)',
-            disabled:
-              ensureIsArray(principalColumns).length === 0 ||
-              Object.keys(principalColumnFilters).some(column =>
-                principalColumnFilters[column].some((val: any) => val === null),
-              ) ||
-              params.node === null,
-            action: () => handleChange(principalColumnFilters),
-            // eslint-disable-next-line theme-colors/no-literal-colors
-            icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" class=""><path fill-rule="evenodd" clip-rule="evenodd" d="M18.1573 17.864C21.2763 14.745 21.2763 9.66935 18.1573 6.5503C15.0382 3.43125 9.96264 3.43125 6.84359 6.5503L5.42938 5.13609C9.32836 1.2371 15.6725 1.2371 19.5715 5.13609C23.4705 9.03507 23.4705 15.3792 19.5715 19.2782C15.6725 23.1772 9.32836 23.1772 5.42938 19.2782L6.84359 17.864C9.96264 20.9831 15.0375 20.9838 18.1573 17.864ZM2.00035 11.5C2.00035 11.2239 2.2242 11 2.50035 11H5.00035L5.00035 10C5.00035 9.58798 5.47073 9.35279 5.80035 9.60001L9.00035 12C9.17125 12.1032 6.98685 13.637 5.77613 14.4703C5.44613 14.6975 5.00035 14.4601 5.00035 14.0595V13L2.50035 13C2.22421 13 2.00035 12.7761 2.00035 12.5L2.00035 11.5ZM9.67202 9.37873C11.2319 7.81885 13.7697 7.81956 15.3289 9.37873C16.888 10.9379 16.8887 13.4757 15.3289 15.0356C13.769 16.5955 11.2312 16.5948 9.67202 15.0356L8.2578 16.4498C10.5976 18.7896 14.4033 18.7896 16.7431 16.4498C19.0829 14.11 19.0829 10.3043 16.7431 7.96451C14.4033 5.6247 10.5976 5.6247 8.2578 7.96451L9.67202 9.37873Z" fill="#20A7C9"></path></svg>',
-          },
-          {
-            name: 'Clear Emitted Filter(s)',
-            disabled: crossFilterValue === undefined,
-            action: () => dispatch(clearDataMask(formData.slice_id)),
-            icon: '<span class="ag-icon ag-icon-cross" unselectable="on" role="presentation"></span>',
-          },
+      result = ['copy', 'copyWithHeaders', 'paste',];
+
+      if(emitFilter) {
+        result = result.concat(
+            [
+              'separator',
+              {
+                name: 'Emit Filter(s)',
+                disabled: params.value === null,
+                action: () => handleChange(selectedDataByColumnName),
+                // eslint-disable-next-line theme-colors/no-literal-colors
+                icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" class=""><path fill-rule="evenodd" clip-rule="evenodd" d="M18.1573 17.864C21.2763 14.745 21.2763 9.66935 18.1573 6.5503C15.0382 3.43125 9.96264 3.43125 6.84359 6.5503L5.42938 5.13609C9.32836 1.2371 15.6725 1.2371 19.5715 5.13609C23.4705 9.03507 23.4705 15.3792 19.5715 19.2782C15.6725 23.1772 9.32836 23.1772 5.42938 19.2782L6.84359 17.864C9.96264 20.9831 15.0375 20.9838 18.1573 17.864ZM2.00035 11.5C2.00035 11.2239 2.2242 11 2.50035 11H5.00035L5.00035 10C5.00035 9.58798 5.47073 9.35279 5.80035 9.60001L9.00035 12C9.17125 12.1032 6.98685 13.637 5.77613 14.4703C5.44613 14.6975 5.00035 14.4601 5.00035 14.0595V13L2.50035 13C2.22421 13 2.00035 12.7761 2.00035 12.5L2.00035 11.5ZM9.67202 9.37873C11.2319 7.81885 13.7697 7.81956 15.3289 9.37873C16.888 10.9379 16.8887 13.4757 15.3289 15.0356C13.769 16.5955 11.2312 16.5948 9.67202 15.0356L8.2578 16.4498C10.5976 18.7896 14.4033 18.7896 16.7431 16.4498C19.0829 14.11 19.0829 10.3043 16.7431 7.96451C14.4033 5.6247 10.5976 5.6247 8.2578 7.96451L9.67202 9.37873Z" fill="#20A7C9"></path></svg>',
+              },
+              {
+                name: 'Emit Principal Column Filter(s)',
+                disabled:
+                  ensureIsArray(principalColumns).length === 0 ||
+                  Object.keys(principalColumnFilters).some(column =>
+                    principalColumnFilters[column].some((val: any) => val === null),
+                  ) ||
+                  params.node === null,
+                action: () => handleChange(principalColumnFilters),
+                // eslint-disable-next-line theme-colors/no-literal-colors
+                icon: '<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" class=""><path fill-rule="evenodd" clip-rule="evenodd" d="M18.1573 17.864C21.2763 14.745 21.2763 9.66935 18.1573 6.5503C15.0382 3.43125 9.96264 3.43125 6.84359 6.5503L5.42938 5.13609C9.32836 1.2371 15.6725 1.2371 19.5715 5.13609C23.4705 9.03507 23.4705 15.3792 19.5715 19.2782C15.6725 23.1772 9.32836 23.1772 5.42938 19.2782L6.84359 17.864C9.96264 20.9831 15.0375 20.9838 18.1573 17.864ZM2.00035 11.5C2.00035 11.2239 2.2242 11 2.50035 11H5.00035L5.00035 10C5.00035 9.58798 5.47073 9.35279 5.80035 9.60001L9.00035 12C9.17125 12.1032 6.98685 13.637 5.77613 14.4703C5.44613 14.6975 5.00035 14.4601 5.00035 14.0595V13L2.50035 13C2.22421 13 2.00035 12.7761 2.00035 12.5L2.00035 11.5ZM9.67202 9.37873C11.2319 7.81885 13.7697 7.81956 15.3289 9.37873C16.888 10.9379 16.8887 13.4757 15.3289 15.0356C13.769 16.5955 11.2312 16.5948 9.67202 15.0356L8.2578 16.4498C10.5976 18.7896 14.4033 18.7896 16.7431 16.4498C19.0829 14.11 19.0829 10.3043 16.7431 7.96451C14.4033 5.6247 10.5976 5.6247 8.2578 7.96451L9.67202 9.37873Z" fill="#20A7C9"></path></svg>',
+              },
+              {
+                name: 'Clear Emitted Filter(s)',
+                disabled: crossFilterValue === undefined,
+                action: () => dispatch(clearDataMask(formData.slice_id)),
+                icon: '<span class="ag-icon ag-icon-cross" unselectable="on" role="presentation"></span>',
+              },
+            ]
+        )
+      } 
+      result = result.concat(
+        getJumpToDashboardContextMenuItems(selectedDataByAdvancedType, (params.value === null))
+      )
+      result = result.concat(
+        [
           'separator',
-          'export',
-        ];
-      }
+          'export'
+        ]
+      )
+
       return result;
     },
     [
       emitFilter,
+      selectedDataByColumnName,
       principalColumns,
       crossFilterValue,
       handleChange,
-      filters,
       principalColumnFilters,
       dispatch,
       formData.slice_id,
@@ -220,26 +298,51 @@ export default function CccsGrid({
 
     const gridApi = params.api;
     const cellRanges = gridApi.getCellRanges();
-
-    const updatedFilters = {};
+
+    const updatedSelectedData: {[key: string]: string[] } = {};
+    const newSelectedbyAdvancedType: {[key: string]: string[] } = {};
     const updatedPrincipalColumnFilters = {};
 
+
     cellRanges.forEach((range: any) => {
       range.columns.forEach((column: any) => {
         const col = getEmitTarget(column.colDef?.field);
-        updatedFilters[col] = updatedFilters[col] || [];
+        let advancedDataType = datasetColumns.find( (column)  => { return column.column_name == col })?.advanced_data_type || ""
+
+
+        updatedSelectedData[col] = updatedSelectedData[col] || [];
+
+        newSelectedbyAdvancedType[advancedDataType] = newSelectedbyAdvancedType[advancedDataType]  || []
+
         const startRow = Math.min(
           range.startRow.rowIndex,
           range.endRow.rowIndex,
         );
+
         const endRow = Math.max(range.startRow.rowIndex, range.endRow.rowIndex);
-        for (let rowIndex = startRow; rowIndex <= endRow; rowIndex += 1) {
+        for (let rowIndex = startRow; rowIndex <= endRow; rowIndex++) {
+
+          const rowNode  = gridApi.getModel().getRow(rowIndex)
           const value = gridApi.getValue(
             column,
-            gridApi.getModel().getRow(rowIndex),
+            rowNode,
           );
-          if (!updatedFilters[col].includes(value)) {
-            updatedFilters[col].push(value);
+
+          const valueRendererName = column.colDef.cellRenderer
+          let valueRendererObjt = null
+          let renderedValue = null
+
+          if (valueRendererName) {
+            const valueRenderer = valueRendererName ? frameworkComponents[valueRendererName] : undefined
+            valueRendererObjt = new valueRenderer({value, valueFormatted: null})
+          }
+          renderedValue = valueRendererObjt ? valueRendererObjt.render() : value
+
+          if (!updatedSelectedData[col].includes(value)) {
+            updatedSelectedData[col].push(value);
+          }
+          if (!newSelectedbyAdvancedType[advancedDataType].includes(renderedValue) && renderedValue) {
+            newSelectedbyAdvancedType[advancedDataType].push(renderedValue);
           }
         }
       });
@@ -263,8 +366,8 @@ export default function CccsGrid({
         }
       });
     });
-
-    setFilters(updatedFilters);
+    setselectedDataByAdvancedType(newSelectedbyAdvancedType);
+    setSelectedDataColumnName(updatedSelectedData);
     setPrincipalColumnFilters(updatedPrincipalColumnFilters);
   };