marketplaces/src/app/components/telegram-login/telegram-login.component.ts

import { Component, ChangeDetectionStrategy, inject, effect, OnDestroy } from '@angular/core';
import { AuthService } from '../../services/auth.service';
import { TranslatePipe } from '../../i18n/translate.pipe';
import { QrLoginEngine } from '../../shared/qr-login/qr-login.engine';
import { QrLoginAdapter } from '../../shared/qr-login/qr-login.model';
import { AuthSession } from '../../models/auth.model';

@Component({
  selector: 'app-telegram-login',
  imports: [TranslatePipe],
  templateUrl: './telegram-login.component.html',
  styleUrls: ['./telegram-login.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class TelegramLoginComponent implements OnDestroy {
  private authService = inject(AuthService);

  showDialog = this.authService.showLoginDialog;
  status = this.authService.status;

  private readonly adapter: QrLoginAdapter<AuthSession> = {
    createSession: () => this.authService.createWebSession(),
    checkSessionOnce: webSessionID => this.authService.checkSessionOnce(webSessionID),
    isSessionActive: session => !!session?.active,
    getAppLoginUrl: webSessionID => this.authService.getTelegramAppLoginUrl(webSessionID),
    onLoginComplete: () => this.authService.onTelegramLoginComplete(),
  };

  private readonly engine = new QrLoginEngine<AuthSession>(this.adapter);
  readonly loginUrl = this.engine.loginUrl;
  readonly webSessionID = this.engine.webSessionID;
  readonly qrStatus = this.engine.qrStatus;
  readonly encodedQrUrl = this.engine.encodedQrUrl;
  readonly awaitingTelegramReturn = this.engine.awaitingAppReturn;

  constructor() {
    effect(() => this.engine.setActive(this.showDialog()));
  }

  ngOnDestroy(): void {
    this.engine.destroy();
  }

  close(): void {
    this.engine.setActive(false);
    this.authService.hideLogin();
  }

  openTelegramLogin(): void {
    this.engine.openAppLogin();
  }

  refreshQr(): void {
    this.engine.refresh();
  }
}