fix(AnalyticalTable): Fixed resizable columns and horizontal scrolling (#211)

Author: Lukas742

packages/main/src/components/AnalyticalTable/ColumnHeader/Resizer.tsx

@@ -13,7 +13,7 @@ const Resizer = (props) => {
     (e) => {
       e.stopPropagation();
       const pageX = e.pageX;
-      const newWidth = Math.max(parentWidth.current + pageX - startX.current, column.minWidth);
+      const newWidth = Math.round(Math.max(parentWidth.current + pageX - startX.current, column.minWidth));
       onColumnSizeChanged({
         column,
         width: newWidth

packages/main/src/components/AnalyticalTable/ColumnHeader/index.tsx

@@ -132,7 +132,7 @@ export const ColumnHeader: FC<ColumnHeaderProps> = (props) => {
           onGroupBy={onGroupBy}
         />
       ) : (
-        openBy
+        <div style={{ ...innerStyle, display: 'inline-block', cursor: 'auto' }}>{openBy}</div>
       )}
       {isResizable && <Resizer {...props} />}
     </div>

packages/main/src/components/AnalyticalTable/hooks/useWindowResize.ts

@@ -6,7 +6,7 @@ export const useWindowResize = () => {
   const [tableWidth, setTableWidth] = useState(0);
   const onWindowResize = useCallback(() => {
     if (headerRef.current) {
-      setTableWidth(headerRef.current.scrollWidth);
+      setTableWidth(headerRef.current.getBoundingClientRect().width);
     }
   }, [setTableWidth, headerRef.current]);