Fix task name selection

apache · Feb 20, 2024 · 6e5b97c · 6e5b97c
1 parent 044c077
commit 6e5b97c
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 30 deletions.
diff --git a/airflow/www/static/js/dag/TaskName.tsx b/airflow/www/static/js/dag/TaskName.tsx
@@ -18,7 +18,7 @@
  */
 
 import React, { CSSProperties } from "react";
-import { Text, TextProps, useTheme } from "@chakra-ui/react";
+import { Text, TextProps, useTheme, chakra } from "@chakra-ui/react";
 import { FiChevronUp, FiArrowUpRight, FiArrowDownRight } from "react-icons/fi";
 
 interface Props extends TextProps {
@@ -39,6 +39,7 @@ const TaskName = ({
   id,
   setupTeardownType,
   isZoomedOut,
+  onClick,
   ...rest
 }: Props) => {
   const { colors } = useTheme();
@@ -51,31 +52,32 @@ const TaskName = ({
     <Text
       cursor="pointer"
       data-testid={id}
-      width="100%"
       color={colors.gray[800]}
       fontSize={isZoomedOut ? 24 : undefined}
       textAlign="justify"
       {...rest}
     >
-      {label}
-      {isMapped && " [ ]"}
-      {isGroup && (
-        <FiChevronUp
-          size={isZoomedOut ? 24 : 15}
-          strokeWidth={3}
-          style={{
-            transition: "transform 0.5s",
-            transform: `rotate(${isOpen ? 0 : 180}deg)`,
-            ...iconStyle,
-          }}
-        />
-      )}
-      {setupTeardownType === "setup" && (
-        <FiArrowUpRight size={isZoomedOut ? 24 : 15} style={iconStyle} />
-      )}
-      {setupTeardownType === "teardown" && (
-        <FiArrowDownRight size={isZoomedOut ? 24 : 15} style={iconStyle} />
-      )}
+      <chakra.span onClick={onClick}>
+        {label}
+        {isMapped && " [ ]"}
+        {isGroup && (
+          <FiChevronUp
+            size={isZoomedOut ? 24 : 15}
+            strokeWidth={3}
+            style={{
+              transition: "transform 0.5s",
+              transform: `rotate(${isOpen ? 0 : 180}deg)`,
+              ...iconStyle,
+            }}
+          />
+        )}
+        {setupTeardownType === "setup" && (
+          <FiArrowUpRight size={isZoomedOut ? 24 : 15} style={iconStyle} />
+        )}
+        {setupTeardownType === "teardown" && (
+          <FiArrowDownRight size={isZoomedOut ? 24 : 15} style={iconStyle} />
+        )}
+      </chakra.span>
     </Text>
   );
 };

diff --git a/airflow/www/static/js/dag/grid/renderTaskRows.tsx b/airflow/www/static/js/dag/grid/renderTaskRows.tsx
@@ -162,15 +162,7 @@ const Row = (props: RowProps) => {
             position="sticky"
             left={0}
             cursor="pointer"
-            onClick={(e) => {
-              // Double click to expand
-              if (e.detail === 2 && isGroup) {
-                memoizedToggle();
-              } else {
-                // Otherwise select the task row
-                onSelect({ taskId: task.id });
-              }
-            }}
+            onClick={() => onSelect({ taskId: task.id })}
             borderBottom={0}
             width="100%"
             zIndex={1}