[WEB-1262] refactor: custom hook for common dropdown logic (#4420)
* refactor: custom hook for common dropdown logic * chore: clear query for label dropdowns
This commit is contained in:
parent
f13c190676
commit
639d24bd5a
12 changed files with 204 additions and 278 deletions
|
|
@ -8,8 +8,7 @@ import { ContrastIcon } from "@plane/ui";
|
|||
import { cn } from "@/helpers/common.helper";
|
||||
// hooks
|
||||
import { useCycle } from "@/hooks/store";
|
||||
import { useDropdownKeyDown } from "@/hooks/use-dropdown-key-down";
|
||||
import useOutsideClickDetector from "@/hooks/use-outside-click-detector";
|
||||
import { useDropdown } from "@/hooks/use-dropdown";
|
||||
// local components and constants
|
||||
import { DropdownButton } from "../buttons";
|
||||
import { BUTTON_VARIANTS_WITH_TEXT } from "../constants";
|
||||
|
|
@ -57,32 +56,18 @@ export const CycleDropdown: React.FC<Props> = observer((props) => {
|
|||
|
||||
const selectedName = value ? getCycleNameById(value) : null;
|
||||
|
||||
const handleClose = () => {
|
||||
if (!isOpen) return;
|
||||
setIsOpen(false);
|
||||
onClose && onClose();
|
||||
};
|
||||
|
||||
const toggleDropdown = () => {
|
||||
setIsOpen((prevIsOpen) => !prevIsOpen);
|
||||
if (isOpen) onClose && onClose();
|
||||
};
|
||||
const { handleClose, handleKeyDown, handleOnClick } = useDropdown({
|
||||
dropdownRef,
|
||||
isOpen,
|
||||
onClose,
|
||||
setIsOpen,
|
||||
});
|
||||
|
||||
const dropdownOnChange = (val: string | null) => {
|
||||
onChange(val);
|
||||
handleClose();
|
||||
};
|
||||
|
||||
const handleKeyDown = useDropdownKeyDown(toggleDropdown, handleClose);
|
||||
|
||||
const handleOnClick = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
toggleDropdown();
|
||||
};
|
||||
|
||||
useOutsideClickDetector(dropdownRef, handleClose);
|
||||
|
||||
return (
|
||||
<Combobox
|
||||
as="div"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue