From 5fbda0813ec831a4fb6022e86fdf3fd58badd2d8 Mon Sep 17 00:00:00 2001
From: Mariusz Jurowicz <mariusz.jurowicz@xsolve.pl>
Date: Mon, 9 Jul 2018 11:18:28 +0200
Subject: [PATCH] #7338 fix widget resizing with fixed width columns

---
 .../src/tableDisplay/dataGrid/DataGridResize.ts  | 16 ++++++++++++----
 .../dataGrid/cell/ImageCellRenderer.ts           |  3 ++-
 .../src/tableDisplay/dataGrid/dataGridHelpers.ts |  2 +-
 3 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/js/notebook/src/tableDisplay/dataGrid/DataGridResize.ts b/js/notebook/src/tableDisplay/dataGrid/DataGridResize.ts
index 6e7069d278..3ecb18e4ca 100644
--- a/js/notebook/src/tableDisplay/dataGrid/DataGridResize.ts
+++ b/js/notebook/src/tableDisplay/dataGrid/DataGridResize.ts
@@ -28,9 +28,11 @@ import {DataGridHelpers} from "./dataGridHelpers";
 import {selectColumnWidth} from "./column/selectors";
 import getStringSize = DataGridHelpers.getStringSize;
 import {ALL_TYPES} from "./dataTypes";
+import throttle = DataGridHelpers.throttle;
 
 const DEFAULT_RESIZE_SECTION_SIZE_IN_PX = 6;
 const DEFAULT_ROW_PADDING = 4;
+const SCROLLBAR_WIDTH = 16;
 
 export class DataGridResize {
   dataGrid: BeakerXDataGrid;
@@ -49,6 +51,7 @@ export class DataGridResize {
     this.handleMouseMove = this.handleMouseMove.bind(this);
     this.handleMouseUp = this.handleMouseUp.bind(this);
     this.fillEmptySpaceResizeFn = this.fillEmptySpaceResizeFn.bind(this);
+    this.fitVieport = throttle<void, void>(this.fitVieport, 150, this);
 
     this.installMessageHook();
   }
@@ -76,6 +79,7 @@ export class DataGridResize {
 
   updateWidgetHeight(): void {
     this.dataGrid.node.style.minHeight = `${this.getWidgetHeight()}px`;
+    this.fitVieport();
   }
 
   updateWidgetWidth(): void {
@@ -83,17 +87,17 @@ export class DataGridResize {
     const hasVScroll = (
       this.dataGrid.rowManager.rowsToShow !== -1 && this.dataGrid.rowManager.rowsToShow <= this.dataGrid.model.rowCount('body')
     );
-    const vScrollWidth = hasVScroll ? this.dataGrid['_vScrollBarMinWidth'] + 1 : 0;
+    const vScrollWidth = hasVScroll ? SCROLLBAR_WIDTH : 0;
     const width = this.dataGrid.totalWidth + spacing + vScrollWidth;
 
     if (this.resizedHorizontally && width >= this.dataGrid.node.clientWidth) {
-      this.dataGrid.fit();
+      this.fitVieport();
 
       return;
     }
 
-    this.dataGrid.node.style.width = `${width}px`;
-    this.dataGrid.fit();
+    this.dataGrid.node.style.width = `${width + 1}px`;
+    this.fitVieport();
   }
 
   setInitialSectionWidths(): void {
@@ -201,6 +205,10 @@ export class DataGridResize {
     column.setWidth(value);
   }
 
+  fitVieport() {
+    this.dataGrid && this.dataGrid.fit();
+  }
+
   private fillEmptySpaceResizeFn(region: ColumnRegion, value: number) {
     return (section) => {
       let column = this.dataGrid.columnManager.getColumnByPosition({
diff --git a/js/notebook/src/tableDisplay/dataGrid/cell/ImageCellRenderer.ts b/js/notebook/src/tableDisplay/dataGrid/cell/ImageCellRenderer.ts
index 0368294633..670c3fbe05 100644
--- a/js/notebook/src/tableDisplay/dataGrid/cell/ImageCellRenderer.ts
+++ b/js/notebook/src/tableDisplay/dataGrid/cell/ImageCellRenderer.ts
@@ -94,9 +94,10 @@ export default class ImageCellRenderer extends CellRenderer {
 
       if (selectColumnWidth(this.dataGrid.store.state, column) < width) {
         column.dataGrid.dataGridResize.setSectionWidth("column", column, width);
-        column.dataGrid.dataGridResize.updateWidgetHeight();
         column.dataGrid.dataGridResize.updateWidgetWidth();
       }
+
+      column.dataGrid.dataGridResize.updateWidgetHeight();
     });
   }
 }
diff --git a/js/notebook/src/tableDisplay/dataGrid/dataGridHelpers.ts b/js/notebook/src/tableDisplay/dataGrid/dataGridHelpers.ts
index df6674ff63..ff2382f8be 100644
--- a/js/notebook/src/tableDisplay/dataGrid/dataGridHelpers.ts
+++ b/js/notebook/src/tableDisplay/dataGrid/dataGridHelpers.ts
@@ -121,7 +121,7 @@ export namespace DataGridHelpers {
     limit: number,
     context = this,
     controllObject?: { timerId: any }
-  ): (T) => U|undefined {
+  ): (T?) => U|undefined {
     let controll = controllObject || { timerId: undefined };
     let lastRan;