Skip to content

Commit 7c77921

Browse files
tu2-atmanandtu2-atmanand
authored
Merge pull request #705 from tu2-atmanand/minor-bug-fixes
Release v1.9.7
2 parents 00e2824 + a34da10 commit 7c77921

19 files changed

+992
-929
lines changed

‎data.json‎

Lines changed: 88 additions & 65 deletions
Large diffs are not rendered by default.

‎src/components/KanbanView/LazyColumn.tsx‎

Lines changed: 44 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -658,45 +658,54 @@ const LazyColumn: React.FC<LazyColumnProps> = ({
658658
setIsDragOver(false);
659659
setInsertIndex(null);
660660

661-
const targetColumnContainer = tasksContainerRef.current;
662-
if (!targetColumnContainer) {
663-
return;
664-
}
661+
try {
662+
const targetColumnContainer = tasksContainerRef.current;
663+
if (!targetColumnContainer) {
664+
throw `tasksContainerRef.current not found : ${JSON.stringify(targetColumnContainer)}`;
665+
}
665666

666-
// We are basically doing same thing from the handleDrop function below.
667-
dragDropTasksManagerInsatance.handleDropEvent(
668-
e.nativeEvent,
669-
columnData,
670-
targetColumnContainer,
671-
swimlaneData
672-
);
667+
// We are basically doing same thing from the handleDrop function below.
668+
dragDropTasksManagerInsatance.handleDropEvent(
669+
e.nativeEvent,
670+
columnData,
671+
targetColumnContainer,
672+
swimlaneData
673+
);
673674

674-
// Clear manager payload (drag finished)
675-
dragDropTasksManagerInsatance.clearCurrentDragData();
676-
dragDropTasksManagerInsatance.clearDesiredDropIndex();
675+
// Clear manager payload (drag finished)
676+
dragDropTasksManagerInsatance.clearCurrentDragData();
677+
dragDropTasksManagerInsatance.clearDesiredDropIndex();
677678

678-
// const dragIndex = parseInt(e.dataTransfer.getData('text/plain'));
679-
// if (isNaN(dragIndex) || dragIndex === dropIndex) return;
680-
// const updated = [...localTasks];
681-
// const [moved] = updated.splice(dragIndex, 1);
682-
// updated.splice(dropIndex, 0, moved);
683-
// setLocalTasks(updated);
684-
// // If this column uses manualOrder, update the columnData.tasksIdManualOrder to reflect new order
685-
// const hasManualOrder = Array.isArray(columnData.sortCriteria) && columnData.sortCriteria.some((c) => c.criteria === 'manualOrder');
686-
// if (hasManualOrder) {
687-
// columnData.tasksIdManualOrder = updated.map(t => t.id);
688-
// }
689-
690-
// clear any pending raf
691-
if (rafRef.current) {
692-
cancelAnimationFrame(rafRef.current);
693-
rafRef.current = null;
679+
// const dragIndex = parseInt(e.dataTransfer.getData('text/plain'));
680+
// if (isNaN(dragIndex) || dragIndex === dropIndex) return;
681+
// const updated = [...localTasks];
682+
// const [moved] = updated.splice(dragIndex, 1);
683+
// updated.splice(dropIndex, 0, moved);
684+
// setLocalTasks(updated);
685+
// // If this column uses manualOrder, update the columnData.tasksIdManualOrder to reflect new order
686+
// const hasManualOrder = Array.isArray(columnData.sortCriteria) && columnData.sortCriteria.some((c) => c.criteria === 'manualOrder');
687+
// if (hasManualOrder) {
688+
// columnData.tasksIdManualOrder = updated.map(t => t.id);
689+
// }
690+
691+
// clear any pending raf
692+
if (rafRef.current) {
693+
cancelAnimationFrame(rafRef.current);
694+
rafRef.current = null;
695+
}
696+
} catch (error) {
697+
bugReporterManagerInsatance.addToLogs(
698+
188,
699+
String(error),
700+
"Column.tsx/handleTaskDrop",
701+
);
694702
}
695703
};
696704

697705
const handleDrop = useCallback((e: React.DragEvent<HTMLDivElement>) => {
698706
e.preventDefault();
699707
setIsDragOver(false);
708+
setInsertIndex(null);
700709

701710
try {
702711
// Get the data of the dragged task -- No need anymore, since its already stored in the dragdropmanager.
@@ -708,7 +717,10 @@ const LazyColumn: React.FC<LazyColumnProps> = ({
708717
// if (!task || !sourceColumnData) return;
709718

710719
// Get the target column container
711-
const targetColumnContainer = (e.currentTarget) as HTMLDivElement;
720+
const targetColumnContainer = (e.currentTarget);
721+
if (!targetColumnContainer) {
722+
throw `e.currentTarget not found : ${JSON.stringify(targetColumnContainer)}`;
723+
}
712724

713725

714726
// Try to locate the source container by stable column id first (works for all colTypes) -- No need to find this anymore, since I am not making use of sourceColumnContainer in dragdropmanager.
@@ -853,7 +865,7 @@ const LazyColumn: React.FC<LazyColumnProps> = ({
853865
onDragOver={(e) => { handleDragOver(e); }}
854866
onDragLeave={handleDragLeave}
855867
onDrop={handleDrop}
856-
onDragEnd={(e) => { setIsDragOver(false); setInsertIndex(null); dragDropTasksManagerInsatance.clearAllDragStyling(); }}
868+
onDragEnd={(e) => { setIsDragOver(false); setInsertIndex(null); }}
857869
>
858870
{columnData.minimized ? <></> : (
859871
<>

‎src/components/KanbanView/TaskItem.tsx‎

Lines changed: 18 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -66,9 +66,9 @@ const TaskItem: React.FC<TaskCardComponentProps> = ({ dataAttributeIndex, plugin
6666
}
6767
}, [plugin.settings.data.globalSettings]);
6868

69-
const [universalDate, setUniversalDate] = useState(() => getUniversalDateFromTask(task, plugin));
69+
const [universalDate, setUniversalDate] = useState(() => getUniversalDateFromTask(task, globalSettings.universalDate));
7070
useEffect(() => {
71-
setUniversalDate(getUniversalDateFromTask(task, plugin));
71+
setUniversalDate(getUniversalDateFromTask(task, globalSettings.universalDate));
7272
}, [task.due, task.startDate, task.scheduledDate]);
7373

7474

@@ -695,7 +695,7 @@ const TaskItem: React.FC<TaskCardComponentProps> = ({ dataAttributeIndex, plugin
695695
// item.setTitle(status.text);
696696
// item.setIcon("eye-off"); // TODO : In future map lucude-icons with the ITS theme emoji icons for custom statuses.
697697
item.onClick(() => {
698-
updateTaskItemStatus(plugin,task, task, status.value);
698+
updateTaskItemStatus(plugin, task, task, status.value);
699699
})
700700
});
701701
})
@@ -880,41 +880,19 @@ const TaskItem: React.FC<TaskCardComponentProps> = ({ dataAttributeIndex, plugin
880880

881881
// Handlers for drag and drop
882882
const handleDragStart = useCallback((e: React.DragEvent<HTMLDivElement>) => {
883+
// prevent column drag from also starting
884+
e.stopPropagation();
885+
883886
if (!columnData) {
884887
e.preventDefault();
885888
bugReporterManagerInsatance.addToLogs(91, `Column data : undefined`, "TaskItem.tsx/handleDragStart");
886889
return;
887890
}
888-
889-
// Delegate to manager for standardized behavior (sets current payload and dims element)
890891
try {
891892
const el = taskItemRef.current as HTMLDivElement;
892893
const payload: currentDragDataPayload = { task, taskIndex: String(dataAttributeIndex), sourceColumnData: columnData, currentBoardIndex: activeBoardSettings.index, swimlaneData: swimlaneData };
893-
dragDropTasksManagerInsatance.handleDragStartEvent(e.nativeEvent as DragEvent, el, payload, 0);
894-
895-
// Add dragging class after a small delay to not affect the drag image
896-
// const clone = el.cloneNode(true) as HTMLDivElement;
897-
// requestAnimationFrame(() => {
898-
// e.dataTransfer?.setDragImage(clone, 0, 0);
899-
// });
900-
// clone.classList.add("task-item-dragging");
901-
902-
// Also set a drag image from the whole task element so the preview is the full card
903-
// TODO : The drag image is taking too much width and also its still in its default state, like very dimmed opacity. Improve it to get a nice border and increase the opacity so it looks more real.
904-
// if (taskItemRef.current && e.dataTransfer) {
905-
// console.log("TaskItemRef.current", taskItemRef.current);
906-
// const clone = taskItemRef.current.cloneNode(true) as HTMLElement;
907-
// // clone.style.boxShadow = '0 8px 16px rgba(0,0,0,0.12)';
908-
// clone.style.opacity = '0.5';
909-
// clone.style.position = 'absolute';
910-
// // clone.style.top = '-9999px';
911-
// // document.body.appendChild(clone);
912-
// const rect = taskItemRef.current.getBoundingClientRect();
913-
// e.dataTransfer.setDragImage(clone, rect.width, rect.height);
914-
// setTimeout(() => {
915-
// try { document.body.removeChild(clone); } catch { }
916-
// }, 0);
917-
// }
894+
// Delegate to manager for standardized behavior (sets current payload and dims element)
895+
dragDropTasksManagerInsatance.handleDragStartEvent(e.nativeEvent as DragEvent, el, payload);
918896
} catch (err) {
919897
// fallback minimal behavior
920898
// try {
@@ -1289,6 +1267,7 @@ const TaskItem: React.FC<TaskCardComponentProps> = ({ dataAttributeIndex, plugin
12891267
const memoizedRenderHeader = useMemo(() => renderHeader(), [plugin.settings.data.globalSettings.visiblePropertiesList, task.priority, task.tags, activeBoardSettings]);
12901268
const memoizedRenderSubTasks = useMemo(() => renderSubTasks(), [plugin.settings.data.globalSettings.visiblePropertiesList, task.body, showSubtasks]);
12911269
const memoizedRenderChildTasks = useMemo(() => renderChildTasks(), [task.dependsOn, childTasksData]);
1270+
// TODO : Why we are not memoizing the footer component ?
12921271
// const memoizedRenderFooter = useMemo(() => renderFooter(), [plugin.settings.data.globalSettings.showFooter, task.completion, universalDate, task.time]);
12931272

12941273
// ========================================
@@ -1298,12 +1277,12 @@ const TaskItem: React.FC<TaskCardComponentProps> = ({ dataAttributeIndex, plugin
12981277
<div className='taskItemContainer'>
12991278
<div
13001279
ref={taskItemRef}
1301-
className={`taskItem ${isThistaskCompleted ? 'completed' : ''}`}
1280+
className={`taskItem${isThistaskCompleted ? ' completed' : ''}`}
13021281
key={taskIdKey}
13031282
style={{ backgroundColor: getCardBgBasedOnTag(task.tags) }}
13041283
onDoubleClick={handleDoubleClickOnCard}
13051284
onContextMenu={handleMenuButtonClicked}
1306-
draggable={true}
1285+
draggable={Platform.isDesktopApp}
13071286
onDragStart={handleDragStart}
13081287
onDragEnd={handleDragEnd}
13091288
>
@@ -1316,24 +1295,19 @@ const TaskItem: React.FC<TaskCardComponentProps> = ({ dataAttributeIndex, plugin
13161295
{plugin.settings.data.globalSettings.experimentalFeatures && (
13171296
<>
13181297
{
1319-
Platform.isPhone || plugin.settings.data.globalSettings.lastViewHistory.viewedType === viewTypeNames.map ? (
1320-
<>
1321-
<div className="taskItemMenuBtn" aria-label={t("open-task-menu")}><EllipsisVertical size={18} enableBackground={0} opacity={0.4} onClick={handleMenuButtonClicked} /></div>
1322-
</>
1323-
) : (
1298+
Platform.isDesktopApp ? (
13241299
<>
13251300
{/* Drag Handle */}
1326-
{columnData?.colType !== colTypeNames.allPending && (
1327-
<div className="taskItemDragBtn"
1328-
// aria-label={t("drag-task-card")}
1329-
// draggable={true}
1330-
// onDragStart={handleDragStart}
1331-
// onDragEnd={handleDragEnd}
1332-
>
1301+
{columnData?.colType !== colTypeNames.allPending && plugin.settings.data.globalSettings.lastViewHistory.viewedType === viewTypeNames.kanban && (
1302+
<div className="taskItemDragBtn">
13331303
<Grip size={18} enableBackground={0} opacity={0.4} />
13341304
</div>
13351305
)}
13361306
</>
1307+
) : (
1308+
<>
1309+
<div className="taskItemMenuBtn" aria-label={t("open-task-menu")}><EllipsisVertical size={18} enableBackground={0} opacity={0.4} onClick={handleMenuButtonClicked} /></div>
1310+
</>
13371311
)
13381312
}
13391313
</>

‎src/components/KanbanView/TaskItemV2.tsx‎

Lines changed: 16 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -66,9 +66,9 @@ const TaskItemV2: React.FC<TaskProps> = ({ dataAttributeIndex, plugin, task, act
6666
}
6767
}, [plugin.settings.data.globalSettings]);
6868

69-
const [universalDate, setUniversalDate] = useState(() => getUniversalDateFromTask(task, plugin));
69+
const [universalDate, setUniversalDate] = useState(() => getUniversalDateFromTask(task, globalSettings.universalDate));
7070
useEffect(() => {
71-
setUniversalDate(getUniversalDateFromTask(task, plugin));
71+
setUniversalDate(getUniversalDateFromTask(task, globalSettings.universalDate));
7272
}, [task.due, task.startDate, task.scheduledDate]);
7373

7474

@@ -880,41 +880,19 @@ const TaskItemV2: React.FC<TaskProps> = ({ dataAttributeIndex, plugin, task, act
880880

881881
// Handlers for drag and drop
882882
const handleDragStart = useCallback((e: React.DragEvent<HTMLDivElement>) => {
883+
// prevent column drag from also starting
884+
e.stopPropagation();
885+
883886
if (!columnData) {
884887
e.preventDefault();
885888
bugReporterManagerInsatance.addToLogs(91, `Column data : undefined`, "TaskItem.tsx/handleDragStart");
886889
return;
887890
}
888-
889-
// Delegate to manager for standardized behavior (sets current payload and dims element)
890891
try {
891892
const el = taskItemRef.current as HTMLDivElement;
892893
const payload: currentDragDataPayload = { task, taskIndex: String(dataAttributeIndex), sourceColumnData: columnData, currentBoardIndex: activeBoardSettings.index, swimlaneData: swimlaneData };
893-
dragDropTasksManagerInsatance.handleDragStartEvent(e.nativeEvent as DragEvent, el, payload, 0);
894-
895-
// Add dragging class after a small delay to not affect the drag image
896-
// const clone = el.cloneNode(true) as HTMLDivElement;
897-
// e.dataTransfer?.setDragImage(el, 0, 0);
898-
// requestAnimationFrame(() => {
899-
// clone.classList.add("task-item-dragging");
900-
// });
901-
902-
// Also set a drag image from the whole task element so the preview is the full card
903-
// TODO : The drag image is taking too much width and also its still in its default state, like very dimmed opacity. Improve it to get a nice border and increase the opacity so it looks more real.
904-
// if (taskItemRef.current && e.dataTransfer) {
905-
// console.log("TaskItemRef.current", taskItemRef.current);
906-
// const clone = taskItemRef.current.cloneNode(true) as HTMLElement;
907-
// // clone.style.boxShadow = '0 8px 16px rgba(0,0,0,0.12)';
908-
// clone.style.opacity = '0.5';
909-
// clone.style.position = 'absolute';
910-
// // clone.style.top = '-9999px';
911-
// // document.body.appendChild(clone);
912-
// const rect = taskItemRef.current.getBoundingClientRect();
913-
// e.dataTransfer.setDragImage(clone, rect.width, rect.height);
914-
// setTimeout(() => {
915-
// try { document.body.removeChild(clone); } catch { }
916-
// }, 0);
917-
// }
894+
// Delegate to manager for standardized behavior (sets current payload and dims element)
895+
dragDropTasksManagerInsatance.handleDragStartEvent(e.nativeEvent as DragEvent, el, payload);
918896
} catch (err) {
919897
// fallback minimal behavior
920898
// try {
@@ -1297,6 +1275,7 @@ const TaskItemV2: React.FC<TaskProps> = ({ dataAttributeIndex, plugin, task, act
12971275
const memoizedRenderHeader = useMemo(() => renderHeader(), [plugin.settings.data.globalSettings.visiblePropertiesList, task.priority, task.tags, activeBoardSettings]);
12981276
const memoizedRenderSubTasks = useMemo(() => renderSubTasks(), [plugin.settings.data.globalSettings.visiblePropertiesList, task.body, showSubtasks]);
12991277
const memoizedRenderChildTasks = useMemo(() => renderChildTasks(), [task.dependsOn, childTasksData]);
1278+
// TODO : Why we are not memoizing the footer component ?
13001279
// const memoizedRenderFooter = useMemo(() => renderFooter(), [plugin.settings.data.globalSettings.showFooter, task.completion, universalDate, task.time]);
13011280

13021281
// ========================================
@@ -1306,12 +1285,12 @@ const TaskItemV2: React.FC<TaskProps> = ({ dataAttributeIndex, plugin, task, act
13061285
<div className='taskItemContainer'>
13071286
<div
13081287
ref={taskItemRef}
1309-
className={`taskItem ${isThistaskCompleted ? 'completed' : ''}`}
1288+
className={`taskItem${isThistaskCompleted ? ' completed' : ''}`}
13101289
key={taskIdKey}
13111290
style={{ backgroundColor: getCardBgBasedOnTag(task.tags) }}
13121291
onDoubleClick={handleDoubleClickOnCard}
13131292
onContextMenu={handleMenuButtonClicked}
1314-
draggable={true}
1293+
draggable={Platform.isDesktopApp}
13151294
onDragStart={handleDragStart}
13161295
onDragEnd={handleDragEnd}
13171296
>
@@ -1324,24 +1303,19 @@ const TaskItemV2: React.FC<TaskProps> = ({ dataAttributeIndex, plugin, task, act
13241303
{plugin.settings.data.globalSettings.experimentalFeatures && (
13251304
<>
13261305
{
1327-
Platform.isPhone ? (
1328-
<>
1329-
<div className="taskItemMenuBtn" aria-label={t("open-task-menu")}><EllipsisVertical size={18} enableBackground={0} opacity={0.4} onClick={handleMenuButtonClicked} /></div>
1330-
</>
1331-
) : (
1306+
Platform.isDesktopApp ? (
13321307
<>
13331308
{/* Drag Handle */}
13341309
{columnData?.colType !== colTypeNames.allPending && plugin.settings.data.globalSettings.lastViewHistory.viewedType === viewTypeNames.kanban && (
1335-
<div className="taskItemDragBtn"
1336-
// aria-label={t("drag-task-card")}
1337-
// draggable={true}
1338-
// onDragStart={handleDragStart}
1339-
// onDragEnd={handleDragEnd}
1340-
>
1310+
<div className="taskItemDragBtn">
13411311
<Grip size={18} enableBackground={0} opacity={0.4} />
13421312
</div>
13431313
)}
13441314
</>
1315+
) : (
1316+
<>
1317+
<div className="taskItemMenuBtn" aria-label={t("open-task-menu")}><EllipsisVertical size={18} enableBackground={0} opacity={0.4} onClick={handleMenuButtonClicked} /></div>
1318+
</>
13451319
)
13461320
}
13471321
</>

0 commit comments

Comments
 (0)