import { Component, effect, inject } from '@angular/core'
import { NonNullableFormBuilder, ReactiveFormsModule, Validators } from '@angular/forms'
import { RouterLink } from '@angular/router'
import { EmailSettings } from '@api-client/angular'
import { LoadingButtonDirective } from '@frontend/shared'
import { TranslocoDirective } from '@jsverse/transloco'
import { LucideChevronLeft } from '@lucide/angular'
import { UntilDestroy } from '@ngneat/until-destroy'
import { SettingsStore } from '../../../+state'

@UntilDestroy({ checkProperties: true })
@Component({
	selector: 'kadi-email-settings',
	templateUrl: './email-settings.component.html',
	imports: [TranslocoDirective, RouterLink, ReactiveFormsModule, LoadingButtonDirective, LucideChevronLeft],
})
export class EmailSettingsComponent {
	protected readonly _settingsStore = inject(SettingsStore)
	private readonly _formBuilder = inject(NonNullableFormBuilder)

	settings: EmailSettings | undefined

	readonly form = this._formBuilder.group({
		feedbackContent: this._formBuilder.control('', Validators.required),
	})

	constructor() {
		effect(() => {
			const email = this._settingsStore.settings()?.email
			if (email) this.form.patchValue(email)
		})
	}

	async save() {
		if (this.form.invalid) return

		const email = this.form.getRawValue()

		await this._settingsStore.updateSettings({ email })

		this.form.markAsPristine()
	}
}