{% import '_includes/forms' as forms %}

<h1>Fields</h1>

{{ forms.field({
  instructions: 'For each schema, you can choose which fields are forbidden from being accessed through queries and mutations. Any attempts to access a restricted field will cause the request to throw.',
  first: true,
}, '') }}

<hr style='border-color:transparent' />

<div class="tablepane">
  <table class='data fullwidth'>
    <thead>
      <tr>
        <th>
          Field
        </th>

        {% for schema in schemaOptions %}
          {% if schema.value != '' %}
            <th>{{ schema.label }}</th>
          {% endif %}
        {% endfor %}
      </tr>
    </thead>

    <tbody>
      {% for field in fields %}
        {% set first = loop.first %}

        <tr>
          <td style='vertical-align:top;padding-top:20px'>
            {{ forms.field({
              label: field.name,
              instructions: "(" ~ field.handle ~ ")",
            }, '') }}
          </td>

          {% for schema in schemaOptions %}
            {% if schema.value != '' %}
              {% set schemaKey = 'schema-' ~ schema.value %}

              <td style='vertical-align:top;padding-top:20px'>
                {{ forms.selectField({
                  name: 'fieldRestrictions[' ~ schemaKey ~ '][' ~ field.handle ~ ']',
                  value: settings.fieldRestrictions[schemaKey][field.handle] ?? 'queryMutate',
                  options: [
                    { value: 'queryMutate', label: 'Query & Mutate' },
                    { value: 'query', label: 'Query' },
                    { value: 'private', label: 'Private' },
                  ],
                }) }}
              </td>
            {% endif %}
          {% endfor %}
        </tr>
      {% endfor %}
    </tbody>
  </table>
</div>