import { Component, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { ButtonsModule } from '@progress/kendo-angular-buttons';
import { InputsModule } from '@progress/kendo-angular-inputs';
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
import { SettingsApiService } from '../../services/settings-api.service';
import { SiteSettingDto } from '../../models/settings.model';

@Component({
  selector: 'app-site-settings-tab',
  standalone: true,
  imports: [CommonModule, FormsModule, ButtonsModule, InputsModule, DropDownsModule],
  templateUrl: './site-settings-tab.component.html',
})
export class SiteSettingsTabComponent implements OnInit {
  model: SiteSettingDto | null = null;
  saving = false;
  savedMsg = '';

  readonly languages = [
    { text: 'English', value: 'en' },
    { text: '中文 Chinese', value: 'zh' },
  ];

  constructor(private api: SettingsApiService) {}

  ngOnInit(): void {
    this.api.getSite().subscribe(s => (this.model = s));
  }

  save(): void {
    if (!this.model || this.saving) return;
    this.saving = true;
    this.savedMsg = '';
    this.api.updateSite(this.model).subscribe({
      next: () => { this.saving = false; this.savedMsg = 'Saved / 已儲存'; },
      // Errors surface globally via httpErrorInterceptor.
      error: () => { this.saving = false; },
    });
  }
}
