sizing works but undo redo no longer does

1 files changed, 25 insertions, 15 deletions

diff --git a/src/client/views/collections/CollectionNoteTakingView.tsx b/src/client/views/collections/CollectionNoteTakingView.tsx
index b3e154dac..0aa1b6839 100644
--- a/src/client/views/collections/CollectionNoteTakingView.tsx
+++ b/src/client/views/collections/CollectionNoteTakingView.tsx
@@ -72,7 +72,7 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
         //     return 3 2 1 4 56
         // }
         if (needsUnsetCategory) {
-            columnHeaders.push(new SchemaHeaderField('unset', undefined, undefined, this.maxColWdith));
+            columnHeaders.push(new SchemaHeaderField('unset', undefined, undefined, 1));
         }
         return columnHeaders;
     }
@@ -103,16 +103,20 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
     @computed get PanelWidth() {
         return this.props.PanelWidth();
     }
-    @computed get maxColWdith() {
+    @computed get maxColWidth() {
         return this.props.PanelWidth() - 2 * this.xMargin;
     }
+    @computed get availableWidth() {
+        const numDividers = this.columnHeaders.length - 1;
+        return this.maxColWidth - numDividers * this.dividerWidth;
+    }
 
     // If the user has not yet created any docs (in another view), this will create a single column. Otherwise,
     // it will adjust according to the
     constructor(props: any) {
         super(props);
         if (this.columnHeaders === undefined) {
-            this.dataDoc.columnHeaders = new List<SchemaHeaderField>([new SchemaHeaderField('New Column', undefined, undefined, this.maxColWdith)]);
+            this.dataDoc.columnHeaders = new List<SchemaHeaderField>([new SchemaHeaderField('New Column', undefined, undefined, 1)]);
             // add all of the docs that have not been added to a column to this new column
         }
     }
@@ -186,7 +190,7 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
         // this._disposers.headers = reaction(
         //     () => this.columnHeaders.slice(),
         //     // TODO: is this correct?
-        //     headers => this.resizeColumns(headers.length, true),
+        //     headers => this.resizeColumns(headers.length, false),
         //     { fireImmediately: true }
         // );
     }
@@ -334,7 +338,7 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
         const heading = !d[this.notetakingCategoryField] ? 'unset' : Field.toString(d[this.notetakingCategoryField] as Field);
         const existingHeader = this.columnHeaders.find(sh => sh.heading === heading);
         const existingWidth = existingHeader?.width ? existingHeader.width : 0;
-        const maxWidth = existingWidth > 0 ? existingWidth : this.maxColWdith - 2 * this.xMargin;
+        const maxWidth = existingWidth > 0 ? existingWidth * this.availableWidth - 2 * this.xMargin : this.maxColWidth - 2 * this.xMargin;
         // const index = existingHeader ? this.columnHeaders.indexOf(existingHeader) : 0;
         // const endColValue = index === this.columnHeaders.length - 1 || index > this.columnStartXCoords.length - 1 ? this.PanelWidth : this.columnStartXCoords[index + 1];
         // const maxWidth = index > this.columnStartXCoords.length - 1 ? this.PanelWidth : endColValue - this.columnStartXCoords[index] - 3 * this.xMargin;
@@ -367,10 +371,14 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
     // called when a column is either added or deleted. This function creates n evenly spaced columns
     @action
     resizeColumns = (n: number, isAdd: boolean) => {
-        let scaleFactor = isAdd ? Math.floor((n - 1)) / n : Math.floor((n + 1) / n);
-        if (isAdd && n == 1) scaleFactor = 1;
+        if (n == 1) {
+          this.columnHeaders[0].setWidth(1);
+          return;
+        }
+        let scaleFactor = isAdd ? (n - 1) / n : (n + 1) / n;
+        // if (isAdd && n == 1) scaleFactor = 1;
         this.columnHeaders.forEach(h => {
-          h.width < 0 ? h.setWidth((this.maxColWdith - this.dividerWidth) / n) : h.setWidth(h.width * scaleFactor);
+            h.width < 0 ? h.setWidth(1 / n) : h.setWidth(h.width * scaleFactor);
         });
         // if we're adding, need to
 
@@ -424,7 +432,7 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
         let colStartXCoord = 0;
         for (let i = 0; i < numColumns; i++) {
             coords.push(colStartXCoord);
-            colStartXCoord += this.columnHeaders[i].width + this.dividerWidth;
+            colStartXCoord += this.columnHeaders[i].width * this.availableWidth + this.dividerWidth;
         }
 
         coords.push(this.PanelWidth);
@@ -600,13 +608,15 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
                 columnHeaders={this.columnHeaders}
                 Document={this.props.Document}
                 DataDoc={this.props.DataDoc}
-                // resizeColumns={this.resizeColumns}
+                resizeColumns={this.resizeColumns}
                 renderChildren={this.children}
                 numGroupColumns={this.numGroupColumns}
                 gridGap={this.gridGap}
                 pivotField={this.notetakingCategoryField}
                 // columnStartXCoords={this.columnStartXCoords}
-                maxColWidth={this.maxColWdith}
+                dividerWidth={this.dividerWidth}
+                maxColWidth={this.maxColWidth}
+                availableWidth={this.availableWidth}
                 PanelWidth={this.PanelWidth}
                 key={heading?.heading ?? ''}
                 headings={this.headings}
@@ -628,9 +638,9 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
     @undoBatch
     addGroup = (value: string) => {
         const columnHeaders = Cast(this.props.Document.columnHeaders, listSpec(SchemaHeaderField), null);
-        const colWidth = (this.PanelWidth - this.numGroupColumns * this.dividerWidth) / (this.numGroupColumns + 1);
+        // const colWidth = (this.PanelWidth - this.numGroupColumns * this.dividerWidth) / (this.numGroupColumns + 1);
         this.resizeColumns(this.numGroupColumns + 1, true);
-        return value && columnHeaders?.push(new SchemaHeaderField(value, undefined, undefined, colWidth)) ? true : false;
+        return value && columnHeaders?.push(new SchemaHeaderField(value, undefined, undefined, 1 / (this.numGroupColumns + 1))) ? true : false;
     };
 
     sortFunc = (a: [SchemaHeaderField, Doc[]], b: [SchemaHeaderField, Doc[]]): 1 | -1 => {
@@ -656,8 +666,8 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti
     setColumnStartXCoords = (movementX: number, colIndex: number) => {
         const leftHeader = this.columnHeaders[colIndex];
         const rightHeader = this.columnHeaders[colIndex + 1];
-        leftHeader.setWidth(leftHeader.width + movementX);
-        rightHeader.setWidth(rightHeader.width - movementX);
+        leftHeader.setWidth(leftHeader.width + movementX / this.availableWidth);
+        rightHeader.setWidth(rightHeader.width - movementX / this.availableWidth);
         // const coords = [...this.columnStartXCoords];
         // coords[colIndex] += movementX;
         // this.columnStartXCoords = coords;