import {Component, inject, OnInit, signal} from '@angular/core';
import {FormsModule} from '@angular/forms';
import {RouterLink} from '@angular/router';
import {MembershipService, MembershipResponse} from '../../services/membership';
import {ToastService} from '../../services/toast';

@Component({
  selector: 'app-my-memberships',
  standalone: true,
  imports: [FormsModule, RouterLink],
  templateUrl: './my-memberships.html'
})
export class MyMembershipsComponent implements OnInit {
  private membershipService = inject(MembershipService);
  private toastService = inject(ToastService);

  memberships = signal<MembershipResponse[]>([]);
  isLoading = signal(true);
  filterStatus = signal<string>('ALL');

  ngOnInit() {
    this.loadMemberships();
  }

  loadMemberships() {
    this.membershipService.getOwnMemberships().subscribe({
      next: memberships => {
        this.memberships.set(memberships);
        this.isLoading.set(false);
      },
      error: () => {
        this.isLoading.set(false);
        this.toastService.error('Fehler beim Laden der Mitgliedschaften.');
      }
    });
  }

  get filteredMemberships(): MembershipResponse[] {
    if (this.filterStatus() === 'ALL') {
      return this.memberships();
    }
    return this.memberships().filter(m => m.status === this.filterStatus());
  }

  getStatusClass(status: string): string {
    switch (status) {
      case 'ACTIVE': return 'bg-green-100 text-green-800';
      case 'PENDING': return 'bg-yellow-100 text-yellow-800';
      case 'INACTIVE': return 'bg-gray-100 text-gray-800';
      default: return 'bg-gray-100 text-gray-800';
    }
  }

  getStatusLabel(status: string): string {
    switch (status) {
      case 'ACTIVE': return 'Aktiv';
      case 'PENDING': return 'Wartend';
      case 'INACTIVE': return 'Inaktiv';
      default: return status;
    }
  }
}