You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by li...@apache.org on 2024/03/08 19:34:01 UTC

(superset) 03/04: update variable names

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

lilykuang pushed a commit to branch table-time-compare-hide-show
in repository https://gitbox.apache.org/repos/asf/superset.git

commit 8a1979c7680a0a3466afbf56ba7ddd677374f4d8
Author: lilykuang <ji...@gmail.com>
AuthorDate: Fri Mar 8 10:52:02 2024 -0800

    update variable names
---
 .../plugins/plugin-chart-table/src/TableChart.tsx  | 46 +++++++++++-----------
 1 file changed, 24 insertions(+), 22 deletions(-)

diff --git a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
index 39bab8b358..be27e3102c 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
@@ -265,9 +265,10 @@ export default function TableChart<D extends DataRecord = DataRecord>(
   });
   // keep track of whether column order changed, so that column widths can too
   const [columnOrderToggle, setColumnOrderToggle] = useState(false);
-  const [showTimeComparisonDropdown, setShowTimeComparisonDropdown] =
-    useState(false);
-  const [selectedKeys, setSelectedKeys] = useState([comparisonColumns[0].key]);
+  const [showComparisonDropdown, setShowComparisonDropdown] = useState(false);
+  const [selectedComparisonColumns, setSelectedComparisonColumns] = useState([
+    comparisonColumns[0].key,
+  ]);
   const [hideComparisonKeys, setHideComparisonKeys] = useState<string[]>([]);
   const theme = useTheme();
 
@@ -395,7 +396,7 @@ export default function TableChart<D extends DataRecord = DataRecord>(
     }
     const allColumns = comparisonColumns[0].key;
     const main = comparisonLabels[0];
-    const showAllColumns = selectedKeys.includes(allColumns);
+    const showAllColumns = selectedComparisonColumns.includes(allColumns);
 
     return columnsMeta.filter(({ label, key }) => {
       // Extract the key portion after the space, assuming the format is always "label key"
@@ -404,12 +405,11 @@ export default function TableChart<D extends DataRecord = DataRecord>(
       const isLableMain = label === main;
 
       return (
-        (isKeyHidded && isLableMain) ||
+        isLableMain ||
         (!isKeyHidded &&
-          (isLableMain ||
-            !comparisonLabels.includes(label) ||
+          (!comparisonLabels.includes(label) ||
             showAllColumns ||
-            selectedKeys.includes(label)))
+            selectedComparisonColumns.includes(label)))
       );
     });
   }, [
@@ -418,7 +418,7 @@ export default function TableChart<D extends DataRecord = DataRecord>(
     comparisonLabels,
     enableTimeComparison,
     hideComparisonKeys,
-    selectedKeys,
+    selectedComparisonColumns,
   ]);
 
   const handleContextMenu =
@@ -501,38 +501,38 @@ export default function TableChart<D extends DataRecord = DataRecord>(
       const { key } = data;
       // Toggle 'All' key selection
       if (key === allKey) {
-        setSelectedKeys([allKey]);
-      } else if (selectedKeys.includes(allKey)) {
-        setSelectedKeys([key]);
+        setSelectedComparisonColumns([allKey]);
+      } else if (selectedComparisonColumns.includes(allKey)) {
+        setSelectedComparisonColumns([key]);
       } else {
         // Toggle selection for other keys
-        setSelectedKeys(
-          selectedKeys.includes(key)
-            ? selectedKeys.filter(k => k !== key) // Deselect if already selected
-            : [...selectedKeys, key],
+        setSelectedComparisonColumns(
+          selectedComparisonColumns.includes(key)
+            ? selectedComparisonColumns.filter(k => k !== key) // Deselect if already selected
+            : [...selectedComparisonColumns, key],
         ); // Select if not already selected
       }
     };
 
     const handleOnBlur = () => {
-      if (selectedKeys.length === 3) {
-        setSelectedKeys([comparisonColumns[0].key]);
+      if (selectedComparisonColumns.length === 3) {
+        setSelectedComparisonColumns([comparisonColumns[0].key]);
       }
     };
 
     return (
       <Dropdown
         placement="bottomRight"
-        visible={showTimeComparisonDropdown}
+        visible={showComparisonDropdown}
         onVisibleChange={(flag: boolean) => {
-          setShowTimeComparisonDropdown(flag);
+          setShowComparisonDropdown(flag);
         }}
         overlay={
           <Menu
             multiple
             onClick={handleOnClick}
             onBlur={handleOnBlur}
-            selectedKeys={selectedKeys}
+            selectedKeys={selectedComparisonColumns}
           >
             <div
               css={css`
@@ -561,7 +561,9 @@ export default function TableChart<D extends DataRecord = DataRecord>(
                     font-size: ${theme.typography.sizes.s}px;
                   `}
                 >
-                  {selectedKeys.includes(column.key) && <CheckOutlined />}
+                  {selectedComparisonColumns.includes(column.key) && (
+                    <CheckOutlined />
+                  )}
                 </span>
               </Menu.Item>
             ))}