Fixed: Manual Import Movie filter Input losing focus

Fixes #4297

Co-Authored-By: Mark McDowall <markus101@users.noreply.github.com>

frontend/src/Components/Scroller/Scroller.js

@@ -17,6 +17,8 @@ class Scroller extends Component {
 
   componentDidMount() {
     const {
+      scrollDirection,
+      autoFocus,
       scrollTop
     } = this.props;
 
@@ -24,8 +26,10 @@ class Scroller extends Component {
       this._scroller.scrollTop = scrollTop;
     }
 
+    if (autoFocus && scrollDirection !== scrollDirections.NONE) {
       this._scroller.focus({ preventScroll: true });
     }
+  }
 
   //
   // Control
@@ -73,6 +77,7 @@ class Scroller extends Component {
 Scroller.propTypes = {
   className: PropTypes.string,
   scrollDirection: PropTypes.oneOf(scrollDirections.all).isRequired,
+  autoFocus: PropTypes.bool.isRequired,
   autoScroll: PropTypes.bool.isRequired,
   scrollTop: PropTypes.number,
   children: PropTypes.node,
@@ -82,6 +87,7 @@ Scroller.propTypes = {
 
 Scroller.defaultProps = {
   scrollDirection: scrollDirections.VERTICAL,
+  autoFocus: true,
   autoScroll: true,
   registerScroller: () => {}
 };

frontend/src/Components/Table/VirtualTable.js

@@ -95,6 +95,7 @@ class VirtualTable extends Component {
       className,
       items,
       scroller,
+      focusScroller,
       header,
       headerHeight,
       rowRenderer,
@@ -135,6 +136,7 @@ class VirtualTable extends Component {
               <Scroller
                 className={className}
                 scrollDirection={scrollDirections.HORIZONTAL}
+                autoFocus={focusScroller}
               >
                 {header}
                 <div ref={registerChild}>
@@ -179,6 +181,7 @@ VirtualTable.propTypes = {
   items: PropTypes.arrayOf(PropTypes.object).isRequired,
   scrollIndex: PropTypes.number,
   scroller: PropTypes.instanceOf(Element).isRequired,
+  focusScroller: PropTypes.bool.isRequired,
   header: PropTypes.node.isRequired,
   headerHeight: PropTypes.number.isRequired,
   rowRenderer: PropTypes.func.isRequired
@@ -186,7 +189,8 @@ VirtualTable.propTypes = {
 
 VirtualTable.defaultProps = {
   className: styles.tableContainer,
-  headerHeight: 38
+  headerHeight: 38,
+  focusScroller: true
 };
 
 export default VirtualTable;

frontend/src/InteractiveImport/Movie/SelectMovieModalContent.js

@@ -147,6 +147,7 @@ class SelectMovieModalContent extends Component {
           <Scroller
             registerScroller={this.setScrollerRef}
             className={styles.scroller}
+            autoFocus={false}
           >
             <div>
               {
@@ -159,6 +160,7 @@ class SelectMovieModalContent extends Component {
                     items={suggestions}
                     isSmallScreen={false}
                     scroller={scroller}
+                    focusScroller={false}
                     rowRenderer={this.rowRenderer}
                   />
               }