Skip to content

Commit a3bc05f

Browse files
JayashTripathyJayashTripathy
committed
Merge branch 'preview' of https://github.com/makeplane/plane into fix/truncation-links-wis
2 parents fc620ed + 70eea50 commit a3bc05f

File tree

9 files changed

+144
-13
lines changed

9 files changed

+144
-13
lines changed

‎README.md‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ Getting started with Plane is simple. Choose the setup that works best for you:
5454

5555
## 🌟 Features
5656

57-
- **Issues**
57+
- **Work Items**
5858
Efficiently create and manage tasks with a robust rich text editor that supports file uploads. Enhance organization and tracking by adding sub-properties and referencing related issues.
5959

6060
- **Cycles**
@@ -72,15 +72,13 @@ Getting started with Plane is simple. Choose the setup that works best for you:
7272
- **Analytics**
7373
Access real-time insights across all your Plane data. Visualize trends, remove blockers, and keep your projects moving forward.
7474

75-
- **Drive** (_coming soon_): The drive helps you share documents, images, videos, or any other files that make sense to you or your team and align on the problem/solution.
76-
7775
## 🛠️ Local development
7876

7977
See [CONTRIBUTING](./CONTRIBUTING.md)
8078

8179
## ⚙️ Built with
8280

83-
[![Next JS](https://img.shields.io/badge/next.js-000000?style=for-the-badge&logo=nextdotjs&logoColor=white)](https://nextjs.org/)
81+
[![React Router](https://img.shields.io/badge/-React%20Router-CA4245?logo=react-router&style=for-the-badge&logoColor=white)](https://reactrouter.com/)
8482
[![Django](https://img.shields.io/badge/Django-092E20?style=for-the-badge&logo=django&logoColor=green)](https://www.djangoproject.com/)
8583
[![Node JS](https://img.shields.io/badge/node.js-339933?style=for-the-badge&logo=Node.js&logoColor=white)](https://nodejs.org/en)
8684

‎apps/web/core/components/dropdowns/date.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ type Props = TDropdownProps & {
3535
closeOnSelect?: boolean;
3636
formatToken?: string;
3737
renderByDefault?: boolean;
38+
labelClassName?: string;
3839
};
3940

4041
export const DateDropdown = observer(function DateDropdown(props: Props) {
@@ -62,6 +63,7 @@ export const DateDropdown = observer(function DateDropdown(props: Props) {
6263
value,
6364
formatToken,
6465
renderByDefault = true,
66+
labelClassName = "",
6567
} = props;
6668
// states
6769
const [isOpen, setIsOpen] = useState(defaultOpen);
@@ -138,7 +140,7 @@ export const DateDropdown = observer(function DateDropdown(props: Props) {
138140
>
139141
{!hideIcon && icon}
140142
{BUTTON_VARIANTS_WITH_TEXT.includes(buttonVariant) && (
141-
<span className="flex-grow truncate text-left text-body-xs-medium">
143+
<span className={cn("flex-grow truncate text-left text-body-xs-medium", labelClassName)}>
142144
{value ? renderFormattedDate(value, formatToken) : placeholder}
143145
</span>
144146
)}

‎apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import type { FC } from "react";
21
import React from "react";
32
import { observer } from "mobx-react";
43
import { useParams } from "next/navigation";
@@ -112,7 +111,7 @@ export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHea
112111
verticalAlignPosition ? `w-[44px] flex-col items-center` : `w-full flex-row items-center`
113112
}`}
114113
>
115-
<div className="flex h-4 w-4 flex-shrink-0 items-center justify-center overflow-hidden rounded-xs">
114+
<div className="flex size-5 flex-shrink-0 items-center justify-center overflow-hidden rounded-xs">
116115
{icon ? icon : <Circle width={14} strokeWidth={2} />}
117116
</div>
118117

‎apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -327,6 +327,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
327327
disabled={isReadOnly}
328328
renderByDefault={isMobile}
329329
showTooltip
330+
labelClassName="text-caption-sm-regular"
330331
/>
331332
</div>
332333
</WithDisplayPropertiesHOC>
@@ -351,6 +352,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
351352
disabled={isReadOnly}
352353
renderByDefault={isMobile}
353354
showTooltip
355+
labelClassName="text-caption-sm-regular"
354356
/>
355357
</div>
356358
</WithDisplayPropertiesHOC>

‎packages/editor/src/core/extensions/table/plugins/drag-handles/column/drag-handle.tsx‎

Lines changed: 37 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
} from "@floating-ui/react";
1313
import type { Editor } from "@tiptap/core";
1414
import { Ellipsis } from "lucide-react";
15-
import { useCallback, useEffect, useState } from "react";
15+
import { useCallback, useEffect, useRef, useState } from "react";
1616
// plane imports
1717
import { cn } from "@plane/utils";
1818
// constants
@@ -49,6 +49,25 @@ export function ColumnDragHandle(props: ColumnDragHandleProps) {
4949
const { col, editor } = props;
5050
// states
5151
const [isDropdownOpen, setIsDropdownOpen] = useState(false);
52+
// Track active event listeners for cleanup
53+
const activeListenersRef = useRef<{
54+
mouseup?: (e: MouseEvent) => void;
55+
mousemove?: (e: MouseEvent) => void;
56+
}>({});
57+
58+
// Cleanup window event listeners on unmount
59+
useEffect(() => {
60+
const listenersRef = activeListenersRef.current;
61+
return () => {
62+
// Remove any lingering window event listeners when component unmounts
63+
if (listenersRef.mouseup) {
64+
window.removeEventListener("mouseup", listenersRef.mouseup);
65+
}
66+
if (listenersRef.mousemove) {
67+
window.removeEventListener("mousemove", listenersRef.mousemove);
68+
}
69+
};
70+
}, []);
5271
// floating ui
5372
const { refs, floatingStyles, context } = useFloating({
5473
placement: "bottom-start",
@@ -94,6 +113,17 @@ export function ColumnDragHandle(props: ColumnDragHandleProps) {
94113
e.stopPropagation();
95114
e.preventDefault();
96115

116+
// Prevent multiple simultaneous drag operations
117+
// If there are already listeners attached, remove them first
118+
if (activeListenersRef.current.mouseup) {
119+
window.removeEventListener("mouseup", activeListenersRef.current.mouseup);
120+
}
121+
if (activeListenersRef.current.mousemove) {
122+
window.removeEventListener("mousemove", activeListenersRef.current.mousemove);
123+
}
124+
activeListenersRef.current.mouseup = undefined;
125+
activeListenersRef.current.mousemove = undefined;
126+
97127
const table = findTable(editor.state.selection);
98128
if (!table) return;
99129

@@ -133,6 +163,9 @@ export function ColumnDragHandle(props: ColumnDragHandleProps) {
133163
}
134164
window.removeEventListener("mouseup", handleFinish);
135165
window.removeEventListener("mousemove", handleMove);
166+
// Clear the ref
167+
activeListenersRef.current.mouseup = undefined;
168+
activeListenersRef.current.mousemove = undefined;
136169
};
137170

138171
let pseudoColumn: HTMLElement | undefined;
@@ -169,6 +202,9 @@ export function ColumnDragHandle(props: ColumnDragHandleProps) {
169202
};
170203

171204
try {
205+
// Store references for cleanup
206+
activeListenersRef.current.mouseup = handleFinish;
207+
activeListenersRef.current.mousemove = handleMove;
172208
window.addEventListener("mouseup", handleFinish);
173209
window.addEventListener("mousemove", handleMove);
174210
} catch (error) {

‎packages/editor/src/core/extensions/table/plugins/drag-handles/column/plugin.ts‎

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ type TableColumnDragHandlePluginState = {
1818
// track table structure to detect changes
1919
tableWidth?: number;
2020
tableNodePos?: number;
21+
// track renderers for cleanup
22+
renderers?: ReactRenderer[];
2123
};
2224

2325
const TABLE_COLUMN_DRAG_HANDLE_PLUGIN_KEY = new PluginKey("tableColumnHandlerDecorationPlugin");
@@ -58,11 +60,22 @@ export const TableColumnDragHandlePlugin = (editor: Editor): Plugin<TableColumnD
5860
decorations: mapped,
5961
tableWidth: tableMap.width,
6062
tableNodePos: table.pos,
63+
renderers: prev.renderers,
6164
};
6265
}
6366

67+
// Clean up old renderers before creating new ones
68+
prev.renderers?.forEach((renderer) => {
69+
try {
70+
renderer.destroy();
71+
} catch (error) {
72+
console.error("Error destroying renderer:", error);
73+
}
74+
});
75+
6476
// recreate all decorations
6577
const decorations: Decoration[] = [];
78+
const renderers: ReactRenderer[] = [];
6679

6780
for (let col = 0; col < tableMap.width; col++) {
6881
const pos = getTableCellWidgetDecorationPos(table, tableMap, col);
@@ -75,19 +88,35 @@ export const TableColumnDragHandlePlugin = (editor: Editor): Plugin<TableColumnD
7588
editor,
7689
});
7790

91+
renderers.push(dragHandleComponent);
7892
decorations.push(Decoration.widget(pos, () => dragHandleComponent.element));
7993
}
8094

8195
return {
8296
decorations: DecorationSet.create(newState.doc, decorations),
8397
tableWidth: tableMap.width,
8498
tableNodePos: table.pos,
99+
renderers,
85100
};
86101
},
87102
},
88103
props: {
89104
decorations(state) {
90-
return TABLE_COLUMN_DRAG_HANDLE_PLUGIN_KEY.getState(state).decorations;
105+
return (TABLE_COLUMN_DRAG_HANDLE_PLUGIN_KEY.getState(state) as TableColumnDragHandlePluginState | undefined)
106+
?.decorations;
91107
},
92108
},
109+
destroy() {
110+
// Clean up all renderers when plugin is destroyed
111+
const state =
112+
editor.state &&
113+
(TABLE_COLUMN_DRAG_HANDLE_PLUGIN_KEY.getState(editor.state) as TableColumnDragHandlePluginState | undefined);
114+
state?.renderers?.forEach((renderer: ReactRenderer) => {
115+
try {
116+
renderer.destroy();
117+
} catch (error) {
118+
console.error("Error destroying renderer:", error);
119+
}
120+
});
121+
},
93122
});

‎packages/editor/src/core/extensions/table/plugins/drag-handles/row/drag-handle.tsx‎

Lines changed: 37 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
} from "@floating-ui/react";
1313
import type { Editor } from "@tiptap/core";
1414
import { Ellipsis } from "lucide-react";
15-
import { useCallback, useEffect, useState } from "react";
15+
import { useCallback, useEffect, useRef, useState } from "react";
1616
// plane imports
1717
import { cn } from "@plane/utils";
1818
// constants
@@ -49,6 +49,25 @@ export function RowDragHandle(props: RowDragHandleProps) {
4949
const { editor, row } = props;
5050
// states
5151
const [isDropdownOpen, setIsDropdownOpen] = useState(false);
52+
// Track active event listeners for cleanup
53+
const activeListenersRef = useRef<{
54+
mouseup?: (e: MouseEvent) => void;
55+
mousemove?: (e: MouseEvent) => void;
56+
}>({});
57+
58+
// Cleanup window event listeners on unmount
59+
useEffect(() => {
60+
const listenersRef = activeListenersRef.current;
61+
return () => {
62+
// Remove any lingering window event listeners when component unmounts
63+
if (listenersRef.mouseup) {
64+
window.removeEventListener("mouseup", listenersRef.mouseup);
65+
}
66+
if (listenersRef.mousemove) {
67+
window.removeEventListener("mousemove", listenersRef.mousemove);
68+
}
69+
};
70+
}, []);
5271
// floating ui
5372
const { refs, floatingStyles, context } = useFloating({
5473
placement: "bottom-start",
@@ -94,6 +113,17 @@ export function RowDragHandle(props: RowDragHandleProps) {
94113
e.stopPropagation();
95114
e.preventDefault();
96115

116+
// Prevent multiple simultaneous drag operations
117+
// If there are already listeners attached, remove them first
118+
if (activeListenersRef.current.mouseup) {
119+
window.removeEventListener("mouseup", activeListenersRef.current.mouseup);
120+
}
121+
if (activeListenersRef.current.mousemove) {
122+
window.removeEventListener("mousemove", activeListenersRef.current.mousemove);
123+
}
124+
activeListenersRef.current.mouseup = undefined;
125+
activeListenersRef.current.mousemove = undefined;
126+
97127
const table = findTable(editor.state.selection);
98128
if (!table) return;
99129

@@ -133,6 +163,9 @@ export function RowDragHandle(props: RowDragHandleProps) {
133163
}
134164
window.removeEventListener("mouseup", handleFinish);
135165
window.removeEventListener("mousemove", handleMove);
166+
// Clear the ref
167+
activeListenersRef.current.mouseup = undefined;
168+
activeListenersRef.current.mousemove = undefined;
136169
};
137170

138171
let pseudoRow: HTMLElement | undefined;
@@ -168,6 +201,9 @@ export function RowDragHandle(props: RowDragHandleProps) {
168201
};
169202

170203
try {
204+
// Store references for cleanup
205+
activeListenersRef.current.mouseup = handleFinish;
206+
activeListenersRef.current.mousemove = handleMove;
171207
window.addEventListener("mouseup", handleFinish);
172208
window.addEventListener("mousemove", handleMove);
173209
} catch (error) {

‎packages/editor/src/core/extensions/table/plugins/drag-handles/row/plugin.ts‎

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ type TableRowDragHandlePluginState = {
1818
// track table structure to detect changes
1919
tableHeight?: number;
2020
tableNodePos?: number;
21+
// track renderers for cleanup
22+
renderers?: ReactRenderer[];
2123
};
2224

2325
const TABLE_ROW_DRAG_HANDLE_PLUGIN_KEY = new PluginKey("tableRowDragHandlePlugin");
@@ -58,11 +60,22 @@ export const TableRowDragHandlePlugin = (editor: Editor): Plugin<TableRowDragHan
5860
decorations: mapped,
5961
tableHeight: tableMap.height,
6062
tableNodePos: table.pos,
63+
renderers: prev.renderers,
6164
};
6265
}
6366

67+
// Clean up old renderers before creating new ones
68+
prev.renderers?.forEach((renderer) => {
69+
try {
70+
renderer.destroy();
71+
} catch (error) {
72+
console.error("Error destroying renderer:", error);
73+
}
74+
});
75+
6476
// recreate all decorations
6577
const decorations: Decoration[] = [];
78+
const renderers: ReactRenderer[] = [];
6679

6780
for (let row = 0; row < tableMap.height; row++) {
6881
const pos = getTableCellWidgetDecorationPos(table, tableMap, row * tableMap.width);
@@ -75,19 +88,35 @@ export const TableRowDragHandlePlugin = (editor: Editor): Plugin<TableRowDragHan
7588
editor,
7689
});
7790

91+
renderers.push(dragHandleComponent);
7892
decorations.push(Decoration.widget(pos, () => dragHandleComponent.element));
7993
}
8094

8195
return {
8296
decorations: DecorationSet.create(newState.doc, decorations),
8397
tableHeight: tableMap.height,
8498
tableNodePos: table.pos,
99+
renderers,
85100
};
86101
},
87102
},
88103
props: {
89104
decorations(state) {
90-
return TABLE_ROW_DRAG_HANDLE_PLUGIN_KEY.getState(state).decorations;
105+
return (TABLE_ROW_DRAG_HANDLE_PLUGIN_KEY.getState(state) as TableRowDragHandlePluginState | undefined)
106+
?.decorations;
91107
},
92108
},
109+
destroy() {
110+
// Clean up all renderers when plugin is destroyed
111+
const state =
112+
editor.state &&
113+
(TABLE_ROW_DRAG_HANDLE_PLUGIN_KEY.getState(editor.state) as TableRowDragHandlePluginState | undefined);
114+
state?.renderers?.forEach((renderer: ReactRenderer) => {
115+
try {
116+
renderer.destroy();
117+
} catch (error) {
118+
console.error("Error destroying renderer:", error);
119+
}
120+
});
121+
},
93122
});

‎packages/editor/src/styles/variables.css‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,10 +113,10 @@
113113
/* end font sizes and line heights */
114114

115115
/* font styles */
116-
--font-style: "Inter", sans-serif;
116+
--font-style: "Inter Variable", sans-serif;
117117

118118
&.sans-serif {
119-
--font-style: "Inter", sans-serif;
119+
--font-style: "Inter Variable", sans-serif;
120120
}
121121
&.serif {
122122
--font-style: serif;

0 commit comments

Comments
 (0)