import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { 
  IonHeader, 
  IonToolbar, 
  IonTitle, 
  IonContent,
  IonCard,
  IonCardContent,
  IonCardHeader,
  IonCardTitle,
  IonGrid,
  IonRow,
  IonCol,
  IonIcon,
  IonItem,
  IonLabel,
  IonBadge,
  IonProgressBar,
  IonSearchbar
} from '@ionic/angular/standalone';
import { NgIf } from '@angular/common';
import { addIcons } from 'ionicons';
import { 
  search,
  book,
  create,
  calendar,
  chatbubbles
} from 'ionicons/icons';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss'],
  standalone: true,
  imports: [
    IonHeader, 
    IonToolbar, 
    IonTitle, 
    IonContent,
    IonCard,
    IonCardContent,
    IonCardHeader,
    IonCardTitle,
    IonGrid,
    IonRow,
    IonCol,
    IonIcon,
    IonItem,
    IonLabel,
    IonBadge,
    IonProgressBar,
    IonSearchbar,
    NgIf
  ]
})
export class Tab1Page implements OnInit {
  dailyProgress: number = 0.65;
  completedTasks: number = 13;
  totalTasks: number = 20;

  constructor(private router: Router) {
    addIcons({ 
      search,
      book,
      create,
      calendar,
      chatbubbles
    });
  }

  ngOnInit() {
  }

  onCardClick(feature: string) {
    console.log(`Navigating to ${feature}`);
    // this.router.navigate([`/tabs/tab1/${feature}`]);
  }
} 