Fix: resolve cpu usage due to incorrect interval use (#8884)

src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts

@@ -13,6 +13,7 @@ import {
   NgbTooltipModule,
 } from '@ng-bootstrap/ng-bootstrap'
 import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
+import { delay, of } from 'rxjs'
 import {
   DEFAULT_DISPLAY_FIELDS,
   DisplayField,
@@ -104,9 +105,11 @@ export class DocumentCardLargeComponent
   popoverHidden = true
 
   ngAfterViewInit(): void {
-    setInterval(() => {
-      this.show = true
-    }, 100)
+    of(true)
+      .pipe(delay(50))
+      .subscribe(() => {
+        this.show = true
+      })
   }
 
   get searchScoreClass() {

src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts

@@ -13,7 +13,8 @@ import {
   NgbTooltipModule,
 } from '@ng-bootstrap/ng-bootstrap'
 import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
-import { map } from 'rxjs/operators'
+import { of } from 'rxjs'
+import { delay, map } from 'rxjs/operators'
 import {
   DEFAULT_DISPLAY_FIELDS,
   DisplayField,
@@ -97,9 +98,11 @@ export class DocumentCardSmallComponent
   @ViewChild('popupPreview') popupPreview: PreviewPopupComponent
 
   ngAfterViewInit(): void {
-    setInterval(() => {
-      this.show = true
-    }, 50)
+    of(true)
+      .pipe(delay(50))
+      .subscribe(() => {
+        this.show = true
+      })
   }
 
   getIsThumbInverted() {