From 34b086b4c737932c2a0c6420d3a35e186f2c82ba Mon Sep 17 00:00:00 2001
From: Johannes Millan <johannes.millan@gmail.com>
Date: Mon, 30 Mar 2026 17:43:11 +0200
Subject: [PATCH] fix(boards): add missing drag delay for touch and extract
 shared signal

Add cdkDragStartDelay to board-panel drag items, which was missing
entirely. Extract the repeated `isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0`
expression into a shared `dragDelayForTouch` computed signal and refactor
all 8 components to use it.
---
 .../features/boards/board-panel/board-panel.component.html | 1 +
 .../features/boards/board-panel/board-panel.component.ts   | 2 ++
 src/app/features/note/notes/notes.component.html           | 2 +-
 src/app/features/note/notes/notes.component.ts             | 7 +++----
 .../planner-day-overdue/planner-day-overdue.component.html | 2 +-
 .../planner-day-overdue/planner-day-overdue.component.ts   | 6 ++----
 .../planner/planner-day/planner-day.component.html         | 4 ++--
 .../features/planner/planner-day/planner-day.component.ts  | 6 ++----
 .../schedule/schedule-week/schedule-week.component.html    | 2 +-
 .../schedule/schedule-week/schedule-week.component.ts      | 5 ++---
 .../habit-tracker/habit-tracker.component.html             | 2 +-
 .../habit-tracker/habit-tracker.component.ts               | 6 ++----
 src/app/features/tasks/task-list/task-list.component.html  | 2 +-
 src/app/features/tasks/task-list/task-list.component.ts    | 6 ++----
 src/app/ui/tree-dnd/tree.component.html                    | 2 +-
 src/app/ui/tree-dnd/tree.component.ts                      | 6 ++----
 src/app/util/input-intent.ts                               | 5 +++++
 17 files changed, 31 insertions(+), 35 deletions(-)

diff --git a/src/app/features/boards/board-panel/board-panel.component.html b/src/app/features/boards/board-panel/board-panel.component.html
index 74e220bdc0..ec0caf9c05 100644
--- a/src/app/features/boards/board-panel/board-panel.component.html
+++ b/src/app/features/boards/board-panel/board-panel.component.html
@@ -41,6 +41,7 @@
     <planner-task
       cdkDrag
       [cdkDragData]="task"
+      [cdkDragStartDelay]="dragDelayForTouch()"
       [task]="task"
       [tagsToHide]="panelCfg().includedTagIds || []"
     >
diff --git a/src/app/features/boards/board-panel/board-panel.component.ts b/src/app/features/boards/board-panel/board-panel.component.ts
index 7c3417365b..9a394d1a5b 100644
--- a/src/app/features/boards/board-panel/board-panel.component.ts
+++ b/src/app/features/boards/board-panel/board-panel.component.ts
@@ -37,6 +37,7 @@ import { DialogScheduleTaskComponent } from '../../planner/dialog-schedule-task/
 import { MatDialog } from '@angular/material/dialog';
 import { fastArrayCompare } from '../../../util/fast-array-compare';
 import { first, take } from 'rxjs/operators';
+import { dragDelayForTouch } from '../../../util/input-intent';
 import { ShortPlannedAtPipe } from '../../../ui/pipes/short-planned-at.pipe';
 import { MsToStringPipe } from '../../../ui/duration/ms-to-string.pipe';
 import { selectUnarchivedProjects } from '../../project/store/project.selectors';
