From b2a02668df8b9db4a9ea129cbd2e794009cac776 Mon Sep 17 00:00:00 2001
From: Anton Brechka <60566490+mrsadman99@users.noreply.github.com>
Date: Thu, 6 Apr 2023 17:54:57 +0700
Subject: [PATCH] Tsk-1040: Support draft for DraggableList (#2898)

Signed-off-by: Anton Brechka <anton.brechka@xored.com>
---
 .../src/components/DraggableList.svelte       | 23 +++++++++++++++----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/packages/presentation/src/components/DraggableList.svelte b/packages/presentation/src/components/DraggableList.svelte
index 389a17e117..b1ac64f549 100644
--- a/packages/presentation/src/components/DraggableList.svelte
+++ b/packages/presentation/src/components/DraggableList.svelte
@@ -15,17 +15,21 @@
 <script lang="ts">
   import { flip } from 'svelte/animate'
 
-  import { Doc } from '@hcengineering/core'
+  import { Doc, DocData, Ref } from '@hcengineering/core'
 
   import { IconMoreV } from '@hcengineering/ui'
   import { getClient } from '../utils'
 
   type DocWithRank = Doc & { rank: string }
+  type DraftDoc = DocData<Doc> & { _id: Ref<Doc> }
+  type DraftDocWithRank = DocData<DocWithRank> & { _id: Ref<Doc> }
+  type ListType = Doc[] | DocWithRank[] | DraftDoc[] | DraftDocWithRank[]
 
-  export let objects: Doc[] | DocWithRank[]
+  export let objects: ListType
   export let handleMove: ((fromIndex: number, toIndex: number) => void) | undefined = undefined
   export let calcRank: (doc: DocWithRank, next: DocWithRank) => string
   export let showContextMenu: ((evt: MouseEvent, doc: Doc) => void) | undefined = undefined
+  export let isDraft = false
 
   const client = getClient()
 
@@ -47,10 +51,14 @@
     }
   }
 
-  function checkHasRank (objects: Doc[] | (Doc & { rank: string })[]): objects is (Doc & { rank: string })[] {
+  function checkHasRank (objects: ListType): objects is DocWithRank[] {
     return 'rank' in objects[0]
   }
 
+  function checkIsNotDraft (object: Doc | DocWithRank | DraftDoc | DraftDocWithRank): object is Doc | DocWithRank {
+    return !('_class' in object) && !isDraft
+  }
+
   async function handleDrop (ev: DragEvent, toIndex: number) {
     if (ev.dataTransfer && draggingIndex !== null && toIndex !== draggingIndex) {
       ev.dataTransfer.dropEffect = 'move'
@@ -68,7 +76,12 @@
       ]
       const object = objects[draggingIndex]
 
-      await client.update(object, { rank: calcRank(prev, next) })
+      const newRank = calcRank(prev, next)
+      if (isDraft) {
+        object.rank = newRank
+      } else {
+        await client.update(object, { rank: newRank })
+      }
     }
     resetDrag()
   }
@@ -83,7 +96,7 @@
         class:is-dragged-over-down={draggingIndex !== null && index > draggingIndex && index === hoveringIndex}
         class:drag-over-highlight={index === dragOverIndex}
         draggable={true}
-        on:contextmenu|preventDefault={(ev) => showContextMenu?.(ev, object)}
+        on:contextmenu|preventDefault={(ev) => checkIsNotDraft(object) && showContextMenu?.(ev, object)}
         on:dragstart={(ev) => handleDragStart(ev, index)}
         on:dragover|preventDefault={() => {
           dragOverIndex = index