import { Component, computed, inject, input, OnInit } from '@angular/core';
import { Router, RouterLink } from '@angular/router';
import { UntilDestroy } from '@ngneat/until-destroy';
import { environment } from '@env/environment';
import { ProfileViewModel } from '@app/adapters/profiles/profile.presenter.model';
import { UserFacade } from '@app/adapters/users/user.facade';

@Component({
  selector: 'app-vertical-profile-item',
  standalone: true,
  providers: [UserFacade],
  imports: [RouterLink],
  templateUrl: './vertical-profile-item.component.html',
  styleUrl: './vertical-profile-item.component.scss',
})
@UntilDestroy()
export class VerticalProfileItemComponent implements OnInit {
  profile = input.required<ProfileViewModel>();
  protected readonly router = inject(Router);
  private readonly facade = inject(UserFacade);
  protected readonly environment = environment;

  protected user = this.facade.user;
  protected readonly loading = this.facade.loading;
  protected readonly error = this.facade.error;

  protected slug = computed(() => {
    const slug = this.user().slug ?? '';
    const profileId = this.profile().id ? this.profile().id : '';
    return slug === '' ? profileId : slug.concat('-', profileId);
  });

  ngOnInit(): void {
    if (this.profile()) {
      this.facade.loadOne(this.profile().utilisateur);
    }
  }
}
