diff --git a/ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.html b/ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.html
index d0905d968d..bdaf2de487 100644
--- a/ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.html
+++ b/ui-ngx/src/app/modules/home/components/debug-config/debug-config-button.component.html
@@ -26,7 +26,9 @@
   <mat-icon [color]="disabled ? 'inherit' : 'primary'">bug_report</mat-icon>
   <span *ngIf="!debugFailures && !(isDebugAllActive$ | async)" translate>common.disabled</span>
   <span *ngIf="(isDebugAllActive$ | async) && debugFailures" translate>debug-config.all</span>
-  <span *ngIf="(isDebugAllActive$ | async) && !debugFailures">{{ debugAllUntil | durationLeft }}</span>
+  <span *ngIf="(isDebugAllActive$ | async) && !debugFailures">
+    {{ !debugAll ? (debugAllUntil | durationLeft) : ('debug-config.min' | translate: { number:  maxDebugModeDurationMinutes }) }}
+  </span>
   <span *ngIf="!(isDebugAllActive$ | async) && debugFailures" translate>debug-config.failures</span>
 </button>
 <ng-template #minifiedButton>
diff --git a/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.html b/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.html
index 2e3eb94648..379ad579eb 100644
--- a/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.html
+++ b/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.html
@@ -34,10 +34,10 @@
     <div class="flex justify-between align-center">
       <mat-slide-toggle class="mat-slide" [formControl]="debugAllControl">
         <div tb-hint-tooltip-icon="{{ 'debug-config.hint.all-messages' | translate }}">
-          {{ 'debug-config.all-messages' | translate: { time: (isDebugAllActive$ | async) ? (debugAllUntil | durationLeft) : ('debug-config.min' | translate: { number:  maxDebugModeDurationMinutes }) } }}
+          {{ 'debug-config.all-messages' | translate: { time: (isDebugAllActive$ | async) && !debugAll ? (debugAllUntil | durationLeft) : ('debug-config.min' | translate: { number:  maxDebugModeDurationMinutes }) } }}
         </div>
       </mat-slide-toggle>
-      <button mat-icon-button *ngIf="(isDebugAllActive$ | async)"
+      <button mat-icon-button *ngIf="(isDebugAllActive$ | async) && !debugAll"
               class="tb-mat-20"
               matTooltip="{{ 'action.reset' | translate }}"
               matTooltipPosition="above"
diff --git a/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.ts b/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.ts
index 2593b62e20..80af3bcd87 100644
--- a/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.ts
+++ b/ui-ngx/src/app/modules/home/components/debug-config/debug-config-panel.component.ts
@@ -99,12 +99,14 @@ export class DebugConfigPanelComponent extends PageComponent implements OnInit {
   onReset(): void {
     this.debugAll = true;
     this.debugAllUntil = new Date().getTime() + this.maxDebugModeDurationMinutes * MINUTE;
+    this.cd.markForCheck();
   }
 
   private observeDebugAllChange(): void {
     this.debugAllControl.valueChanges.pipe(takeUntilDestroyed()).subscribe(value => {
       this.debugAllUntil = value? new Date().getTime() + this.maxDebugModeDurationMinutes * MINUTE : 0;
       this.debugAll = value;
+      this.cd.markForCheck();
     });
   }
 }