binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WIKI-714] fix: close drag handle dropdown when any key is pressed #8040

Browse source
This commit is contained in:
Vipin Chaudhary 2025-11-06 18:58:23 +05:30 • committed by GitHub
parent 7178627f6a
commit c719d67f71
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 24 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

13
packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx
View file

@ -12,7 +12,7 @@ import {
} from "@floating-ui/react";
import type { Editor } from "@tiptap/core";
import { Ellipsis } from "lucide-react";
import { useCallback, useState } from "react";
import { useCallback, useEffect, useState } from "react";
// plane imports
import { cn } from "@plane/utils";
// constants
@ -78,6 +78,17 @@ export const ColumnDragHandle: React.FC<ColumnDragHandleProps> = (props) => {
const role = useRole(context);
const { getReferenceProps, getFloatingProps } = useInteractions([dismiss, click, role]);
useEffect(() => {
if (!isDropdownOpen) return;
const handleKeyDown = (event: KeyboardEvent) => {
context.onOpenChange(false);
event.preventDefault();
event.stopPropagation();
};
document.addEventListener("keydown", handleKeyDown);
return () => document.removeEventListener("keydown", handleKeyDown);
}, [isDropdownOpen, context]);
const handleMouseDown = useCallback(
(e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();

13
packages/editor/src/core/extensions/table/plugins/drag-handles/row/drag-handle.tsx
View file

@ -12,7 +12,7 @@ import {
} from "@floating-ui/react";
import type { Editor } from "@tiptap/core";
import { Ellipsis } from "lucide-react";
import { useCallback, useState } from "react";
import { useCallback, useEffect, useState } from "react";
// plane imports
import { cn } from "@plane/utils";
// constants
@ -78,6 +78,17 @@ export const RowDragHandle: React.FC<RowDragHandleProps> = (props) => {
const role = useRole(context);
const { getReferenceProps, getFloatingProps } = useInteractions([dismiss, click, role]);
useEffect(() => {
if (!isDropdownOpen) return;
const handleKeyDown = (event: KeyboardEvent) => {
context.onOpenChange(false);
event.preventDefault();
event.stopPropagation();
};
document.addEventListener("keydown", handleKeyDown);
return () => document.removeEventListener("keydown", handleKeyDown);
}, [isDropdownOpen, context]);
const handleMouseDown = useCallback(
(e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();