Make columns itself scrollable, fix action creation when moving card, little refactoring

client/src/lib/custom-ui/components/DragScroller/DragScroller.jsx

@@ -1,62 +0,0 @@
-import React, { useCallback, useEffect, useRef } from 'react';
-import PropTypes from 'prop-types';
-
-const DragScroller = React.memo(({ children, ...props }) => {
-  const wrapper = useRef(null);
-  const prevPosition = useRef(null);
-
-  const handleMouseDown = useCallback(
-    (event) => {
-      if (event.target !== wrapper.current && !event.target.dataset.dragScroller) {
-        return;
-      }
-
-      prevPosition.current = event.clientX;
-    },
-    [wrapper],
-  );
-
-  const handleWindowMouseMove = useCallback(
-    (event) => {
-      if (!prevPosition.current) {
-        return;
-      }
-
-      event.preventDefault();
-
-      const position = event.clientX;
-
-      wrapper.current.scrollLeft -= -prevPosition.current + position;
-      prevPosition.current = position;
-    },
-    [wrapper, prevPosition],
-  );
-
-  const handleWindowMouseUp = useCallback(() => {
-    prevPosition.current = null;
-  }, [prevPosition]);
-
-  useEffect(() => {
-    window.addEventListener('mouseup', handleWindowMouseUp);
-    window.addEventListener('mousemove', handleWindowMouseMove);
-
-    return () => {
-      window.removeEventListener('mouseup', handleWindowMouseUp);
-      window.removeEventListener('mousemove', handleWindowMouseMove);
-    };
-  }, [handleWindowMouseUp, handleWindowMouseMove]);
-
-  return (
-    /* eslint-disable jsx-a11y/no-static-element-interactions, react/jsx-props-no-spreading */
-    <div {...props} ref={wrapper} onMouseDown={handleMouseDown}>
-      {/* eslint-enable jsx-a11y/no-static-element-interactions, react/jsx-props-no-spreading */}
-      {children}
-    </div>
-  );
-});
-
-DragScroller.propTypes = {
-  children: PropTypes.node.isRequired,
-};
-
-export default DragScroller;

client/src/lib/custom-ui/components/DragScroller/index.js

@@ -1,3 +0,0 @@
-import DragScroller from './DragScroller';
-
-export default DragScroller;

client/src/lib/custom-ui/index.css

@@ -827,7 +827,7 @@ input::selection {
 
 /* Force Simple Scrollbars */
 
-body ::-webkit-scrollbar {
+/* body ::-webkit-scrollbar {
   -webkit-appearance: none;
   width: 10px;
   height: 10px;
@@ -852,11 +852,11 @@ body ::-webkit-scrollbar-thumb:window-inactive {
 
 body ::-webkit-scrollbar-thumb:hover {
   background: rgba(128, 135, 139, 0.8);
-}
+} */
 
 /* Inverted UI */
 
-body .ui.inverted::-webkit-scrollbar-track {
+/* body .ui.inverted::-webkit-scrollbar-track {
   background: rgba(255, 255, 255, 0.1);
 }
 
@@ -870,7 +870,7 @@ body .ui.inverted::-webkit-scrollbar-thumb:window-inactive {
 
 body .ui.inverted::-webkit-scrollbar-thumb:hover {
   background: rgba(255, 255, 255, 0.35);
-}
+} */
 
 /*******************************
         Global Overrides

client/src/lib/custom-ui/index.js

@@ -2,6 +2,5 @@ import Input from './components/Input';
 import Popup from './components/Popup';
 import Markdown from './components/Markdown';
 import FilePicker from './components/FilePicker';
-import DragScroller from './components/DragScroller';
 
-export { Input, Popup, Markdown, FilePicker, DragScroller };
+export { Input, Popup, Markdown, FilePicker };