@@ -66,6 +67,7 @@ import {
 })
 export class BoardPanelComponent {
   T = T;
+  dragDelayForTouch = dragDelayForTouch;
 
   panelCfg = input.required<BoardPanelCfg>();
   editBoard = output<void>();
diff --git a/src/app/features/note/notes/notes.component.html b/src/app/features/note/notes/notes.component.html
index 51ef1d682c..b24565fccc 100644
--- a/src/app/features/note/notes/notes.component.html
+++ b/src/app/features/note/notes/notes.component.html
@@ -33,7 +33,7 @@
   @for (note of notes; track note.id) {
     <div
       cdkDrag
-      [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+      [cdkDragStartDelay]="dragDelayForTouch()"
     >
       <note
         [isFocus]="isElementWasAdded && $index === 0"
diff --git a/src/app/features/note/notes/notes.component.ts b/src/app/features/note/notes/notes.component.ts
index 3b311b2d1a..538c57b981 100644
--- a/src/app/features/note/notes/notes.component.ts
+++ b/src/app/features/note/notes/notes.component.ts
@@ -21,8 +21,8 @@ import { MatIcon } from '@angular/material/icon';
 import { NoteComponent } from '../note/note.component';
 import { AsyncPipe } from '@angular/common';
 import { TranslatePipe } from '@ngx-translate/core';
-import { DRAG_DELAY_FOR_TOUCH, HISTORY_STATE } from '../../../app.constants';
-import { isTouchActive } from '../../../util/input-intent';
+import { HISTORY_STATE } from '../../../app.constants';
+import { dragDelayForTouch } from '../../../util/input-intent';
 import { LayoutService } from 'src/app/core-ui/layout/layout.service';
 import { IS_MOBILE } from 'src/app/util/is-mobile';
 
@@ -116,6 +116,5 @@ export class NotesComponent implements OnInit {
     });
   }
 
-  protected readonly DRAG_DELAY_FOR_TOUCH = DRAG_DELAY_FOR_TOUCH;
-  protected readonly isTouchActive = isTouchActive;
+  protected readonly dragDelayForTouch = dragDelayForTouch;
 }
diff --git a/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.html b/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.html
index d436ec4cfb..54fa5e6fe3 100644
--- a/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.html
+++ b/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.html
@@ -22,7 +22,7 @@
       <planner-task
         cdkDrag
         [cdkDragData]="task"
