import { Component, OnInit, signal } from '@angular/core';
import { Expense, ExpenseService } from '../../services/expense.service';
import { ExpenseComponent } from '../expense/expense.component';
import { Category, CategoryService } from '../../services/category.service';
import { SubCategory, SubCategoryService } from '../../services/sub-category.service';
import { Merchant, MerchantService } from '../../services/merchant.service';
import { Tag, TagService } from '../../services/tag.service';

@Component({
  selector: 'app-expense-list',
  imports: [
    ExpenseComponent
  ],
  templateUrl: './expense-list.component.html',
  styleUrl: './expense-list.component.scss',
})
export class ExpenseListComponent implements OnInit {
  protected expenses = signal<Expense[]>([]);
  protected categories = signal<Category[]>([]);
  protected subCategories = signal<SubCategory[]>([]);
  protected merchants = signal<Merchant[]>([]);
  protected tags = signal<Tag[]>([]);

  public constructor(private readonly expensesService: ExpenseService,
                     private readonly categoryService: CategoryService,
                     private readonly subCategoryService: SubCategoryService,
                     private readonly merchantService: MerchantService,
                     private readonly tagService: TagService) { }

  public ngOnInit() {
    // this.expensesService.getExpenses().then(expenses => {
    //   console.log({ expenses }); // TODO: remove me
    //   this.expenses.set(expenses);
    // });

    Promise.all([
      this.expensesService.getExpenses(),
      this.categoryService.getCategories(),
      this.subCategoryService.getSubCategories(),
      this.merchantService.getMerchants(),
      this.tagService.getTags()
    ]).then(([expenses, categories, subCategories, merchants, tags]) => {
      console.log({ expenses, categories, subCategories, merchants, tags }); // TODO: Remove me
      this.expenses.set(expenses);
      this.categories.set(categories);
      this.subCategories.set(subCategories);
      this.merchants.set(merchants);
      this.tags.set(tags);
    })
  }
}