import { Component, computed, signal } from '@angular/core';
import { IconModule } from '../../../icon/icon.module';
import { MaterialModule } from '../../../material.module';
import { ImageSliderComponent } from '../image-slider/image-slider.component';
import { FooterComponent } from '../footer/footer.component';
//import { PagePricingComponent } from '../page-pricing/page-pricing.component';
import {
  setupCards,
  stats,
  users,
} from '../front-pagesData';
import { CommonModule } from '@angular/common';

@Component({
  selector: 'app-about-us',
  imports: [IconModule,MaterialModule ,CommonModule,ImageSliderComponent,FooterComponent,
    //PagePricingComponent
  ],
  templateUrl: './about-us.component.html',
  styleUrl: './about-us.component.scss'
})
export class AboutUsComponent {
  setupCards=setupCards;
  stats = stats;
    currentIndex = signal(0); // Starting from 0
    users = users;
   // Computed values to auto-update template
   currentUser = computed(() => this.users[this.currentIndex()]);
   displayCount = computed(
     () => `${this.currentIndex() + 1}/${this.users.length}`
   ); 
    goPrev() {
       if (this.currentIndex() > 0) {
         this.currentIndex.update((i) => i - 1);
       }
     }
   
     goNext() {
       if (this.currentIndex() < this.users.length - 1) {
         this.currentIndex.update((i) => i + 1);
       }
 
 
      }


     
}