use registerChild to fix StrictMode on React 15+

jdrews · Jun 4, 2022 · e4e923b · e4e923b
1 parent e114a3a
commit e4e923b
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 24 deletions.
diff --git a/web/package-lock.json b/web/package-lock.json
diff --git a/web/package.json b/web/package.json
@@ -10,7 +10,7 @@
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-scripts": "4.0.3",
-    "react-virtualized": "9.21.1",
+    "react-virtualized": "9.22.1",
     "reconnecting-websocket": "^4.4.0",
     "web-vitals": "^1.1.2",
     "websocket": "^1.0.34"

diff --git a/web/src/LogViewer.js b/web/src/LogViewer.js
@@ -81,7 +81,9 @@ export default class LogViewer extends React.Component {
 
     rowRenderer = ({ index, isScrolling, key, style, ...rest }) => (
         <CellMeasurer {...rest} rowIndex={index} columnIndex={0} cache={this.cache}>
-            <div
+            {({registerChild}) => (
+                <div
+                ref={registerChild}
                 className="Row"
                 key={key}
                 style={{
@@ -94,7 +96,7 @@ export default class LogViewer extends React.Component {
                 }}
             >
                 {this.state.lines[index]}
-            </div>
+            </div> )}
         </CellMeasurer>
 
     );
@@ -108,7 +110,7 @@ export default class LogViewer extends React.Component {
                     {({height}) => (
                         <List
                             // ref={this.setListRef}
-                            ref={(list)=>{this.listRef = list}}
+                            ref={ref => {this.listRef = ref}}
                             onScroll={this.handleScroll}
                             height={height}
                             rowCount={this.state.lines.length}