From 648dc709fda24cb6d6030a2504921b1650be7782 Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Tue, 16 Jan 2024 23:00:18 -0800
Subject: [PATCH] Fix: tweak how auto-scrolling of logs works

---
 .../app/components/admin/logs/logs.component.html |  4 ++--
 .../app/components/admin/logs/logs.component.ts   | 15 ++++++++-------
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src-ui/src/app/components/admin/logs/logs.component.html b/src-ui/src/app/components/admin/logs/logs.component.html
index b75f85ae5..9a0a71cd8 100644
--- a/src-ui/src/app/components/admin/logs/logs.component.html
+++ b/src-ui/src/app/components/admin/logs/logs.component.html
@@ -3,8 +3,8 @@
   i18n-title
   info="Review the log files for the application and for email checking."
   i18n-info>
-  <div class="form-check form-switch" (click)="toggleAutoRefresh()">
-    <input class="form-check-input" type="checkbox" role="switch" id="autoRefreshSwitch" [attr.checked]="autoRefreshInterval">
+  <div class="form-check form-switch">
+    <input class="form-check-input" type="checkbox" role="switch" id="autoRefreshSwitch" (click)="toggleAutoRefresh()" [attr.checked]="autoRefreshInterval">
     <label class="form-check-label" for="autoRefreshSwitch" i18n>Auto refresh</label>
   </div>
 </pngx-page-header>
diff --git a/src-ui/src/app/components/admin/logs/logs.component.ts b/src-ui/src/app/components/admin/logs/logs.component.ts
index 0c1231a48..1b2dbef3e 100644
--- a/src-ui/src/app/components/admin/logs/logs.component.ts
+++ b/src-ui/src/app/components/admin/logs/logs.component.ts
@@ -2,9 +2,9 @@ import {
   Component,
   ElementRef,
   OnInit,
-  AfterViewChecked,
   ViewChild,
   OnDestroy,
+  ChangeDetectorRef,
 } from '@angular/core'
 import { Subject, takeUntil } from 'rxjs'
 import { LogService } from 'src/app/services/rest/log.service'
@@ -14,8 +14,11 @@ import { LogService } from 'src/app/services/rest/log.service'
   templateUrl: './logs.component.html',
   styleUrls: ['./logs.component.scss'],
 })
-export class LogsComponent implements OnInit, AfterViewChecked, OnDestroy {
-  constructor(private logService: LogService) {}
+export class LogsComponent implements OnInit, OnDestroy {
+  constructor(
+    private logService: LogService,
+    private changedetectorRef: ChangeDetectorRef
+  ) {}
 
   public logs: string[] = []
 
@@ -47,10 +50,6 @@ export class LogsComponent implements OnInit, AfterViewChecked, OnDestroy {
       })
   }
 
-  ngAfterViewChecked() {
-    this.scrollToBottom()
-  }
-
   ngOnDestroy(): void {
     this.unsubscribeNotifier.next(true)
     this.unsubscribeNotifier.complete()
@@ -66,6 +65,7 @@ export class LogsComponent implements OnInit, AfterViewChecked, OnDestroy {
         next: (result) => {
           this.logs = result
           this.isLoading = false
+          this.scrollToBottom()
         },
         error: () => {
           this.logs = []
@@ -89,6 +89,7 @@ export class LogsComponent implements OnInit, AfterViewChecked, OnDestroy {
   }
 
   scrollToBottom(): void {
+    this.changedetectorRef.detectChanges()
     this.logContainer?.nativeElement.scroll({
       top: this.logContainer.nativeElement.scrollHeight,
       left: 0,