fix(grid): do not scroll to last item when scrollTop is bigger than 4 times the viewport (#228)

ui/.eslintrc.js

@@ -17,6 +17,7 @@ module.exports = {
     "prettier/babel",
     "prettier/standard",
   ],
+  globals: { ace: true },
   parser: "@typescript-eslint/parser",
   parserOptions: {
     ecmaFeatures: {},
@@ -29,6 +30,8 @@ module.exports = {
   rules: {
     "@typescript-eslint/prefer-interface": "off",
     "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/explicit-function-return-type": "off",
+    "@typescript-eslint/no-this-alias": "off",
     "quote-props": ["error", "as-needed"],
     "object-shorthand": ["error", "always"],
     "no-var": ["error"],

ui/package.json

@@ -12,7 +12,7 @@
     "node": ">=12.16.2"
   },
   "scripts": {
-    "ci:lint:ts": "eslint 'src/**/*.ts' --max-warnings=0 --config .eslintrc.js",
+    "ci:lint": "eslint 'src/js/**/*' --max-warnings=0 --config .eslintrc.js",
     "type-check": "tsc --noEmit",
     "type-check:watch": "npm run type-check -- --watch",
     "build": "cross-env NODE_ENV=production webpack && node utils/deploy.js",

ui/src/js/console/grid.js

@@ -490,41 +490,32 @@ $.fn.grid = function (msgBus) {
     }
   }
 
-  function viewportScroll(force) {
+  function viewportScroll(event) {
     header.scrollLeft(viewport.scrollLeft)
 
     var scrollTop = viewport.scrollTop
-    if (scrollTop !== top || force) {
+    if (scrollTop !== top || event) {
       var oldY = y
-      if (Math.abs(scrollTop - top) > 4 * vp) {
-        y =
-          scrollTop === 0
-            ? 0
-            : Math.min(Math.ceil((scrollTop + vp) * M - vp), yMax - vp)
+      // if grid content fits in viewport we don't need to adjust activeRow
+      if (scrollTop >= h - vp) {
+        // final leap to bottom of grid
+        // this happens when container div runs out of vertical height
+        // and we artificially force leap to bottom
+        y = Math.max(0, yMax - vp)
         top = scrollTop
         o = y - top
-      } else if (h - vp > 0) {
-        // if grid content fits in viewport we don't need to adjust activeRow
-        if (scrollTop >= h - vp) {
-          // final leap to bottom of grid
-          // this happens when container div runs out of vertical height
-          // and we artificially force leap to bottom
-          y = Math.max(0, yMax - vp)
-          top = scrollTop
-          o = y - top
-          activeRowDown(r - activeRow)
+        activeRowDown(r - activeRow)
+      } else {
+        if (scrollTop === 0 && top > 0) {
+          // this happens when grid is coming slowly back up after being scrolled down harshly
+          // because 'y' is much greater than top, we have to jump to top artificially.
+          y = 0
+          o = 0
+          activeRowUp(activeRow)
         } else {
-          if (scrollTop === 0 && top > 0) {
-            // this happens when grid is coming slowly back up after being scrolled down harshly
-            // because 'y' is much greater than top, we have to jump to top artificially.
-            y = 0
-            o = 0
-            activeRowUp(activeRow)
-          } else {
-            y += scrollTop - top
-          }
-          top = scrollTop
+          y += scrollTop - top
         }
+        top = scrollTop
       }
       renderViewport(y - oldY)
     }