From f06fb7892b01fa7f7e74c7e4af013a79412ac54c Mon Sep 17 00:00:00 2001
From: Alex Culliere <alozhkin@mirantis.com>
Date: Mon, 15 Feb 2021 14:12:29 +0200
Subject: [PATCH] Isolate ergonomic constants to a separate module

Signed-off-by: Alex Culliere <alozhkin@mirantis.com>
---
 src/renderer/components/table/constants.ts   |  7 +++++
 src/renderer/components/table/table-cell.tsx | 30 +++++++-------------
 2 files changed, 17 insertions(+), 20 deletions(-)
 create mode 100644 src/renderer/components/table/constants.ts

diff --git a/src/renderer/components/table/constants.ts b/src/renderer/components/table/constants.ts
new file mode 100644
index 0000000000..be71f2d0b0
--- /dev/null
+++ b/src/renderer/components/table/constants.ts
@@ -0,0 +1,7 @@
+/**
+ * Ergonomic rate for throttling mouse events
+ * when resizing, in miliseconds.
+ * Represents optimal balance between user-facing latency
+ * and rendering performance 
+ */
+export const ERGONOMIC_RESIZE_THROTTLE_RATE = 10;
diff --git a/src/renderer/components/table/table-cell.tsx b/src/renderer/components/table/table-cell.tsx
index 7797b968bc..d5f282358c 100644
--- a/src/renderer/components/table/table-cell.tsx
+++ b/src/renderer/components/table/table-cell.tsx
@@ -1,11 +1,12 @@
-import "./table-cell.scss";
-import type { TableSortBy, TableSortParams } from "./table";
-
 import React, { ReactNode } from "react";
 import { throttle } from "lodash";
-import { autobind, cssNames, displayBooleans } from "../../utils";
+
+import "./table-cell.scss";
+import type { TableSortBy, TableSortParams } from "./table";
+import { autobind, cssNames, displayBooleans, prevDefault } from "../../utils";
 import { Icon } from "../icon";
 import { Checkbox } from "../checkbox";
+import { ERGONOMIC_RESIZE_THROTTLE_RATE } from "./constants";
 
 export type TableCellElem = React.ReactElement<TableCellProps>;
 
@@ -30,23 +31,10 @@ type ResizeHandlerState = {
   mousePosX?: number,
 };
 
-/**
- * Ergonomic rate for throttling mouse events
- * when resizing, in miliseconds.
- * Represents optimal balance between user-facing latency
- * and rendering performance 
- */
-const ERGONOMIC_THROTTLE_RATE = 10;
-
-export class TableCell extends React.Component<TableCellProps, ResizeHandlerState> {
+export class TableCell extends React.Component<TableCellProps> {
   private resizeHandlerState?: ResizeHandlerState;
   private cellContainer: React.RefObject<HTMLDivElement> = React.createRef();
 
-  constructor(props: TableCellProps) {
-    super(props);
-    this.state = {};
-  }
-
   @autobind()
   onClick(evt: React.MouseEvent<HTMLDivElement>) {
     if (this.props.onClick) {
@@ -112,7 +100,7 @@ export class TableCell extends React.Component<TableCellProps, ResizeHandlerStat
 
     this.props?._onResize(currentWidth + diffPosX);
     this.resizeHandlerState.mousePosX = event.pageX;
-  }, ERGONOMIC_THROTTLE_RATE);
+  }, ERGONOMIC_RESIZE_THROTTLE_RATE);
 
   mouseUpHandler() {
     this.removeMouseEventListeners();
@@ -136,7 +124,9 @@ export class TableCell extends React.Component<TableCellProps, ResizeHandlerStat
           mousePosX: event.pageX
         };
         this.addMouseEventListeners();
-      }
+      },
+      // prevent click events from triggering
+      onClick: prevDefault(() => {})
     };
 
     return (