Merge pull request #38461 from appsmithorg/chore/cherry-pick-fix

fix: Updating the click functionalities in list item component (#38453)
appsmithorg · Jan 3, 2025 · e825f5d · e825f5d
2 parents 0c65248 + 8fb677f
commit e825f5d
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 30 deletions.
diff --git a/app/client/packages/design-system/ads/src/List/List.tsx b/app/client/packages/design-system/ads/src/List/List.tsx
@@ -91,37 +91,28 @@ function ListItem(props: ListItemProps) {
   } = props;
   const isBlockDescription = descriptionType === "block";
 
-  const listItemhandleKeyDown = (e: React.KeyboardEvent) => {
-    if (!props.isDisabled && props.onClick) {
-      switch (e.key) {
-        case "Enter":
-        case " ":
-          props.onClick();
-          break;
-      }
-    }
-  };
-
   const handleOnClick = () => {
     if (!props.isDisabled && props.onClick) {
       props.onClick();
     }
   };
 
+  const handleRightControlClick = (e: React.MouseEvent) => {
+    e.stopPropagation();
+  };
+
   return (
     <StyledListItem
       className={clsx(ListItemClassName, props.className)}
       data-disabled={props.isDisabled || false}
       data-isblockdescription={isBlockDescription}
       data-rightcontrolvisibility={rightControlVisibility}
       data-selected={props.isSelected}
+      onClick={handleOnClick}
       size={size}
       tabIndex={props.isDisabled ? -1 : 0}
     >
-      <ContentTextWrapper
-        onClick={handleOnClick}
-        onKeyDown={listItemhandleKeyDown}
-      >
+      <ContentTextWrapper>
         {startIcon}
         {props.customTitleComponent ? (
           props.customTitleComponent
@@ -158,7 +149,9 @@ function ListItem(props: ListItemProps) {
         )}
       </ContentTextWrapper>
       {rightControl && (
-        <RightControlWrapper>{rightControl}</RightControlWrapper>
+        <RightControlWrapper onClick={handleRightControlClick}>
+          {rightControl}
+        </RightControlWrapper>
       )}
     </StyledListItem>
   );

diff --git a/app/client/packages/design-system/ads/src/Templates/IDEHeader/IDEHeader.stories.tsx b/app/client/packages/design-system/ads/src/Templates/IDEHeader/IDEHeader.stories.tsx
@@ -84,14 +84,10 @@ export const WithHeaderDropdown = () => {
                 {
                   title: "Page1",
                   onClick: noop,
-                  description: "",
-                  descriptionType: "inline",
                 },
                 {
                   title: "Page2",
                   onClick: noop,
-                  description: "",
-                  descriptionType: "inline",
                 },
               ]}
             />

diff --git a/app/client/src/pages/Editor/CustomWidgetBuilder/Preview/Debugger/helpDropdown.tsx b/app/client/src/pages/Editor/CustomWidgetBuilder/Preview/Debugger/helpDropdown.tsx
@@ -36,14 +36,10 @@ export default function HelpDropdown(props: DebuggerLog) {
               onClick: () => {
                 window.open(CUSTOM_WIDGET_DOC_URL, "_blank");
               },
-              description: "",
-              descriptionType: "inline",
             },
             // {
             //   startIcon: <Icon name="wand" size="md" />,
             //   title: "Troubleshoot with AI",
-            //   description: "",
-            //   descriptionType: "inline",
             //   onClick: noop,
             // },
             {
@@ -61,14 +57,10 @@ export default function HelpDropdown(props: DebuggerLog) {
                     "_blank",
                   );
               },
-              description: "",
-              descriptionType: "inline",
             },
             // {
             //   startIcon: <Icon name="support" size="md" />,
             //   title: "Appsmith Support",
-            //   description: "",
-            //   descriptionType: "inline",
             //   onClick: noop,
             // },
           ]}

diff --git a/app/client/src/pages/Editor/IDE/EditorPane/components/Group.tsx b/app/client/src/pages/Editor/IDE/EditorPane/components/Group.tsx
@@ -41,8 +41,6 @@ const Group: React.FC<GroupProps> = ({ group }) => {
     if (hasMoreItems) {
       items.push({
         title: "Load more...",
-        description: "",
-        descriptionType: "inline",
         onClick: handleLoadMore,
         className: "ds-load-more",
       });