import { ChangeDetectionStrategy, Component, computed, inject } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ProjectEditorFacade } from '../facade/project-editor.facade';
import { TranslatePipe } from '../../../i18n/translate.pipe';
import { InputComponent } from '../../../shared/ui/input/input.component';
import { FormFieldComponent } from '../../../shared/ui/form-field/form-field.component';
import { SectionCardComponent } from '../../../shared/ui/section-card/section-card.component';

@Component({
  selector: 'app-project-editor-general-section',
  standalone: true,
  imports: [FormsModule, TranslatePipe, InputComponent, FormFieldComponent, SectionCardComponent],
  templateUrl: './general-section.component.html',
  styleUrls: ['./section.shared.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class ProjectEditorGeneralSectionComponent {
  private readonly facade = inject(ProjectEditorFacade);
  readonly bootstrap = this.facade.bootstrap;
  readonly languagesValue = computed(() => (this.bootstrap()?.localization.supportedLocales ?? []).join(', '));

  updateMarketplaceName(value: string): void {
    this.facade.updateBootstrap(current => ({
      ...current,
      branding: { ...current.branding, brandName: value },
      tenant: { ...current.tenant, name: value }
    }));
  }

  updateDomain(value: string): void {
    this.facade.updateBootstrap(current => ({
      ...current,
      tenant: { ...current.tenant, host: value, websiteBaseUrl: `https://${value}` }
    }));
  }

  updateDescription(value: string): void {
    this.facade.updateBootstrap(current => ({
      ...current,
      seo: {
        ...current.seo,
        default: {
          ...current.seo.default,
          description: value
        }
      }
    }));
  }

  updateDefaultLanguage(value: string): void {
    this.facade.updateBootstrap(current => ({
      ...current,
      tenant: { ...current.tenant, defaultLocale: value },
      localization: { ...current.localization, defaultLocale: value }
    }));
  }

  updateSupportedLanguages(value: string): void {
    const locales = value.split(',').map(item => item.trim()).filter(Boolean);
    this.facade.updateBootstrap(current => ({
      ...current,
      tenant: { ...current.tenant, supportedLocales: locales },
      localization: { ...current.localization, supportedLocales: locales }
    }));
  }
}