<%= form_for '', url: template_submissions_path(template), html: { class: 'space-y-4', autocomplete: 'off' }, data: { turbo_frame: :_top } do |f| %>
  <% submitters = template.submitters.reject { |e| e['invite_by_uuid'].present? || e['optional_invite_by_uuid'].present? } %>
  <% if submitters.size == 1 %>
    <submitter-item class="form-control">
      <emails-textarea data-bulk-enabled="<%= Docuseal.demo? || !Docuseal.multitenant? || can?(:manage, :bulk_send) %>" data-limit="<%= Docuseal.multitenant? ? (can?(:manage, :bulk_send) ? 40 : 1) : nil %>">
        <submitters-autocomplete data-field="email" class="block relative">
          <autoresize-textarea>
            <%= f.text_area :emails, required: true, class: 'base-textarea w-full !text-lg', placeholder: "#{t('type_emails_here')}...", rows: 2 %>
          </autoresize-textarea>
        </submitters-autocomplete>
      </emails-textarea>
    </submitter-item>
  <% else %>
    <dynamic-list class="space-y-4">
      <div class="space-y-4">
        <div class="card card-compact bg-base-300/40" data-targets="dynamic-list.items">
          <div class="card-body">
            <div class="absolute right-4 top-5">
              <a href="#" data-action="click:dynamic-list#removeItem" class="-top-3 relative block w-6 h-6 rounded-lg text-neutral-700 text-center bg-base-300 p-1 hidden hover:bg-neutral hover:text-white">
                <%= svg_icon('trash', class: 'w-4 h-4') %>
              </a>
            </div>
            <div class="grid md:grid-cols-2 gap-4">
              <% submitters.each_with_index do |item, index| %>
                <submitter-item class="form-control">
                  <label class="label pt-0 pb-1">
                    <span class="label-text"> <%= item['name'] %></span>
                  </label>
                  <input type="hidden" name="submission[1][submitters][][uuid]" value="<%= item['uuid'] %>">
                  <submitters-autocomplete data-field="email">
                    <linked-input data-target-id="<%= "email_#{item['linked_to_uuid']}" if item['linked_to_uuid'].present? %>">
                      <%= tag.input type: 'email', multiple: true, name: 'submission[1][submitters][][email]', autocomplete: 'off', class: 'base-input !h-10 w-full', placeholder: t('email'), required: index.zero?, value: item['email'].presence || ((params[:selfsign] && index.zero?) || item['is_requester'] ? current_user.email : ''), id: "email_#{item['uuid']}" %>
                    </linked-input>
                  </submitters-autocomplete>
                </submitter-item>
              <% end %>
            </div>
          </div>
        </div>
      </div>
      <% if params[:selfsign].blank? %>
        <a href="#" class="btn btn-primary btn-sm w-full flex items-center justify-center" data-action="click:dynamic-list#addItem">
          <%= svg_icon('user_plus', class: 'w-4 h-4 stroke-2') %>
          <span><%= t('add_new') %></span>
        </a>
      <% end %>
    </dynamic-list>
  <% end %>
  <div>
    <%= render 'send_email', f:, template: %>
    <%= render('submitters_order', f:, template:) if Accounts.can_send_emails?(current_account) %>
  </div>
  <div class="form-control">
    <%= content_for(:submit_button) || capture do %>
      <%= f.button button_title(title: t('add_recipients')), class: 'base-button' %>
    <% end %>
  </div>
<% end %>
