import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss']
})
export class Tab1Page {
  stars: string[] = [];

  constructor(private router: Router) {
    this.resetStars();
  }

  goToUserProfile() {
    this.router.navigate(['/user-profile']);
  }
  rate(index: number) {
    if (this.stars[index] === 'star') {
      this.resetStars();
    } else {
      this.stars.fill('star', 0, index + 1);
      this.stars.fill('star-outline', index + 1);
    }
  }

  resetStars() {
    this.stars = Array(10).fill('star-outline');
  }

  goToCloseFriends() {
    this.router.navigate(['/tabs/tab1/close-friends']);
  }

  goToNewFriends() {
    this.router.navigate(['/tab1/new-friends']);
  }

  goToGroupChat() {
    this.router.navigate(['/tab1/group-chat']);
  }
}