diff --git a/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.html b/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.html
index 08b75095c60..2bb3ece19fa 100644
--- a/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.html
+++ b/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.html
@@ -15,25 +15,28 @@ <h3>{{ 'App' | translate }}</h3>
         [job]="job() | async"
       ></ix-app-card-info>
 
-      <ix-app-cpu-info
-        class="square"
-        [stats]="stats() | async"
-      ></ix-app-cpu-info>
-
-      <ix-app-network-info
-        class="rectangle"
-        [stats]="stats() | async"
-      ></ix-app-network-info>
-
-      <ix-app-memory-info
-        class="square"
-        [stats]="stats() | async"
-      ></ix-app-memory-info>
-
-      <ix-app-disk-info
-        class="rectangle"
-        [stats]="stats() | async"
-      ></ix-app-disk-info>
+      @if (stats$) {
+        <ix-app-cpu-info
+          class="square"
+          [stats]="stats$ | async"
+        ></ix-app-cpu-info>
+
+        <ix-app-network-info
+          class="rectangle"
+          [stats]="stats$ | async"
+        ></ix-app-network-info>
+
+        <ix-app-memory-info
+          class="square"
+          [stats]="stats$ | async"
+        ></ix-app-memory-info>
+
+        <ix-app-disk-info
+          class="rectangle"
+          [stats]="stats$ | async"
+        ></ix-app-disk-info>
+      }
+
     </div>
   </mat-card-content>
 </mat-card>
diff --git a/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.spec.ts b/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.spec.ts
index 28f3832e271..197c91bc752 100644
--- a/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.spec.ts
+++ b/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.spec.ts
@@ -1,3 +1,4 @@
+import { fakeAsync } from '@angular/core/testing';
 import { createComponentFactory, mockProvider, Spectator } from '@ngneat/spectator/jest';
 import { MockComponents } from 'ng-mocks';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
@@ -67,7 +68,7 @@ describe('WidgetAppComponent', () => {
       mockProvider(WidgetResourcesService, {
         serverTime$: of(new Date()),
         getApp: () => of(app),
-        getAppStats: () => of(),
+        getAppStats: () => of({}),
         getAppStatusUpdates: () => of(),
       }),
       mockProvider(RedirectService, {
@@ -99,7 +100,8 @@ describe('WidgetAppComponent', () => {
     });
   });
 
-  it('checks components', () => {
+  it('checks components', fakeAsync(() => {
+    spectator.detectChanges();
     expect(spectator.query(AppControlsComponent)).toBeTruthy();
     expect(spectator.query(AppCardLogoComponent)).toBeTruthy();
     expect(spectator.query(AppCardInfoComponent)).toBeTruthy();
@@ -107,5 +109,5 @@ describe('WidgetAppComponent', () => {
     expect(spectator.query(AppMemoryInfoComponent)).toBeTruthy();
     expect(spectator.query(AppNetworkInfoComponent)).toBeTruthy();
     expect(spectator.query(AppDiskInfoComponent)).toBeTruthy();
-  });
+  }));
 });
diff --git a/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.ts b/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.ts
index 62c5217d54d..da7fe4a616c 100644
--- a/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.ts
+++ b/src/app/pages/dashboard/widgets/apps/widget-app/widget-app.component.ts
@@ -2,9 +2,14 @@ import { AsyncPipe } from '@angular/common';
 import {
   Component, ChangeDetectionStrategy, input,
   computed,
+  effect,
+  ChangeDetectorRef,
 } from '@angular/core';
 import { MatCard, MatCardContent } from '@angular/material/card';
 import { TranslateModule } from '@ngx-translate/core';
+import { Observable } from 'rxjs';
+import { LoadingState } from 'app/helpers/operators/to-loading-state.helper';
+import { AppStats } from 'app/interfaces/app.interface';
 import { WithLoadingStateDirective } from 'app/modules/loader/directives/with-loading-state/with-loading-state.directive';
 import { AppCardLogoComponent } from 'app/pages/apps/components/app-card-logo/app-card-logo.component';
 import { WidgetResourcesService } from 'app/pages/dashboard/services/widget-resources.service';
@@ -43,10 +48,18 @@ export class WidgetAppComponent implements WidgetComponent<WidgetAppSettings> {
   size = input.required<SlotSize>();
   settings = input.required<WidgetAppSettings>();
 
-  appName = computed(() => this.settings().appName);
-  app = computed(() => this.resources.getApp(this.appName()));
-  job = computed(() => this.resources.getAppStatusUpdates(this.appName()));
-  stats = computed(() => this.resources.getAppStats(this.appName()));
+  protected appName = computed(() => this.settings().appName);
+  protected app = computed(() => this.resources.getApp(this.appName()));
+  protected job = computed(() => this.resources.getAppStatusUpdates(this.appName()));
+  protected stats$: Observable<LoadingState<AppStats>>;
 
-  constructor(private resources: WidgetResourcesService) {}
+  effect = effect(() => {
+    this.stats$ = this.resources.getAppStats(this.appName());
+    this.cdr.markForCheck();
+  });
+
+  constructor(
+    private resources: WidgetResourcesService,
+    private cdr: ChangeDetectorRef,
+  ) {}
 }