import { Component, inject, TemplateRef, ViewChild } from '@angular/core';
import { CommonModule } from '@angular/common';
import { NgbModal, NgbModalModule } from '@ng-bootstrap/ng-bootstrap';
import { PageTitle } from '@app/components/page-title/page-title';
import { TransactionsList } from './list/list';
import { TransactionDetails } from './details/details';
import { NgIcon } from '@ng-icons/core';

@Component({
  selector: 'app-transactions',
  standalone: true,
  imports: [
    CommonModule,
    NgbModalModule,
    PageTitle,
    NgIcon,
    TransactionsList,
    TransactionDetails
  ],
  templateUrl: './transactions.html',
})
export class Transactions {
  private modalService = inject(NgbModal);

  activeView: 'list' | 'details' = 'list';
  selectedTransactionId: string | null = null;

  showListView() {
    this.activeView = 'list';
    this.selectedTransactionId = null;
  }

  showDetailsView(transactionId: string) {
    this.activeView = 'details';
    this.selectedTransactionId = transactionId;
  }

  // Gestion des modals
  openModal(content: TemplateRef<any>, size: 'sm' | 'lg' | 'xl' = 'lg') {
    this.modalService.open(content, { 
      size: size,
      centered: true,
      scrollable: true 
    });
  }

  @ViewChild('refundModal') refundModal!: TemplateRef<any>;
}