import { Component, ViewChild } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonContent, IonHeader, IonTitle, IonToolbar, IonRadioGroup, IonItem, IonLabel, IonRadio, IonCheckbox, IonButton, IonIcon, IonRefresher, IonRefresherContent, IonLoading } from '@ionic/angular/standalone';
import { FeedService } from '../../services/feed.service';
import { FeedCardComponent } from '../../components/feed-card/feed-card.component';
import { addIcons } from 'ionicons';
import { rocketOutline } from 'ionicons/icons';

@Component({
  selector: 'app-feed',
  templateUrl: './feed.page.html',
  styleUrls: ['./feed.page.scss'],
  standalone: true,
  imports: [IonContent, IonHeader, IonTitle, IonToolbar, IonRadioGroup, IonItem, IonLabel, IonRadio, IonCheckbox, IonButton, IonIcon, IonRefresher, IonRefresherContent, IonLoading, CommonModule, FormsModule, FeedCardComponent]
})
export class FeedPage {
  @ViewChild(IonContent) content!: IonContent;
  posts: any[] = [];
  isTeam: boolean = false;
  showAll: boolean = false;
  loading: boolean = false;

  constructor(private feedService: FeedService) {
    addIcons({ 'rocket-outline': rocketOutline });
  }

  fetchPosts() {
    this.loading = true;
    this.feedService.fetchPosts(this.isTeam, this.showAll).subscribe({
      next: (posts) => {
        this.posts = posts;
        this.loading = false;
      },
      error: () => {
        this.loading = false;
      }
    });
  }

  doRefresh(event: any) {
    this.feedService.fetchPosts(this.isTeam, this.showAll).subscribe({
      next: (posts) => {
        this.posts = posts;
        event.target.complete();
      },
      error: () => {
        event.target.complete();
      }
    });
  }

  scrollToTop() {
    this.content.scrollToTop(500);
  }
}
