{{ define "page:content" }}
<form method="POST" hx-post="{{.formAction}}" hx-target="{{.formTarget}}" autocomplete="off" style="margin-bottom: 10px;">
  <div class="page-container">
  <div class="tab-bar">
    <a class="active tab-button" onclick="bm_open_tab(this, 'tab-button', 'tab', 'general')">General</a>
    <a class="tab-button" onclick="bm_open_tab(this, 'tab-button', 'tab', 'fields')">Fields</a>
  </div>

  <div class="tab" id="general" style="display: block">
    <div class="row">
      <div class="col half">
        <p>
          <label for="type-title">Title</label>
          <input name="Title" id="type-title" type="text" value="{{.type.Title}}"/>
        </p>
        <p>
          <label for="type-icon">Icon</label>
          <input name="Icon" id="type-icon" type="text" value="{{.type.Icon}}"/>
        </p>
      </div>
      <div class="col half">
        <p>{{ widget_checkboxes "Notebooks" "Notebooks" .type.Notebooks .notebooks `class=""` }}</p>
      </div>
    </div>

    <p>
      <label for="type-description">Description</label>
      <textarea name="Description" id="type-description" rows="5">{{.type.Description}}</textarea>
    </p>

    <p>{{ widget_checkbox "Show_summary" "Show summary" "1" .type.Show_summary }}</p>

    <p>{{ widget_checkbox "Show_description" "Show description" "1" .type.Show_description }}</p>
  </div>

  <div class="tab" id="fields" style="display: none">
    <div id="fields-list" style="margin-bottom: 10px">
      {{ template "types:fields" (map "fields" .type.Fields "widgets" $.widgets "uisections" $.uisections)}}
    </div>
    <div class="bar">
      <a class="button main" style="float:right; margin-top: 10px;" hx-get="/type/field-new" hx-target="#fields-list" hx-swap="beforeend" href="#" hx-vals="js:{counter: document.getElementById(&quot;fields-list&quot;).childElementCount + 1}"><i class="bi bi-file-plus" title="Add field"></i><span class="hide-xsmall"> Add field</span></a>
    </div>
  </div>

</div>
  <div id="footer-navbar">
    <button type="submit" class="main" title="Save"><i class="bi bi-floppy"></i><span>Save</span></button>
    <a class="button secondary" hx-target="#page-content" hx-push-url="true" hx-get="/types"><i class="bi bi-arrow-left-circle" title="Back"></i><span>Back</span></a>
  </div>
</form>
{{ end }}
