import { CommonModule } from '@angular/common';
import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
import { ActivatedRoute, RouterModule, Router } from '@angular/router';
import { ZardCardComponent } from '@shared/components/card/card.component';
import { ZardButtonComponent } from '@shared/components/button/button.component';
import { Gain } from 'src/app/core/services/gain';
import { ResultatCagnotte } from 'src/app/core/interfaces/gain';

@Component({
  standalone: true,
  selector: 'app-gain-details',
  templateUrl: './gain-details.html',
  styleUrl: './gain-details.css',
  changeDetection: ChangeDetectionStrategy.OnPush,
  imports: [CommonModule, RouterModule, ZardCardComponent, ZardButtonComponent],
})
export class GainDetails {
  detail = signal<ResultatCagnotte | undefined>(undefined);

  constructor(private route: ActivatedRoute, private api: Gain, private router: Router) {
    const id = this.route.snapshot.params['id'];
    if (!id) {
      // nothing to show, go back
      this.router.navigate(['/gains']);
      return;
    }

    this.api.getById(String(id)).subscribe((d) => {
      console.log(d);
      this.detail.set(d);
    });
  }

  goBack() {
    this.router.navigate(['/gains']);
  }
}
