From c710372699c7bcb983d07730d8e6ed0f662550b8 Mon Sep 17 00:00:00 2001
From: Kirill Shumilov <brusher.designer@gmail.com>
Date: Mon, 28 Dec 2020 22:09:53 +0300
Subject: [PATCH] feat(xod-client): autoscroll deployment log to the bottom
 when resizing done

---
 .../src/debugger/containers/Log.jsx           | 22 ++++++++++++++++---
 1 file changed, 19 insertions(+), 3 deletions(-)

diff --git a/packages/xod-client/src/debugger/containers/Log.jsx b/packages/xod-client/src/debugger/containers/Log.jsx
index 9df3f7240..9de665240 100644
--- a/packages/xod-client/src/debugger/containers/Log.jsx
+++ b/packages/xod-client/src/debugger/containers/Log.jsx
@@ -19,6 +19,7 @@ class Log extends React.PureComponent {
     this.autoscrollRef = null;
 
     this.onFollowLog = this.onFollowLog.bind(this);
+    this.onFollowLogClicked = this.onFollowLogClicked.bind(this);
     this.scrollToBottom = this.scrollToBottom.bind(this);
   }
 
@@ -31,8 +32,16 @@ class Log extends React.PureComponent {
     }, 0);
   }
 
-  componentDidUpdate() {
-    if (this.props.log.length === 0) {
+  componentDidUpdate(prevProps) {
+    // To trigger scroll to the bottom and follow log
+    // after resizing the parents component we're checking for
+    // change of `doNotSkipLines` property from `true` to `false`
+    const skipLinesJustTurnedOn =
+      prevProps.doNotSkipLines && !this.props.doNotSkipLines;
+    if (
+      this.props.log.length === 0 ||
+      (skipLinesJustTurnedOn && !this.props.isSkippingNewSerialLogLines)
+    ) {
       this.onFollowLog(false);
     }
   }
@@ -42,6 +51,10 @@ class Log extends React.PureComponent {
     this.props.stopSkippingNewLogLines(addSkipMessage);
   }
 
+  onFollowLogClicked(_event) {
+    this.onFollowLog(true);
+  }
+
   scrollToBottom() {
     if (this.autoscrollRef) {
       this.autoscrollRef.scrollDown();
@@ -74,7 +87,10 @@ class Log extends React.PureComponent {
         {R.isEmpty(error) ? null : <div className="error">{error}</div>}
         {isSkipOnScrollEnabled && isSkippingNewSerialLogLines ? (
           <div className="skipped">
-            <button className="Button Button--small" onClick={this.onFollowLog}>
+            <button
+              className="Button Button--small"
+              onClick={this.onFollowLogClicked}
+            >
               Follow log ({numberOfSkippedSerialLogLines} new lines skipped)
             </button>
           </div>