fix(toasters): toast.index is a signal

Author: xidedix

Diff for: src/app/views/notifications/toasters/toast-simple/toast-sample-icon.component.ts

@@ -1,14 +1,9 @@
-import { Component, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
 
 @Component({
   selector: 'toast-sample-icon',
   templateUrl: './toast-sample-icon.component.svg',
+  standalone: true
 })
-export class ToastSampleIconComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
+export class ToastSampleIconComponent {
 }

Diff for: src/app/views/notifications/toasters/toast-simple/toast.component.html

@@ -7,7 +7,7 @@
     <strong>{{ title }}</strong>
   </c-toast-header>
   <c-toast-body #toastBody [cToastClose]="toastBody.toast">
-    <p class="mb-1">This is a dynamic toast no {{ toastBody.toast?.index }} {{ toastBody.toast?.clock }}</p>
+    <p class="mb-1">This is a dynamic toast no {{ toastBody.toast?.index() }} {{ toastBody.toast?.clock }}</p>
     <ng-content />
     <c-progress thin [value]="25*(toastBody.toast?.clock ?? 1)" />
   </c-toast-body>

Diff for: src/app/views/notifications/toasters/toasters.component.html

@@ -75,7 +75,7 @@ <h5>Add toast with following props:</h5>
                 </c-toast>
                 <app-toast-simple #toast [autohide]="false" [fade]="true" [visible]="true" [title]="'App Toast'"
                                   color="secondary">
-                  This is a toast in static positioned App toaster! {{ toast.index }}
+                  This is a toast in static positioned App toaster! {{ toast.index() }}
                 </app-toast-simple>
               </c-toaster>
             </c-col>