From e1254a053ab835437f5e83ff75572434e9bd8e00 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Mon, 15 Mar 2021 08:38:47 -0700
Subject: [PATCH 1/8] Fix log container taller than viewport

---
 src-ui/src/app/components/manage/logs/logs.component.html | 2 +-
 src-ui/src/app/components/manage/logs/logs.component.scss | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.html b/src-ui/src/app/components/manage/logs/logs.component.html
index 5b2d198c9..e631ff46e 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.html
+++ b/src-ui/src/app/components/manage/logs/logs.component.html
@@ -11,7 +11,7 @@
 
 <div [ngbNavOutlet]="nav" class="mt-2"></div>
 
-<div class="bg-dark p-3 mb-3 text-light text-monospace log-container">
+<div class="bg-dark p-3 text-light text-monospace log-container">
   <p
     class="m-0 p-0 log-entry-{{getLogLevel(log)}}"
     *ngFor="let log of logs">{{log}}</p>
diff --git a/src-ui/src/app/components/manage/logs/logs.component.scss b/src-ui/src/app/components/manage/logs/logs.component.scss
index aae238167..834c8c1cb 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.scss
+++ b/src-ui/src/app/components/manage/logs/logs.component.scss
@@ -17,7 +17,7 @@
 
 .log-container {
   overflow-y: scroll;
-  height: calc(100vh - 190px);
+  height: calc(100vh - 200px);
   top: 70px;
 
   p {

From 2e21fbf61991a66be247f73fa2051d7f02206724 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Mon, 15 Mar 2021 08:38:55 -0700
Subject: [PATCH 2/8] Reverse log order

---
 src-ui/src/app/components/manage/logs/logs.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.html b/src-ui/src/app/components/manage/logs/logs.component.html
index e631ff46e..fceac0f78 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.html
+++ b/src-ui/src/app/components/manage/logs/logs.component.html
@@ -14,5 +14,5 @@
 <div class="bg-dark p-3 text-light text-monospace log-container">
   <p
     class="m-0 p-0 log-entry-{{getLogLevel(log)}}"
-    *ngFor="let log of logs">{{log}}</p>
+    *ngFor="let log of logs.reverse()">{{log}}</p>
 </div>

From 316a2469b82bc9311e9a56a0b30717a045e63584 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Mon, 15 Mar 2021 08:42:10 -0700
Subject: [PATCH 3/8] Side effecting

---
 src-ui/src/app/components/manage/logs/logs.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.html b/src-ui/src/app/components/manage/logs/logs.component.html
index fceac0f78..caa4ca23b 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.html
+++ b/src-ui/src/app/components/manage/logs/logs.component.html
@@ -14,5 +14,5 @@
 <div class="bg-dark p-3 text-light text-monospace log-container">
   <p
     class="m-0 p-0 log-entry-{{getLogLevel(log)}}"
-    *ngFor="let log of logs.reverse()">{{log}}</p>
+    *ngFor="let log of logs.slice().reverse()">{{log}}</p>
 </div>

From 46be3924e4955fbc6fb9228c447a4dac840d0ff2 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Mon, 15 Mar 2021 08:45:30 -0700
Subject: [PATCH 4/8] Revert "Side effecting"

This reverts commit 316a2469b82bc9311e9a56a0b30717a045e63584.
---
 src-ui/src/app/components/manage/logs/logs.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.html b/src-ui/src/app/components/manage/logs/logs.component.html
index caa4ca23b..fceac0f78 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.html
+++ b/src-ui/src/app/components/manage/logs/logs.component.html
@@ -14,5 +14,5 @@
 <div class="bg-dark p-3 text-light text-monospace log-container">
   <p
     class="m-0 p-0 log-entry-{{getLogLevel(log)}}"
-    *ngFor="let log of logs.slice().reverse()">{{log}}</p>
+    *ngFor="let log of logs.reverse()">{{log}}</p>
 </div>

From a94a81d839e5f0208f1323e62b21398fe5377cab Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Mon, 15 Mar 2021 08:45:33 -0700
Subject: [PATCH 5/8] Revert "Reverse log order"

This reverts commit 2e21fbf61991a66be247f73fa2051d7f02206724.
---
 src-ui/src/app/components/manage/logs/logs.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.html b/src-ui/src/app/components/manage/logs/logs.component.html
index fceac0f78..e631ff46e 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.html
+++ b/src-ui/src/app/components/manage/logs/logs.component.html
@@ -14,5 +14,5 @@
 <div class="bg-dark p-3 text-light text-monospace log-container">
   <p
     class="m-0 p-0 log-entry-{{getLogLevel(log)}}"
-    *ngFor="let log of logs.reverse()">{{log}}</p>
+    *ngFor="let log of logs">{{log}}</p>
 </div>

From b9d09549243afa98427b422df3baede76600a6b4 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Mon, 15 Mar 2021 09:56:17 -0700
Subject: [PATCH 6/8] Automatically scroll log ouput

---
 .../manage/logs/logs.component.html           |  2 +-
 .../components/manage/logs/logs.component.ts  | 19 +++++++++++++++++--
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.html b/src-ui/src/app/components/manage/logs/logs.component.html
index e631ff46e..0633daf32 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.html
+++ b/src-ui/src/app/components/manage/logs/logs.component.html
@@ -11,7 +11,7 @@
 
 <div [ngbNavOutlet]="nav" class="mt-2"></div>
 
-<div class="bg-dark p-3 text-light text-monospace log-container">
+<div class="bg-dark p-3 text-light text-monospace log-container" #logContainer>
   <p
     class="m-0 p-0 log-entry-{{getLogLevel(log)}}"
     *ngFor="let log of logs">{{log}}</p>
diff --git a/src-ui/src/app/components/manage/logs/logs.component.ts b/src-ui/src/app/components/manage/logs/logs.component.ts
index d77fcde4a..fd99abc2a 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.ts
+++ b/src-ui/src/app/components/manage/logs/logs.component.ts
@@ -1,4 +1,4 @@
-import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
+import { Component, ElementRef, AfterViewChecked, ViewChild } from '@angular/core';
 import { LogService } from 'src/app/services/rest/log.service';
 
 @Component({
@@ -6,7 +6,7 @@ import { LogService } from 'src/app/services/rest/log.service';
   templateUrl: './logs.component.html',
   styleUrls: ['./logs.component.scss']
 })
-export class LogsComponent implements OnInit {
+export class LogsComponent implements AfterViewChecked {
 
   constructor(private logService: LogService) { }
 
@@ -16,6 +16,8 @@ export class LogsComponent implements OnInit {
 
   activeLog: string
 
+  @ViewChild('logContainer') logContainer: ElementRef
+
   ngOnInit(): void {
     this.logService.list().subscribe(result => {
       this.logFiles = result
@@ -26,9 +28,14 @@ export class LogsComponent implements OnInit {
     })
   }
 
+  ngAfterViewChecked() {
+    this.scrollToBottom();
+  }
+
   reloadLogs() {
     this.logService.get(this.activeLog).subscribe(result => {
       this.logs = result
+      this.scrollToBottom()
     }, error => {
       this.logs = []
     })
@@ -48,4 +55,12 @@ export class LogsComponent implements OnInit {
     }
   }
 
+  scrollToBottom(): void {
+    this.logContainer?.nativeElement.scroll({
+      top: this.logContainer.nativeElement.scrollHeight,
+      left: 0,
+      behavior: 'auto'
+    });
+  }
+
 }

From ee04a9226b9812415a0b0c43908062e94b4607bc Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Tue, 16 Mar 2021 03:06:20 -0700
Subject: [PATCH 7/8] =?UTF-8?q?Don=E2=80=99t=20remove=20OnInit?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src-ui/src/app/components/manage/logs/logs.component.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.ts b/src-ui/src/app/components/manage/logs/logs.component.ts
index fd99abc2a..54f8294c9 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.ts
+++ b/src-ui/src/app/components/manage/logs/logs.component.ts
@@ -1,4 +1,4 @@
-import { Component, ElementRef, AfterViewChecked, ViewChild } from '@angular/core';
+import { Component, ElementRef, OnInit, AfterViewChecked, ViewChild } from '@angular/core';
 import { LogService } from 'src/app/services/rest/log.service';
 
 @Component({
@@ -6,7 +6,7 @@ import { LogService } from 'src/app/services/rest/log.service';
   templateUrl: './logs.component.html',
   styleUrls: ['./logs.component.scss']
 })
-export class LogsComponent implements AfterViewChecked {
+export class LogsComponent implements OnInit, AfterViewChecked {
 
   constructor(private logService: LogService) { }
 

From 816871eed30b28bd838dc7f3eacb3ac7ed668bc6 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Tue, 16 Mar 2021 03:08:48 -0700
Subject: [PATCH 8/8] Redundant call to scroll

---
 src-ui/src/app/components/manage/logs/logs.component.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src-ui/src/app/components/manage/logs/logs.component.ts b/src-ui/src/app/components/manage/logs/logs.component.ts
index 54f8294c9..26ceb5c57 100644
--- a/src-ui/src/app/components/manage/logs/logs.component.ts
+++ b/src-ui/src/app/components/manage/logs/logs.component.ts
@@ -35,7 +35,6 @@ export class LogsComponent implements OnInit, AfterViewChecked {
   reloadLogs() {
     this.logService.get(this.activeLog).subscribe(result => {
       this.logs = result
-      this.scrollToBottom()
     }, error => {
       this.logs = []
     })