From 875905eb20a90dbd4712a422077e9b4f50bca4c5 Mon Sep 17 00:00:00 2001
From: Subhajit Ghosh <subhajitstd07@gmail.com>
Date: Thu, 5 Oct 2023 16:03:56 +0000
Subject: [PATCH] Created carousel component for testimonials

---
 apps/client/src/app/pages/landing/landing-page.html      | 5 ++---
 apps/client/src/app/pages/landing/landing-page.module.ts | 4 +++-
 libs/ui/src/lib/carousel/carousel-item.directive.ts      | 7 ++-----
 libs/ui/src/lib/carousel/carousel.ts                     | 4 ----
 4 files changed, 7 insertions(+), 13 deletions(-)

diff --git a/apps/client/src/app/pages/landing/landing-page.html b/apps/client/src/app/pages/landing/landing-page.html
index bdb2aca88..bdda5d5b6 100644
--- a/apps/client/src/app/pages/landing/landing-page.html
+++ b/apps/client/src/app/pages/landing/landing-page.html
@@ -347,13 +347,12 @@
       </div>
     </div> -->
     <gf-carousel [aria-label]="'Featured components'">
-      <a *ngFor="let comp of getTopComponents()" carousel-item>
+      <div *ngFor="let testimonial of testimonials" carousel-item>
         <gf-logo
             class="mr-3 mt-2 pt-1"
             size="medium"
             [showLabel]="false"
         ></gf-logo>
-        {{(comp[0].toUpperCase() + comp.slice(1)).replace('-', ' ')}}
         <div class="mt-2 text-muted">
           —
           <a *ngIf="testimonial.url" target="_blank" [href]="testimonial.url"
@@ -362,7 +361,7 @@
           <span *ngIf="!testimonial.url">{{ testimonial.author }}</span>, {{
           testimonial.country }}
         </div>
-      </a>
+      </div>
     </gf-carousel>
   </div>
 
diff --git a/apps/client/src/app/pages/landing/landing-page.module.ts b/apps/client/src/app/pages/landing/landing-page.module.ts
index 9a3f02cce..6bc321349 100644
--- a/apps/client/src/app/pages/landing/landing-page.module.ts
+++ b/apps/client/src/app/pages/landing/landing-page.module.ts
@@ -6,12 +6,14 @@ import { RouterModule } from '@angular/router';
 import { GfWorldMapChartModule } from '@ghostfolio/client/components/world-map-chart/world-map-chart.module';
 import { GfLogoModule } from '@ghostfolio/ui/logo';
 import { GfValueModule } from '@ghostfolio/ui/value';
+import { CarouselItem } from '@ghostfolio/ui/carousel/carousel-item.directive';
+import { Carousel } from '@ghostfolio/ui/carousel/carousel';
 
 import { LandingPageRoutingModule } from './landing-page-routing.module';
 import { LandingPageComponent } from './landing-page.component';
 
 @NgModule({
-  declarations: [LandingPageComponent],
+  declarations: [Carousel, CarouselItem, LandingPageComponent],
   imports: [
     CommonModule,
     GfLogoModule,
diff --git a/libs/ui/src/lib/carousel/carousel-item.directive.ts b/libs/ui/src/lib/carousel/carousel-item.directive.ts
index 2384cf566..f137c5bf7 100644
--- a/libs/ui/src/lib/carousel/carousel-item.directive.ts
+++ b/libs/ui/src/lib/carousel/carousel-item.directive.ts
@@ -1,10 +1,7 @@
 import { FocusableOption } from "@angular/cdk/a11y";
-import { Directive, ElementRef, HostBinding } from "@angular/core";
+import { ElementRef, HostBinding } from "@angular/core";
+
 
-@Directive({
-    selector: '[carousel-item]',
-    standalone: true,
-  })
   export class CarouselItem implements FocusableOption {
     @HostBinding('attr.role') readonly role = 'listitem';
     @HostBinding('tabindex') tabindex = '-1';
diff --git a/libs/ui/src/lib/carousel/carousel.ts b/libs/ui/src/lib/carousel/carousel.ts
index ac6da9067..400ed7a5a 100644
--- a/libs/ui/src/lib/carousel/carousel.ts
+++ b/libs/ui/src/lib/carousel/carousel.ts
@@ -22,10 +22,6 @@ import { CarouselItem } from './carousel-item.directive';
   
   @Component({
     selector: 'gf-carousel',
-    templateUrl: './carousel.html',
-    styleUrls: ['./carousel.scss'],
-    encapsulation: ViewEncapsulation.None,
-    standalone: true,
     imports: [
       NgIf,
       MatButtonModule,