-        [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+        [cdkDragStartDelay]="dragDelayForTouch()"
         [cdkDragLockAxis]="isXs() ? 'y' : ''"
         [task]="task"
         [day]=""
diff --git a/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.ts b/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.ts
index ddfb774f65..afae2bb579 100644
--- a/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.ts
+++ b/src/app/features/planner/planner-day-overdue/planner-day-overdue.component.ts
@@ -15,8 +15,7 @@ import { MatIcon } from '@angular/material/icon';
 import { TaskCopy } from '../../tasks/task.model';
 import { OVERDUE_LIST_ID } from '../planner.model';
 import { TranslatePipe } from '@ngx-translate/core';
-import { isTouchActive } from '../../../util/input-intent';
-import { DRAG_DELAY_FOR_TOUCH } from '../../../app.constants';
+import { dragDelayForTouch } from '../../../util/input-intent';
 import { LayoutService } from '../../../core-ui/layout/layout.service';
 
 @Component({
@@ -47,8 +46,7 @@ export class PlannerDayOverdueComponent {
 
   OVERDUE_LIST_ID = OVERDUE_LIST_ID;
   protected readonly T = T;
-  protected readonly isTouchActive = isTouchActive;
-  protected readonly DRAG_DELAY_FOR_TOUCH = DRAG_DELAY_FOR_TOUCH;
+  protected readonly dragDelayForTouch = dragDelayForTouch;
   // Lock Y-axis on small screens only — on wider screens the planner uses a
   // multi-column grid where cross-column dragging requires horizontal movement.
   protected readonly isXs = this._layoutService.isXs;
diff --git a/src/app/features/planner/planner-day/planner-day.component.html b/src/app/features/planner/planner-day/planner-day.component.html
index 21ba4f4c0a..6895adf32a 100644
--- a/src/app/features/planner/planner-day/planner-day.component.html
+++ b/src/app/features/planner/planner-day/planner-day.component.html
@@ -43,7 +43,7 @@
       <planner-task
         cdkDrag
         [cdkDragData]="task"
-        [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+        [cdkDragStartDelay]="dragDelayForTouch()"
         [cdkDragLockAxis]="isXs() ? 'y' : ''"
         [task]="task"
         [day]="day.dayDate"
@@ -128,7 +128,7 @@
               [task]="scheduledItem.task"
               [day]="day.dayDate"
               [cdkDragData]="scheduledItem.task"
-              [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+              [cdkDragStartDelay]="dragDelayForTouch()"
               [cdkDragLockAxis]="isXs() ? 'y' : ''"
             ></planner-task>
           }
diff --git a/src/app/features/planner/planner-day/planner-day.component.ts b/src/app/features/planner/planner-day/planner-day.component.ts
index cbcc8f3692..a3fc933cab 100644
--- a/src/app/features/planner/planner-day/planner-day.component.ts
+++ b/src/app/features/planner/planner-day/planner-day.component.ts
@@ -32,8 +32,7 @@ import { ShortTimeHtmlPipe } from '../../../ui/pipes/short-time-html.pipe';
 import { TranslatePipe } from '@ngx-translate/core';
 import { ShortDate2Pipe } from '../../../ui/pipes/short-date2.pipe';
 import { ProgressBarComponent } from '../../../ui/progress-bar/progress-bar.component';
-import { isTouchActive } from '../../../util/input-intent';
-import { DRAG_DELAY_FOR_TOUCH } from '../../../app.constants';
+import { dragDelayForTouch } from '../../../util/input-intent';
 import { LayoutService } from '../../../core-ui/layout/layout.service';
 
 @Component({
@@ -78,8 +77,7 @@ export class PlannerDayComponent {
 
   protected readonly T = T;
   protected readonly SCHEDULE_ITEM_TYPE = ScheduleItemType;
-  protected readonly isTouchActive = isTouchActive;
-  protected readonly DRAG_DELAY_FOR_TOUCH = DRAG_DELAY_FOR_TOUCH;
+  protected readonly dragDelayForTouch = dragDelayForTouch;
   // Lock Y-axis on small screens only — on wider screens the planner uses a
   // multi-column grid where cross-column dragging requires horizontal movement.
   protected readonly isXs = this._layoutService.isXs;
diff --git a/src/app/features/schedule/schedule-week/schedule-week.component.html b/src/app/features/schedule/schedule-week/schedule-week.component.html
index 9f1db3f226..591f8b3ee4 100644
--- a/src/app/features/schedule/schedule-week/schedule-week.component.html
+++ b/src/app/features/schedule/schedule-week/schedule-week.component.html
@@ -136,7 +136,7 @@
               (cdkDragMoved)="dragMoved($event)"
               (cdkDragStarted)="dragStarted($event)"
               (cdkDragReleased)="dragReleased($event)"
-              [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+              [cdkDragStartDelay]="dragDelayForTouch()"
             ></schedule-event>
           } @else {
             <schedule-event
diff --git a/src/app/features/schedule/schedule-week/schedule-week.component.ts b/src/app/features/schedule/schedule-week/schedule-week.component.ts
index 3c1f65fa0f..156cc537aa 100644
--- a/src/app/features/schedule/schedule-week/schedule-week.component.ts
+++ b/src/app/features/schedule/schedule-week/schedule-week.component.ts
@@ -23,8 +23,7 @@ import { ScheduleEventComponent } from '../schedule-event/schedule-event.compone
 import { TranslatePipe, TranslateService } from '@ngx-translate/core';
 import { MatIcon } from '@angular/material/icon';
 import { T } from '../../../t.const';
-import { isTouchActive } from '../../../util/input-intent';
-import { DRAG_DELAY_FOR_TOUCH } from '../../../app.constants';
+import { dragDelayForTouch, isTouchActive } from '../../../util/input-intent';
 import { MatTooltip } from '@angular/material/tooltip';
 import { DateTimeFormatService } from '../../../core/date-time-format/date-time-format.service';
 import { LocaleDatePipe } from 'src/app/ui/pipes/locale-date.pipe';
@@ -84,7 +83,7 @@ export class ScheduleWeekComponent implements OnInit, AfterViewInit, OnDestroy {
 
   FH = FH;
   protected readonly isTouchActive = isTouchActive;
-  DRAG_DELAY_FOR_TOUCH = DRAG_DELAY_FOR_TOUCH;
+  dragDelayForTouch = dragDelayForTouch;
   SVEType: typeof SVEType = SVEType;
   T: typeof T = T;
   protected readonly isDraggableSE = isDraggableSE;
diff --git a/src/app/features/simple-counter/habit-tracker/habit-tracker.component.html b/src/app/features/simple-counter/habit-tracker/habit-tracker.component.html
index 8753e0ec12..8b343ccf8a 100644
--- a/src/app/features/simple-counter/habit-tracker/habit-tracker.component.html
+++ b/src/app/features/simple-counter/habit-tracker/habit-tracker.component.html
@@ -50,7 +50,7 @@
       <div
         class="habit-row"
         cdkDrag
-        [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+        [cdkDragStartDelay]="dragDelayForTouch()"
       >
         <div
           class="habit-title"
diff --git a/src/app/features/simple-counter/habit-tracker/habit-tracker.component.ts b/src/app/features/simple-counter/habit-tracker/habit-tracker.component.ts
index 91d4b94322..ff41b856cb 100644
--- a/src/app/features/simple-counter/habit-tracker/habit-tracker.component.ts
+++ b/src/app/features/simple-counter/habit-tracker/habit-tracker.component.ts
@@ -22,8 +22,7 @@ import { DialogConfirmComponent } from '../../../ui/dialog-confirm/dialog-confir
 import { EMPTY_SIMPLE_COUNTER } from '../simple-counter.const';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { moveItemInArray } from '../../../util/move-item-in-array';
-import { DRAG_DELAY_FOR_TOUCH } from '../../../app.constants';
-import { isTouchActive } from '../../../util/input-intent';
+import { dragDelayForTouch } from '../../../util/input-intent';
 import { LocaleDatePipe } from 'src/app/ui/pipes/locale-date.pipe';
 import { DateTimeFormatService } from 'src/app/core/date-time-format/date-time-format.service';
 
@@ -57,8 +56,7 @@ export class HabitTrackerComponent {
 
   T = T;
   SimpleCounterType = SimpleCounterType;
-  DRAG_DELAY_FOR_TOUCH = DRAG_DELAY_FOR_TOUCH;
-  protected readonly isTouchActive = isTouchActive;
+  dragDelayForTouch = dragDelayForTouch;
 
   dayOffset = signal(0);
 
diff --git a/src/app/features/tasks/task-list/task-list.component.html b/src/app/features/tasks/task-list/task-list.component.html
index ad729bf375..3f982d3f98 100644
--- a/src/app/features/tasks/task-list/task-list.component.html
+++ b/src/app/features/tasks/task-list/task-list.component.html
@@ -37,7 +37,7 @@
       [isBacklog]="isBacklog()"
       [task]="task"
       cdkDrag
-      [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+      [cdkDragStartDelay]="dragDelayForTouch()"
       [cdkDragLockAxis]="isXs() ? 'y' : ''"
       [cdkDragDisabled]="listModelId() === 'LATER_TODAY'"
       [cdkDragData]="task"
diff --git a/src/app/features/tasks/task-list/task-list.component.ts b/src/app/features/tasks/task-list/task-list.component.ts
index 4fd1a6daac..90fe8daa5f 100644
--- a/src/app/features/tasks/task-list/task-list.component.ts
+++ b/src/app/features/tasks/task-list/task-list.component.ts
@@ -42,8 +42,7 @@ import { TaskViewCustomizerService } from '../../task-view-customizer/task-view-
 import { TaskLog } from '../../../core/log';
 import { ScheduleExternalDragService } from '../../schedule/schedule-week/schedule-external-drag.service';
 import { DEFAULT_OPTIONS } from '../../task-view-customizer/types';
-import { isTouchActive } from '../../../util/input-intent';
-import { DRAG_DELAY_FOR_TOUCH } from '../../../app.constants';
+import { dragDelayForTouch } from '../../../util/input-intent';
 
 export type TaskListId = 'PARENT' | 'SUB';
 export type ListModelId = DropListModelSource | string;
@@ -79,8 +78,7 @@ export class TaskListComponent implements OnDestroy, AfterViewInit {
   private _scheduleExternalDragService = inject(ScheduleExternalDragService);
   dropListService = inject(DropListService);
   private _layoutService = inject(LayoutService);
-  protected readonly isTouchActive = isTouchActive;
-  protected readonly DRAG_DELAY_FOR_TOUCH = DRAG_DELAY_FOR_TOUCH;
+  protected readonly dragDelayForTouch = dragDelayForTouch;
   // Lock Y-axis on small screens only — on wider screens the task list may sit
   // beside a side-nav or other drop targets that require horizontal dragging.
   protected readonly isXs = this._layoutService.isXs;
diff --git a/src/app/ui/tree-dnd/tree.component.html b/src/app/ui/tree-dnd/tree.component.html
index 92e459aeda..555f24ccc4 100644
--- a/src/app/ui/tree-dnd/tree.component.html
+++ b/src/app/ui/tree-dnd/tree.component.html
@@ -51,7 +51,7 @@
     class="item"
     cdkDrag
     [cdkDragData]="node.id"
-    [cdkDragStartDelay]="isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0"
+    [cdkDragStartDelay]="dragDelayForTouch()"
     cdkDragLockAxis="y"
     [ngClass]="{
       'is-folder': folder,
diff --git a/src/app/ui/tree-dnd/tree.component.ts b/src/app/ui/tree-dnd/tree.component.ts
index e8be349d22..914f5a81cf 100644
--- a/src/app/ui/tree-dnd/tree.component.ts
+++ b/src/app/ui/tree-dnd/tree.component.ts
@@ -38,8 +38,7 @@ import { TreeIndicatorService } from './tree-indicator.service';
 import { TREE_CONSTANTS } from './tree-constants';
 import { assertTreeId } from './tree-guards';
 import { expandCollapseAni } from './tree.animations';
-import { DRAG_DELAY_FOR_TOUCH } from '../../app.constants';
-import { isTouchActive } from '../../util/input-intent';
+import { dragDelayForTouch } from '../../util/input-intent';
 
 @Component({
   selector: 'tree-dnd',
@@ -74,8 +73,7 @@ export class TreeDndComponent<TData = unknown> {
   readonly isDragInvalid = signal<boolean>(false);
   readonly isRootOver = signal<boolean>(false);
   readonly indicatorStyle = this._indicatorService.indicatorStyle;
-  protected readonly DRAG_DELAY_FOR_TOUCH = DRAG_DELAY_FOR_TOUCH;
-  protected readonly isTouchActive = isTouchActive;
+  protected readonly dragDelayForTouch = dragDelayForTouch;
 
   // === PRIVATE STATE ===
   /**
diff --git a/src/app/util/input-intent.ts b/src/app/util/input-intent.ts
index 32c9d81056..29aed25005 100644
--- a/src/app/util/input-intent.ts
+++ b/src/app/util/input-intent.ts
@@ -2,6 +2,7 @@ import { computed } from '@angular/core';
 import { deviceType } from 'detect-it';
 import { IS_TOUCH_ONLY } from './is-touch-only';
 import { _inputIntentSignal } from '../core/input-intent/input-intent.service';
+import { DRAG_DELAY_FOR_TOUCH } from '../app.constants';
 
 export const isTouchActive = computed(() => {
   if (deviceType !== 'hybrid') {
@@ -9,3 +10,7 @@ export const isTouchActive = computed(() => {
   }
   return _inputIntentSignal() === 'touch';
 });
+
+export const dragDelayForTouch = computed(() =>
+  isTouchActive() ? DRAG_DELAY_FOR_TOUCH : 0,
+);