chore(demo): documentation page Tooltip has infinite SSR

taiga-family · Mar 26, 2024 · 34e81be · 34e81be
1 parent 9dba6d8
commit 34e81be
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 20 deletions.
diff --git a/projects/demo/src/modules/components/tooltip/examples/1/index.html b/projects/demo/src/modules/components/tooltip/examples/1/index.html
@@ -22,11 +22,12 @@
 
 <ng-template #tooltip>
     <tui-loader
+        *tuiLet="(isLoading$ | async)! as isLoading"
         size="s"
         class="tooltip"
         [inheritColor]="true"
-        [showLoader]="loader"
+        [showLoader]="isLoading"
     >
-        {{ text }}
+        {{ this.isLoading ? '' : 'Error 502: Bad Gateway' }}
     </tui-loader>
 </ng-template>
diff --git a/projects/demo/src/modules/components/tooltip/examples/1/index.ts b/projects/demo/src/modules/components/tooltip/examples/1/index.ts
@@ -1,8 +1,8 @@
-import {ChangeDetectorRef, Component, inject} from '@angular/core';
+import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
-import {TuiDestroyService, tuiWatch} from '@taiga-ui/cdk';
-import {interval, takeUntil} from 'rxjs';
+import {TuiDestroyService} from '@taiga-ui/cdk';
+import {interval, map, startWith} from 'rxjs';
 
 @Component({
     selector: 'tui-tooltip-example-1',
@@ -13,19 +13,8 @@ import {interval, takeUntil} from 'rxjs';
     providers: [TuiDestroyService],
 })
 export class TuiTooltipExample1 {
-    protected loader = true;
-
-    protected text = '';
-
-    constructor() {
-        interval(2000)
-            .pipe(
-                tuiWatch(inject(ChangeDetectorRef)),
-                takeUntil(inject(TuiDestroyService, {self: true})),
-            )
-            .subscribe(() => {
-                this.loader = !this.loader;
-                this.text = this.text ? '' : 'Error 502: Bad Gateway';
-            });
-    }
+    protected isLoading$ = interval(2000).pipe(
+        map(i => Boolean(i % 2)),
+        startWith(true),
+    );
 }
diff --git a/projects/demo/src/modules/components/tooltip/tooltip.module.ts b/projects/demo/src/modules/components/tooltip/tooltip.module.ts
@@ -3,6 +3,7 @@ import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
 import {RouterModule} from '@angular/router';
 import {TuiAddonDocModule, tuiGenerateRoutes} from '@taiga-ui/addon-doc';
+import {TuiLetModule} from '@taiga-ui/cdk';
 import {
     TuiAutoColorPipe,
     TuiHintModule,
@@ -37,6 +38,7 @@ import {ExampleTuiTooltipComponent} from './tooltip.component';
         TuiTextfieldControllerModule,
         RouterModule.forChild(tuiGenerateRoutes(ExampleTuiTooltipComponent)),
         TuiAutoColorPipe,
+        TuiLetModule,
     ],
     declarations: [
         ExampleTuiTooltipComponent,