[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:
Aaryan Khandelwal 2024-05-22 12:45:51 +05:30 committed by GitHub
parent f13c190676
commit 639d24bd5a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 204 additions and 278 deletions

View file

@ -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"