import { ChangeDetectionStrategy, Component, computed, input, signal } from '@angular/core';
import { DatePipe } from '@angular/common';
import { injectMutation } from '@tanstack/angular-query-experimental';
import { ScannedUser, UserData } from '@/core/models/auth.models';
import { UnixTimePipe } from '@/core/pipes/unix-time.pipe';
import { injectUIService } from '@/core/services/ui.service';
import { injectUserService } from '@/core/services/user.service';
import { ButtonDirective } from '@/shared/ui/button.directive';
import { ModalComponent } from '@/shared/ui/modal/modal.component';
import { CodeInputComponent } from '../code-input/code-input.component';
import { ScannerComponent } from '../scanner/scanner.component';

@Component({
	selector: 'app-user-scan',
	templateUrl: './user-scan.component.html',
	styleUrls: ['./user-scan.component.scss'],
	changeDetection: ChangeDetectionStrategy.OnPush,
	standalone: true,
	imports: [ScannerComponent, ModalComponent, UnixTimePipe, ButtonDirective, CodeInputComponent],
	providers: [DatePipe],
})
export class UserScanComponent {
	private userService = injectUserService();
	private uiServ = injectUIService();

	user = input.required<UserData>();

	openScanner = signal(false);
	openCodeInput = signal(false);

	scannedUser = signal<ScannedUser | null>(null);
	openWelcome = computed(() => !!this.scannedUser());
	loadingScan = computed(() => this.scanUserQR.isPending());
	scanUserQR = injectMutation(() => ({
		mutationFn: (code: string) => {
			this.openScanner.set(false);
			this.openCodeInput.set(false);
			return this.userService.scanUserCode(code);
		},
		onError: (error) => this.uiServ.showErrorAlert(error.message),
		onSuccess: (user) => this.scannedUser.set(user),
	}));

	rescan() {
		this.scannedUser.set(null);
		this.openScanner.set(true);
	}
	reenter() {
		this.scannedUser.set(null);
		this.openCodeInput.set(true);
	}
}