<div class="table--settings-modal hide">
  <div class="modal--container">
    <div class="modal--content-container">
      <div class="modal--header">
        <div class="row">
          <div class="col-sm-10">
            <h2>Table settings: <%= @table.humanize %></h2>
          </div>
          <div class="col-sm-2">
            <div class="modal--close-btn">
              <img src="/assets/images/icons/close.png">
            </div>
          </div>
        </div>
      </div>
      <div class="modal--content">
        <div class="row">
          <div class="col-sm-12">
            <p>Settings that you change here will change for everyone viewing and interacting with this table.</p>
          </div>
        </div>
        <%= form_tag("/table/update_settings", method: "post", remote: true) do %>
          <div class="row">
            <div class="col-sm-12">
              <h4>GENERAL</h4>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-8">
              <h4>Nested table</h4>
              <p>See the data of a related table inline with this table</p>
            </div>
            <div class="col-sm-4">
              <div class="table--settings-dropdown">
                <div class="form-control dropdown">
                  <% if @related_tables.empty? %>
                    <%= select_tag "nested_table", options_for_select(["N/A"], "N/A"), {class: "table--settings-nested-select", disabled: true} %>
                  <% else %>
                    <%= select_tag "nested_table", options_for_select(["Disable", @related_tables].flatten, @table_settings.nested_table), {class: "table--settings-nested-select", "data-table" => @table, "data-setting" => "nested_table"} %>
                  <% end %>
                </div>
              </div>
            </div>
          </div>

          <div class="row">
            <div class="col-sm-8">
              <h4>Primay key(s)</h4>
              <p>Set the primary key(s) for the table. If there are mulitple keys, seperate them by a space (i.e. "customer_id category_id")</p>
            </div>
            <div class="col-sm-4">
              <div class="table--settings-primary-keys">
                <%= text_field_tag "primary_keys", @table_settings.primary_keys["primary_keys"], class: "form-control m-b" %>
              </div>
            </div>
          </div>


          <div class="row">
            <div class="col-sm-12">
              <h4>PERMISSIONS</h4>
            </div>
          </div>

            <%# <%= form_tag("/table/update_settings", method: "post", remote: true) do %>

          <div class="row">
            <div class="col-sm-12">
              <table class="table settings--permissions-table">
                <thead>
                  <tr>
                    <th scope="col"><div class="settings--permissions-table-fields"></div></th>
                    <th scope="col">
                      <h4>Editable</h4>
                      <p>Set fields that can be edited by teams with edit permiossion on this table.</p>
                    </th>
                    <th scope="col">
                      <h4>Mandatory</h4>
                      <p>For creating a record.</p>
                    </th>
                  </tr>
                </thead>
                <tbody>
                  <% @table_settings.editable_fields.each do |field, value| %>
                    <tr>
                      <th scope="row"><%= field.humanize %></th>
                      <td>
                        <div class="table--settings-dropdown">
                          <div class="form-control dropdown">
                            <%= select_tag "[editable_fields][#{field}][editable]", options_for_select([ ["Yes", true], ["No", false] ], @table_settings.editable_fields[field]["editable"]), { class: "table--settings-select" } %>
                          </div>
                        </div>
                      </td>
                      <td>
                        <div class="settings--mandatory-toggle">
                          <label class="switch">
                            <div class='toggle'>
                              <% checked_value = @table_settings.editable_fields[field]["mandatory"] %>
                              <%= check_box_tag "[editable_fields][#{field}][mandatory]", checked_value, checked_value, class: 'form-control toggle-state' %>
                              <div class='toggle-inner'>
                                <div class='indicator'></div>
                              </div>
                              <div class='active-bg'></div>
                            </div>
                          </label>
                        </div>
                      </td>
                    </tr>
                  <% end %>
                </tbody>
              </table>
            </div>
          </div>

          <div class="row">
            <div class="col-sm-12">
              <div class="settings--save-btn">
                <%= hidden_field_tag(:table, @table) %>
                <%= hidden_field_tag(:database_id, @database.id) %>
                <%= submit_tag('Save', class: 'btn btn-primary btn--save-record float-right') %>
              </div>
            </div>
          </div>
        <% end %>
      </div>
    </div>
  </div>
</div>