spacemonkd commented on code in PR #9865:
URL: https://github.com/apache/ozone/pull/9865#discussion_r2989413502


##########
hadoop-ozone/recon/src/main/resources/webapps/recon/ozone-recon-web/src/v2/components/select/multiSelect.tsx:
##########
@@ -69,6 +90,117 @@ const Option: React.FC<OptionProps<Option, true>> = (props) 
=> {
   )
 }
 
+// Intercepts react-select v3's onInputBlur, which steals focus back to its
+// hidden input whenever a child element gains focus.  While the user is
+// interacting with the search box we suppress that call so the dropdown
+// stays open.
+const CustomInput: React.FC<any> = ({ onBlur, ...inputProps }) => {
+  const ctx = React.useContext(MultiSelectCtx);
+  const handleBlur = (e: React.FocusEvent) => {
+    if (ctx?.searchInteracting.current) return;
+    if (onBlur) onBlur(e);
+  };
+  return <components.Input {...inputProps} onBlur={handleBlur} />;
+};
+
+const CustomMenuList: React.FC<any> = ({ children, ...menuListProps }) => {
+  const ctx = React.useContext(MultiSelectCtx);
+  if (!ctx) return <components.MenuList 
{...menuListProps}>{children}</components.MenuList>;
+
+  const {
+    searchTerm,
+    setSearchTerm,
+    showSearch,
+    showSelectAll,
+    selected,
+    selectableOptions,
+    onChange,
+    searchWrapperRef,
+    searchInteracting,
+    containerRef,
+    setIsMenuOpen
+  } = ctx;

Review Comment:
   Can these be extracted to it's own component?
   Seems to be useful and can be re-used later on by others.



-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to