import { DynamicFormConfiguration } from '@allianz/taly-core/schemas';
import { inject, Injectable } from '@angular/core';
import { firstValueFrom } from 'rxjs';
import { NxDialogService, NxModalRef } from '@allianz/ng-aquila/modal';
import { DfDebuggerContext } from '@allianz/taly-core/devtools';
import { DynamicFormEditorComponent } from './dynamic-form-editor.component';
import { DF_EDITOR_SERVER_PORT } from './df-editor-server-port.token';
import { TalyPageDataService } from '@allianz/taly-core';

@Injectable()
export class DynamicFormEditorService {
  private dialogService = inject(NxDialogService);
  private dfEditorServerPort = inject(DF_EDITOR_SERVER_PORT, { optional: true });
  private talyPageDataService = inject(TalyPageDataService);

  async openDynamicFormEditor(
    formConfig: DynamicFormConfiguration,
    context: DfDebuggerContext,
    buildingBlockId?: string,
    pageId?: string
  ): Promise<DynamicFormConfiguration | undefined> {
    const modal = await import('./dynamic-form-editor.component').then(
      (bundle) => bundle.DynamicFormEditorComponent
    );
    // Global sidebar blocks don't belong to a page, so there's no `pageId` to address them by.
    const resolvedPageId =
      context === 'globalSidebar'
        ? undefined
        : pageId ?? (await firstValueFrom(this.talyPageDataService.pageId$));
    const templateDialogRef: NxModalRef<
      DynamicFormEditorComponent,
      DynamicFormConfiguration | undefined
    > = this.dialogService.open(modal, {
      fullscreen: true,
      disableClose: true,
      data: {
        formConfig,
        buildingBlockId,
        pageId: resolvedPageId,
        context,
        dfEditorServerPort: this.dfEditorServerPort
      }
    });

    return firstValueFrom(templateDialogRef.afterClosed());
  }
}