<pa-modal-advanced fitContentHeight="">
  <pa-modal-title>
    @if (isEdit) {
      {{ 'retrieval-agents.drivers.edit-modal-title' | translate: { name: config?.name } }}
    } @else {
      {{ (isSyncDriver ? 'retrieval-agents.drivers.add.sync' : 'retrieval-agents.drivers.add.nuclia') | translate }}
    }
  </pa-modal-title>
  <pa-modal-content>
    <form [formGroup]="form">
      <div class="form-entry">
        <label for="name">{{ 'retrieval-agents.drivers.form.driver-name' | translate }}</label>
        <pa-input
          id="name"
          externalLabel
          formControlName="name"></pa-input>
      </div>
      <div class="form-entry">
        <pa-checkbox
          formControlName="custom"
          (change)="resetConnections()">
          {{ 'retrieval-agents.drivers.form.nuclia.custom' | translate }}
        </pa-checkbox>
      </div>
      @if (customConfig) {
        <div class="form-entry">
          <label for="kbid">{{ 'retrieval-agents.drivers.form.nuclia.kbid' | translate }}</label>
          <pa-input
            id="kbid"
            externalLabel
            formControlName="kbid"></pa-input>
        </div>
        <div class="form-entry">
          <label for="url">{{ 'retrieval-agents.drivers.form.nuclia.url' | translate }}</label>
          <pa-input
            id="url"
            externalLabel
            formControlName="url"></pa-input>
        </div>
        <div class="form-entry">
          <label for="manager">{{ 'retrieval-agents.drivers.form.nuclia.manager' | translate }}</label>
          <pa-input
            id="manager"
            externalLabel
            formControlName="manager"></pa-input>
        </div>
        <div class="form-entry">
          <label for="key">{{ 'retrieval-agents.drivers.form.nuclia.key.label' | translate }}</label>
          <pa-input
            id="key"
            formControlName="key"
            externalLabel=""
            [help]="'retrieval-agents.drivers.form.nuclia.key.help' | translate"></pa-input>
        </div>
      } @else {
        <div class="form-entry">
          <label for="kb">{{ 'retrieval-agents.drivers.form.nuclia.kb' | translate }}</label>
          <pa-select
            id="kb"
            externalLabel
            formControlName="kbid"
            (valueChange)="form.value.kbid === $event ? null : resetConnections()">
            @for (kb of kbList; track kb.id) {
              <pa-option
                [value]="kb.id"
                (selectOption)="checkFormValidators(kb.role_on_kb)">
                {{ kb.title }}
              </pa-option>
            }
          </pa-select>
        </div>
        @if (isSyncDriver) {
          @if (kb && !loadingSyncs() && (syncConfigs | async)?.length === 0) {
            <nsi-info-card
              type="warning"
              icon="warning">
              {{ 'retrieval-agents.drivers.form.nuclia.connections.empty' | translate }}
            </nsi-info-card>
          }
        }
        @if (isEdit) {
          <pa-toggle
            formControlName="keepExistingKey"
            withBackground>
            {{ 'retrieval-agents.drivers.form.nuclia.keep-existing-key' | translate }}
          </pa-toggle>
        }
        @if (kb && kb.role_on_kb !== 'SOWNER') {
          <div class="form-entry">
            <label for="key">{{ 'retrieval-agents.drivers.form.nuclia.key.label' | translate }}</label>
            <pa-input
              id="key"
              formControlName="key"
              externalLabel=""
              [help]="'retrieval-agents.drivers.form.nuclia.key.help' | translate"></pa-input>
          </div>
        } @else if (kb && !keepExistingKey) {
          <nsi-info-card icon="info">
            {{ 'retrieval-agents.drivers.form.nuclia.key.owner-info' | translate }}
          </nsi-info-card>
        }
      }

      <div class="form-entry">
        <label for="description">{{ 'retrieval-agents.drivers.form.nuclia.description.label' | translate }}</label>
        <pa-textarea
          id="description"
          formControlName="description"
          externalLabel=""
          rows="2"
          resizable=""
          [help]="'retrieval-agents.drivers.form.nuclia.description.help' | translate"></pa-textarea>
      </div>

      @if (isSyncDriver) {
        <div class="form-entry">
          @if (customConfig) {
            <app-array-string-field
              [form]="form"
              arrayName="connection_ids"
              [label]="'retrieval-agents.drivers.form.nuclia.connections.ids' | translate"></app-array-string-field>
          } @else {
            @let options = syncConfigOptions | async;
            @if (!loadingSyncs() && (options || []).length > 0) {
              <label>{{ 'retrieval-agents.drivers.form.nuclia.connections.label' | translate }}</label>
              <div class="connections-container">
                @for (control of form.controls.connection_ids.controls; track control) {
                  @let notFound = control.value && !(syncConfigIds | async)?.includes(control.value);
                  <div class="connection">
                    <pa-select
                      [options]="options"
                      [formControl]="control"
                      [help]="
                        notFound ? ('retrieval-agents.drivers.form.nuclia.connections.not-found' | translate) : ''
                      "
                      externalLabel></pa-select>
                    <pa-button
                      aspect="basic"
                      icon="trash"
                      size="small"
                      (click)="removeConnection($index)"></pa-button>
                  </div>
                }
                <div>
                  <pa-button
                    aspect="basic"
                    icon="plus"
                    iconAndText
                    size="small"
                    (click)="addConnection()"
                    [disabled]="!(canAddConnections | async)">
                    {{ 'generic.add' | translate }}
                  </pa-button>
                </div>
              </div>
            }
          }
        </div>
      }

      @if (isEdit && hasDeprecatedFilters) {
        <div class="form-entry">
          <label for="filters">
            {{ 'retrieval-agents.workflow.node-types.ask.form.filters.label' | translate }}
          </label>
          <nsi-expandable-textarea
            id="filters"
            formControlName="filters"
            externalLabel=""
            rows="2"
            help="retrieval-agents.workflow.node-types.ask.form.filters.help"
            modalTitle="retrieval-agents.workflow.node-types.ask.form.filters.label"
            resizable="true"></nsi-expandable-textarea>
        </div>
      } @else {
        <div class="form-entry">
          <label for="filter_expression">
            {{ 'retrieval-agents.drivers.form.nuclia.filter-expression' | translate }}
          </label>
          <nsi-expandable-textarea
            id="filter_expression"
            formControlName="filter_expression"
            externalLabel=""
            rows="3"
            [modalTitle]="'retrieval-agents.drivers.form.nuclia.filter-expression' | translate"
            resizable="true"></nsi-expandable-textarea>
        </div>
        <div class="align-right">
          <pa-button
            aspect="basic"
            (click)="openFilterExpression()">
            {{ 'retrieval-agents.drivers.form.nuclia.use-assistant' | translate }}
          </pa-button>
        </div>
      }
    </form>
  </pa-modal-content>
  <pa-modal-footer>
    <pa-button
      aspect="basic"
      (click)="cancel()">
      {{ 'generic.cancel' | translate }}
    </pa-button>
    <pa-button
      kind="primary"
      [disabled]="form.invalid || form.pristine"
      (click)="submit()">
      {{ 'generic.save' | translate }}
    </pa-button>
  </pa-modal-footer>
</pa-modal-advanced>
