push before switching to childDocList

2 files changed, 30 insertions, 82 deletions

diff --git a/src/client/views/collections/CollectionNoteTakingView.tsx b/src/client/views/collections/CollectionNoteTakingView.tsx
index 97fc5cc7c..302e7c890 100644
--- a/src/client/views/collections/CollectionNoteTakingView.tsx
+++ b/src/client/views/collections/CollectionNoteTakingView.tsx
@@ -97,7 +97,6 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
     // [CAVEATS] (1) keep track of the offsetting
     // (2) documentView gets unmounted as you remove it from the list
     get Sections() {
-        if (this.columnHeaders instanceof Promise) return new Map<SchemaHeaderField, Doc[]>();
         const columnHeaders = this.columnHeaders;
         const sections = new Map<SchemaHeaderField, Doc[]>(columnHeaders.map(sh => [sh, []] as [SchemaHeaderField, []]));
         let docs = this.childDocs
@@ -337,8 +336,6 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
     @action
     onPointerOver = (e: React.PointerEvent) => {
       if (DragManager.docsBeingDragged.length && this.childDocList) {
-        //TODO: update new observable field to empty slice once done
-        //TODO: how do we update the docs in the column once we switch over?
         // get the current docs for the column based on the mouse's x coordinate
         // will use again later, which is why we're saving as local
         const xCoord = e.clientX - 2 * this.gridGap
@@ -347,48 +344,31 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
         const clientY = e.clientY
         let dropInd = -1;
         // unsure whether we still want this dropAfter field
-        let dropAfter = 0;
+        // let dropAfter = 0;
         // manually set to 140, because not sure how to get exact value
         let pos0 = 140
         colDocs.forEach((doc, i) => {
-          //TODO: this isn't getting the actual positions of the doc like I thought it would
-          // const width = () => this.getDocWidth(doc);
-          // const displayDoc = this.getDisplayDoc(doc, width)
-          // const dref = displayDoc.props.dref
           const noteTakingDocTransform = () => this.getDocTransform(doc);
-          // const pos0 = noteTakingDocTransform().inverse().transformPoint(0, 0);
           let pos1 = noteTakingDocTransform().inverse().transformPoint(0, this.getDocHeight(doc) + 2 * this.gridGap)[1];
           pos1 += pos0
           // updating drop position based on y coordinates
           const yCoordInBetween = clientY > pos0 && (clientY < pos1 || i == colDocs.length - 1)
           if (yCoordInBetween) {
             dropInd = i;
-            dropAfter = 0;
+            // dropAfter = 0;
             if (clientY > (pos0 + pos1) / 2) {
-              dropAfter = 1;
+              // dropAfter = 1;
             }
           }
           pos0 = pos1
         })
+        // we alter the pivot fields of the docs in case they are moved to a new column.
+        // const colIndex = this.getColumnFromXCoord(xCoord)
+        // const colHeader = StrCast(this.columnHeaders[colIndex].heading)
+        // DragManager.docsBeingDragged.forEach(d => d[this.pivotField] = colHeader)
+        // used to notify sections to re-render
+        console.log([dropInd, this.getColumnFromXCoord(xCoord)])
         this.docsDraggedRowCol = [dropInd, this.getColumnFromXCoord(xCoord)]
-        console.log(`[${this.docsDraggedRowCol[0]}, ${this.docsDraggedRowCol[1]}]`)
-
-        // since we have row, col, we can send that to an observable value in NoteTaking view
-
-
-        // TODO: add the doc back into the proper position and then update childDocs list
-        // Need to update our list of all docs to properly 
-        // const docs = this.childDocList;
-        // const docs = this.childDocs;
-
-        // 
-        // const newDocs = DragManager.docsBeingDragged;
-        // if (docs && newDocs.length) {
-        //   const insertInd = dropInd === -1 ? docs.length : dropInd + dropAfter;
-        //   const offset = newDocs.reduce((off, ndoc) => this.filteredChildren.find((fdoc, i) => ndoc === fdoc && i < insertInd) ? off + 1 : off, 0);
-        //   newDocs.filter(ndoc => docs.indexOf(ndoc) !== -1).forEach(ndoc => docs.splice(docs.indexOf(ndoc), 1));
-        //   docs.splice(insertInd - offset, 0, ...newDocs);
-        // }
       }
     }
 
@@ -426,58 +406,33 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
       return docsMatchingHeader;
     }
 
