Calendar/docs/drag-drop-header-bug-analysis-corrected.md
Janus Knudsen 46b8bf9fb5 Fixes drag and drop to header issues
Addresses two key issues related to dragging events to the header: the premature removal of the original event element and the creation of duplicate all-day events.

The original event is no longer removed when dragging to the header; it is now only removed upon a successful drop.

Also, it prevents the creation of duplicate all-day events by checking for existing all-day events before creating new ones, using DOM queries to ensure accurate state.
2025-09-17 23:39:29 +02:00

114 lines
No EOL
3.2 KiB
Markdown

# Korrigeret Analyse: Day Event Drag til Header og Tilbage
## Korrekt Flow Design
### Elementer i Spil
1. **Original Event**: Skal forblive i DOM uændret indtil drag:end
2. **Clone Event**: Det visuelle element der dragges rundt
3. **All-Day Event**: Midlertidig repræsentation i header
## Nuværende Problem
### AllDayManager.handleConvertToAllDay() (linje 274)
```typescript
// PROBLEM: Fjerner original for tidligt!
originalElement.remove(); // ❌ FORKERT
```
Original element fjernes når man hover over header, men det skal først fjernes ved faktisk drop.
### Korrekt Flow
```mermaid
sequenceDiagram
participant User
participant Original as Original Event
participant Clone as Clone Event
participant AllDay as All-Day Event
Note over Original: Start: Original synlig
User->>Clone: Drag start
Note over Clone: Clone oprettes og vises
Note over Original: Original bliver semi-transparent
User->>AllDay: Enter header
Note over Clone: Clone skjules (display:none)
Note over AllDay: All-day event oprettes
Note over Original: Original forbliver (semi-transparent)
User->>Clone: Leave header (tilbage til grid)
Note over AllDay: All-day event fjernes
Note over Clone: Clone vises igen
Note over Original: Original stadig der
User->>Original: Drop
Note over Original: NU fjernes original
Note over Clone: Clone bliver til ny position
```
## Nødvendige Ændringer
### 1. AllDayManager.handleConvertToAllDay() (linje 232-285)
```typescript
// FØR (linje 274):
originalElement.remove(); // ❌
// EFTER:
// originalElement.remove(); // Kommenteret ud - skal IKKE fjernes her
// Original forbliver i DOM med opacity 0.3 fra drag start
```
### 2. AllDayManager.handleConvertFromAllDay() (linje 290-311)
```typescript
// Nuværende kode er faktisk korrekt - den:
// 1. Fjerner all-day event
// 2. Viser clone igen
// Original er stadig der (blev aldrig fjernet)
```
### 3. EventRenderer - handleDragEnd()
```typescript
// Her skal original FAKTISK fjernes
// Efter successful drop:
if (this.originalEvent) {
this.originalEvent.remove(); // ✅ Korrekt tidspunkt
}
```
## Problem Opsummering
**Hovedproblem**: `originalElement.remove()` på linje 274 i AllDayManager sker for tidligt.
**Løsning**:
1. Fjern/kommenter linje 274 i AllDayManager.handleConvertToAllDay()
2. Original element skal kun fjernes i EventRenderer ved faktisk drop (drag:end)
3. Clone håndterer al visuel feedback under drag
## Test Scenarios
1. **Drag → Header → Grid → Drop**
- Original forbliver hele tiden
- Clone skjules/vises korrekt
- Original fjernes kun ved drop
2. **Drag → Header → Drop i Header**
- Original forbliver indtil drop
- All-day event bliver permanent
- Original fjernes ved drop
3. **Drag → Header → ESC**
- Original forbliver
- Drag cancelled, alt tilbage til start
## Affected Code
### AllDayManager.ts
- **Linje 274**: Skal fjernes/kommenteres
- Original element må IKKE fjernes her
### EventRenderer.ts
- **handleDragEnd()**: Skal sikre original fjernes her
- Dette er det ENESTE sted original må fjernes
### DragDropManager.ts
- Koden ser faktisk korrekt ud
- Holder styr på både original og clone