mirror of
https://github.com/makeplane/plane.git
synced 2026-02-24 04:00:14 +01:00
fix: insert handle performance
This commit is contained in:
@@ -331,8 +331,6 @@ export function createColumnDragHandle(config: ColumnDragHandleConfig): {
|
||||
const dropMarker = tableElement instanceof HTMLElement ? getDropMarker(tableElement) : null;
|
||||
const dragMarker = tableElement instanceof HTMLElement ? getColDragMarker(tableElement) : null;
|
||||
|
||||
console.log("Column drag markers found:", { dropMarker: !!dropMarker, dragMarker: !!dragMarker });
|
||||
|
||||
const handleFinish = (): void => {
|
||||
// Clean up markers if they exist
|
||||
if (dropMarker && dragMarker) {
|
||||
|
||||
@@ -331,8 +331,6 @@ export function createRowDragHandle(config: RowDragHandleConfig): {
|
||||
const dropMarker = tableElement instanceof HTMLElement ? getDropMarker(tableElement) : null;
|
||||
const dragMarker = tableElement instanceof HTMLElement ? getRowDragMarker(tableElement) : null;
|
||||
|
||||
console.log("Row drag markers found:", { dropMarker: !!dropMarker, dragMarker: !!dragMarker });
|
||||
|
||||
const handleFinish = (): void => {
|
||||
// Clean up markers if they exist
|
||||
if (dropMarker && dragMarker) {
|
||||
|
||||
@@ -72,6 +72,18 @@ export const TableInsertPlugin = (editor: Editor): Plugin => {
|
||||
});
|
||||
};
|
||||
|
||||
let updateScheduled = false;
|
||||
|
||||
const scheduleUpdate = () => {
|
||||
if (updateScheduled) return;
|
||||
updateScheduled = true;
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
updateScheduled = false;
|
||||
updateAllTables();
|
||||
});
|
||||
};
|
||||
|
||||
return new Plugin({
|
||||
key: TABLE_INSERT_PLUGIN_KEY,
|
||||
|
||||
@@ -80,9 +92,9 @@ export const TableInsertPlugin = (editor: Editor): Plugin => {
|
||||
|
||||
return {
|
||||
update(view, prevState) {
|
||||
// Update when document changes
|
||||
// Debounce updates using RAF to batch multiple changes
|
||||
if (!prevState.doc.eq(view.state.doc)) {
|
||||
updateAllTables();
|
||||
scheduleUpdate();
|
||||
}
|
||||
},
|
||||
destroy() {
|
||||
|
||||
@@ -219,16 +219,11 @@ export const createRowInsertButton = (editor: Editor, tableInfo: TableInfo): HTM
|
||||
|
||||
export const findAllTables = (editor: Editor): TableInfo[] => {
|
||||
const tables: TableInfo[] = [];
|
||||
const tableElements = editor.view.dom.querySelectorAll("table");
|
||||
|
||||
tableElements.forEach((tableElement) => {
|
||||
// Find the table's ProseMirror position
|
||||
let tablePos = -1;
|
||||
let tableNode: ProseMirrorNode | null = null;
|
||||
|
||||
// Walk through the document to find matching table nodes
|
||||
editor.state.doc.descendants((node, pos) => {
|
||||
if (node.type.spec.tableRole === "table") {
|
||||
// More efficient: iterate through document once instead of DOM + doc for each table
|
||||
editor.state.doc.descendants((node, pos) => {
|
||||
if (node.type.spec.tableRole === "table") {
|
||||
try {
|
||||
const domAtPos = editor.view.domAtPos(pos + 1);
|
||||
let domTable = domAtPos.node;
|
||||
|
||||
@@ -241,20 +236,17 @@ export const findAllTables = (editor: Editor): TableInfo[] => {
|
||||
domTable = domTable.parentNode;
|
||||
}
|
||||
|
||||
if (domTable === tableElement) {
|
||||
tablePos = pos;
|
||||
tableNode = node;
|
||||
return false; // Stop iteration
|
||||
if (domTable instanceof HTMLElement && domTable.tagName === "TABLE") {
|
||||
tables.push({
|
||||
tableElement: domTable,
|
||||
tableNode: node,
|
||||
tablePos: pos,
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
// Skip tables that fail to resolve
|
||||
console.error("Error finding table:", error);
|
||||
}
|
||||
});
|
||||
|
||||
if (tablePos !== -1 && tableNode) {
|
||||
tables.push({
|
||||
tableElement,
|
||||
tableNode,
|
||||
tablePos,
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user