migrate string-refs in user_list.jsx

components/__snapshots__/user_list.test.jsx.snap

@@ -0,0 +1,49 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`components/UserList should match default snapshot 1`] = `
+<div>
+  <div
+    className="more-modal__placeholder-row"
+    data-testid="noUsersFound"
+    key="no-users-found"
+  >
+    <p>
+      <FormattedMessage
+        defaultMessage="No users found"
+        id="user_list.notFound"
+      />
+    </p>
+  </div>
+</div>
+`;
+
+exports[`components/UserList should match default snapshot when there are users 1`] = `
+<div>
+  <Connect(UserListRow)
+    actionProps={Object {}}
+    actions={Array []}
+    index={0}
+    key="id1"
+    totalUsers={2}
+    user={
+      Object {
+        "id": "id1",
+      }
+    }
+    userCount={-1}
+  />
+  <Connect(UserListRow)
+    actionProps={Object {}}
+    actions={Array []}
+    index={1}
+    key="id2"
+    totalUsers={2}
+    user={
+      Object {
+        "id": "id2",
+      }
+    }
+    userCount={-1}
+  />
+</div>
+`;

components/user_list.jsx

@@ -1,6 +1,5 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
-/* eslint-disable react/no-string-refs */
 
 import PropTypes from 'prop-types';
 import React from 'react';
@@ -21,7 +20,7 @@ export default class UserList extends React.PureComponent {
         isDisabled: PropTypes.bool,
 
         // the type of user list row to render
-        rowComponentType: PropTypes.node,
+        rowComponentType: PropTypes.object,
     }
 
     static defaultProps = {
@@ -32,9 +31,14 @@ export default class UserList extends React.PureComponent {
         rowComponentType: UserListRow,
     }
 
+    constructor(props) {
+        super(props);
+        this.containerRef = React.createRef();
+    }
+
     scrollToTop = () => {
-        if (this.refs.container) {
-            this.refs.container.scrollTop = 0;
+        if (this.containerRef.current) {
+            this.containerRef.current.scrollTop = 0;
         }
     }
 
@@ -80,10 +84,9 @@ export default class UserList extends React.PureComponent {
         }
 
         return (
-            <div ref='container'>
+            <div ref={this.containerRef}>
                 {content}
             </div>
         );
     }
 }
-/* eslint-enable react/no-string-refs */

components/user_list.test.jsx

@@ -0,0 +1,30 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import React from 'react';
+import {shallow} from 'enzyme';
+
+import UserList from './user_list.jsx';
+
+describe('components/UserList', () => {
+    test('should match default snapshot', () => {
+        const wrapper = shallow(
+            <UserList/>,
+        );
+        expect(wrapper).toMatchSnapshot();
+    });
+
+    test('should match default snapshot when there are users', () => {
+        const props = {
+            users: [
+                {id: 'id1'},
+                {id: 'id2'},
+            ],
+            actionUserProps: {},
+        };
+        const wrapper = shallow(
+            <UserList {...props}/>,
+        );
+        expect(wrapper).toMatchSnapshot();
+    });
+});