-
     @undoBatch
     @action
     onInternalDrop = (e: Event, de: DragManager.DropEvent) => {
-        const where = [de.x, de.y];
-        let dropInd = -1;
-        let dropAfter = 0;
         if (de.complete.docDragData) {
-            // const docs = this.getDocsFromXCoord(de.x)
-            const docs = this.childDocs
-            docs.map((d, i) => {
-              const pos0 = this.getDocTransform(d).inverse().transformPoint(-2 * this.gridGap, -2 * this.gridGap);
-              const pos1 = this.getDocTransform(d).inverse().transformPoint(this.getDocWidth(d), this.getDocHeight(d));
-              // const pos = d.noteTakingDocTransform().inverse().transformPoint(-2 * this.gridGap, -2 * this.gridGap);
-              // const pos1 = cd.noteTakingDocTransform().inverse().transformPoint(cd.width(), cd.height());
-              // const top = cd.height();
-              // const pos = cd.noteTakingDocTransform().transformPoint(0, cd.height());
-              // TODO: plan
-              // Get the top of the box
-              // Check if there could possibly be a box below
-              
-              // const pos1 = cd.noteTakingDocTransform().transformPoint(0, cd.height());
-              // if (where[0] > pos[0] && where[0] < pos1[0] && where[1] > pos[1] && (i === this._docXfs.length - 1 || where[1] < pos1[1])) {
-              if (where[1] > pos0[1] && (i === docs.length - 1 || where[1] < pos1[1])) {
-                  dropInd = i;
-                  const axis = 1;
-                  dropAfter = where[axis] > (pos0[axis] + pos1[axis]) / 2 ? 1 : 0;
-              }
-          });
-            //TODO: all of this is wrong
-            const oldDocs = this.childDocs.length;
             if (super.onInternalDrop(e, de)) {
-              // check to see if we actually need anything to the new column of nodes (if droppedDocs != empty)
-                const droppedDocs = this.childDocs.slice().filter((d: Doc, ind: number) => ind >= oldDocs); // if the drop operation adds something to the end of the list, then use that as the new document (may be different than what was dropped e.g., in the case of a button which is dropped but which creates say, a note).
-                const newDocs = droppedDocs.length ? droppedDocs : de.complete.docDragData.droppedDocuments; // if nothing was added to the end of the list, then presumably the dropped documents were already in the list, but possibly got reordered so we use them.
-
-                const docs = this.childDocList;
-                // reset drag manager docs, because we just dropped
-                DragManager.docsBeingDragged = [];
-                // TODO: I don't think we will actually need any of this, but doesn't hurt to be sure.
-                if (docs && newDocs.length) {
-                    const insertInd = dropInd === -1 ? docs.length : dropInd + dropAfter;
-                    const offset = newDocs.reduce((off, ndoc) => this.filteredChildren.find((fdoc, i) => ndoc === fdoc && i < insertInd) ? off + 1 : off, 0);
-                    newDocs.filter(ndoc => docs.indexOf(ndoc) !== -1).forEach(ndoc => docs.splice(docs.indexOf(ndoc), 1));
-                    // doesn't appear to be causing issues, but potentially could create
-                    // if (this.placeHolderDown) {
-                    //   docs.splice(0, 1);
-                    //   this.placeHolderDown = false
-                    // }
-                    docs.splice(insertInd - offset, 0, ...newDocs);
-                }
+              DragManager.docsBeingDragged = []
               this.docsDraggedRowCol = []
+              // filter out the currently dragged docs from the child docs, since we will insert them later
+              const rowCol = this.docsDraggedRowCol
+              const droppedDocs = this.childDocs.slice().filter((d: Doc, ind: number) => ind >= this.childDocs.length); // if the drop operation adds something to the end of the list, then use that as the new document (may be different than what was dropped e.g., in the case of a button which is dropped but which creates say, a note).
+              const newDocs = droppedDocs.length ? droppedDocs : de.complete.docDragData.droppedDocuments;
+              
+              const docs = this.childDocs
+              if (docs && newDocs.length) {
+                // remove the dragged documents from the childDocList
+                newDocs.filter(d => docs.indexOf(d) !== -1).forEach(d => docs.splice(docs.indexOf(d), 1))
+                // if the doc starts a columnm (or the drop index is undefined), we can just push it to the back. Otherwise we need to add it to the column properly
+                if (rowCol[0] <= 0) {
+                  docs.splice(docs.length - 1, 0, ...newDocs)
+                } else {
+                  const colDocs = this.getDocsFromXCoord(de.x)
+                  const previousDoc = colDocs[rowCol[0] - 1]
+                  const previousDocIndex = this.childDocs.findIndex(d => {d[Id] == previousDoc[Id]})
+                  //TODO: removing the doc instead of doing what we expect it to do
+                  docs.splice(previousDocIndex, 0, ...newDocs)
+                }
+              }
             }
         } // it seems like we're creating a link here. Weird. I didn't know that you could establish links by dragging
         else if (de.complete.linkDragData?.dragDocument.context === this.props.Document && de.complete.linkDragData?.linkDragView?.props.CollectionFreeFormDocumentView?.()) {
diff --git a/src/client/views/collections/CollectionNoteTakingViewColumn.tsx b/src/client/views/collections/CollectionNoteTakingViewColumn.tsx
index b299eb739..bdcb9c399 100644
--- a/src/client/views/collections/CollectionNoteTakingViewColumn.tsx
+++ b/src/client/views/collections/CollectionNoteTakingViewColumn.tsx
@@ -140,13 +140,6 @@ export class CollectionNoteTakingViewColumn extends React.Component<CSVFieldColu
         newDoc[key] = colValue;
         FormattedTextBox.SelectOnLoad = newDoc[Id];
         FormattedTextBox.SelectOnLoadChar = forceEmptyNote ? "" : " ";
-        // let currentDocs: Doc[] = []
-        // const docsFromMap = this.props.docsByColumnHeader.get(colValue)
-        // if (docsFromMap) {
-        //   currentDocs = [...docsFromMap]
-        // }
-        // currentDocs.push(newDoc)
-        // this.props.setDocsForColHeader(colValue, currentDocs)
         return this.props.addDocument?.(newDoc) || false;
     }