From 118ed207a1f55b8326571d4305319fb4e3d5239f Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Wed, 21 Oct 2020 09:57:42 +0300
Subject: [PATCH] Setting ref for VirtualList to access its methods

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 src/renderer/components/dock/pod-logs.tsx           | 10 ++++++----
 .../components/virtual-list/virtual-list.tsx        | 13 +++++--------
 2 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/renderer/components/dock/pod-logs.tsx b/src/renderer/components/dock/pod-logs.tsx
index d87cd84147..dd343f10d3 100644
--- a/src/renderer/components/dock/pod-logs.tsx
+++ b/src/renderer/components/dock/pod-logs.tsx
@@ -12,7 +12,7 @@ import { InfoPanel } from "./info-panel";
 import { IPodLogsData, logRange, podLogsStore } from "./pod-logs.store";
 import { Button } from "../button";
 import { PodLogControls } from "./pod-log-controls";
-import { VirtualListRef } from "../virtual-list";
+import { VirtualList } from "../virtual-list";
 import debounce from "lodash/debounce";
 
 interface Props {
@@ -29,7 +29,8 @@ export class PodLogs extends React.Component<Props> {
   @observable showJumpToBottom = false;
   @observable findQuery = ""; // A text from search field
 
-  private logsElement = React.createRef<HTMLDivElement>();  // A reference for outer container in VirtualList
+  private logsElement = React.createRef<HTMLDivElement>(); // A reference for outer container in VirtualList
+  private virtualListRef = React.createRef<VirtualList>(); // A reference for VirtualList component
   private lastLineIsShown = true; // used for proper auto-scroll content after refresh
 
   componentDidMount() {
@@ -208,12 +209,13 @@ export class PodLogs extends React.Component<Props> {
             <Spinner center />
           </div>
         )}
-        <VirtualListRef
+        <VirtualList
           items={this.logs}
           rowHeights={rowHeights}
           getRow={this.getLogRow}
           onScroll={this.onScroll}
-          ref={this.logsElement}
+          outerRef={this.logsElement}
+          ref={this.virtualListRef}
         />
       </>
     );
diff --git a/src/renderer/components/virtual-list/virtual-list.tsx b/src/renderer/components/virtual-list/virtual-list.tsx
index 8e21f225d5..73dd4201ba 100644
--- a/src/renderer/components/virtual-list/virtual-list.tsx
+++ b/src/renderer/components/virtual-list/virtual-list.tsx
@@ -83,6 +83,10 @@ export class VirtualList extends Component<Props, State> {
     this.listRef.current.scrollToItem(index, "start");
   })
 
+  scrollToItem = (index: number) => {
+    this.listRef.current.scrollToItem(index)
+  }
+
   render() {
     const { width, className, items, getRow, onScroll, outerRef } = this.props;
     const { height, overscanCount } = this.state;
@@ -129,11 +133,4 @@ const Row = observer((props: RowProps) => {
   return React.cloneElement(row, {
     style: Object.assign({}, row.props.style, style)
   });
-})
-
-// A wrapper for passing ref back to parent component. This allows parent
-// to control behavior of child component's DOM node. Scrolling event in our case.
-// More info about ref forwading: https://reactjs.org/docs/forwarding-refs.html#forwarding-refs-to-dom-components
-export const VirtualListRef = React.forwardRef((props: Props, ref) => (
-  <VirtualList outerRef={ref} {...props} />
-));
\ No newline at end of file
+})
\ No newline at end of file