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

<h1>User Settings</h1>

{{ forms.selectField({
  label: 'Permission Type',
  instructions: 'Choose whether to have one schema for all users, or a schema per user group.',
  name: 'permissionType',
  id: 'permissionType',
  value: settings.permissionType,
  options: [
    { label: 'Single Schema', value: 'single' },
    { label: 'Multiple Schemas', value: 'multiple' },
  ],
  required: true,
}) }}

{{ forms.field({
  label: 'Allow Magic Authentication',
  instructions: 'When enabled, Magic Code mutations will be available in the schema.',
  name: 'allowMagicAuthentication',
}, forms.lightswitch({
  name: 'allowMagicAuthentication',
  on: settings.allowMagicAuthentication,
})) }}

{% if craft.app.plugins.isPluginEnabled('two-factor-authentication') %}
  {{ forms.field({
    label: 'Allow Two-Factor Authentication',
    instructions: 'When enabled, Two-Factor mutations will be available in the schema.',
    name: 'allowTwoFactorAuthentication',
  }, forms.lightswitch({
    name: 'allowTwoFactorAuthentication',
    on: settings.allowTwoFactorAuthentication,
  })) }}
{% endif %}

{{ forms.field({
  label: 'Allow Passwordless Account Deletion',
  instructions: 'When enabled, the plugin will no longer validate a user’s password when using the `deleteAccount` mutation.',
  name: 'allowPasswordlessDelete',
}, forms.lightswitch({
  name: 'allowPasswordlessDelete',
  on: settings.allowPasswordlessDelete,
})) }}

{{ forms.field({
  label: 'Skip Activated Check',
  instructions: 'When enabled, the plugin will no longer validate a user’s activation status on incoming requests.',
  name: 'skipActivatedCheck',
}, forms.lightswitch({
  name: 'skipActivatedCheck',
  on: settings.skipActivatedCheck,
})) }}

{% if settings.permissionType == 'single' %}
  <hr/>

  {% set schemaInput = schemaOptions ? forms.selectField({
      name: 'schemaName',
      value: settings.schemaName,
      options: schemaOptions,
    }) : tag('p', {
      class: ['warning', 'with-icon'],
      text: 'No schemas exist yet.'|t('app'),
    })
  %}

  {{ forms.field({
    label: 'GraphQL Schema',
    instructions: 'The schema that JWTs will be assigned to through the `authenticate` and `register` mutations.',
    name: 'schemaName',
    required: true,
  }, schemaInput) }}

  {{ forms.field({
    label: 'Allow Registration',
    instructions: 'When enabled, the `register` mutation will be available in the schema.',
    name: 'allowRegistration',
  }, forms.lightswitch({
    name: 'allowRegistration',
    on: settings.allowRegistration,
  })) }}

  {{ forms.selectField({
    label: 'User Group',
    instructions: 'The user group that users will be assigned to when created through the `register` mutation.',
    name: 'userGroup',
    value: settings.userGroup,
    options: userOptions,
  }) }}


  {% if siteOptions|length > 2 %}
    {{ forms.selectField({
      label: 'Site',
      instructions: 'The site users will be restricted to querying/mutating.',
      name: 'siteId',
      value: settings.siteId,
      options: siteOptions,
    }) }}
  {% endif %}

  {% if not settings.schemaName %}
    {{ forms.field({
      label: 'User Permissions',
      instructions: 'Select your desired schema and save to modify user permissions.',
    }, '') }}
  {% else %}
    {% if entryQueries %}
      <div class="field">
        <div class="heading">
          <label>Restricted Entry Queries</label>

          <div class="instructions">
            <p>Users will only be able to query their own entries in the selected sections. Only sections allowed in your schema will show here.</p>
          </div>
        </div>

        <div class="input">
          {% for query in entryQueries %}
            <div>
              {{ forms.checkbox({
                label: query.label,
                name: 'entryQueries[' ~ query.handle ~ ']',
                value: true,
                checked: settings.entryQueries[query.handle] ?? false,
              }) }}
            </div>
          {% endfor %}
        </div>
      </div>
    {% endif %}

    {% if entryMutations %}
      <div class="field">
        <div class="heading">
          <label>Restricted Entry Mutations</label>

          <div class="instructions">
            <p>Users will only be able to mutate their own entries in the selected sections. Only sections allowed in your schema will show here.</p>
          </div>
        </div>

        <div class="input">
          {% for mutation in entryMutations %}
            <div>
              {{ forms.checkbox({
                label: mutation.label,
                name: 'entryMutations[' ~ mutation.handle ~ ']',
                value: true,
                checked: settings.entryMutations[mutation.handle] ?? false,
              }) }}
            </div>
          {% endfor %}
        </div>
      </div>
    {% endif %}

    {% if assetQueries %}
      <div class="field">
        <div class="heading">
          <label>Restricted Asset Queries</label>

          <div class="instructions">
            <p>Users will only be able to query their own assets in the selected volumes. Only volumes allowed in your schema will show here.</p>
          </div>
        </div>

        <div class="input">
          {% for query in assetQueries %}
            <div>
              {{ forms.checkbox({
                label: query.label,
                name: 'assetQueries[' ~ query.handle ~ ']',
                value: true,
                checked: settings.assetQueries[query.handle] ?? false,
              }) }}
            </div>
          {% endfor %}
        </div>
      </div>
    {% endif %}

    {% if assetMutations %}
      <div class="field">
        <div class="heading">
          <label>Restricted Asset Mutations</label>

          <div class="instructions">
            <p>Users will only be able to mutate their own assets in the selected volumes. Only volumes allowed in your schema will show here.</p>
          </div>
        </div>

        <div class="input">
          {% for mutation in assetMutations %}
            <div>
              {{ forms.checkbox({
                label: mutation.label,
                name: 'assetMutations[' ~ mutation.handle ~ ']',
                value: true,
                checked: settings.assetMutations[mutation.handle] ?? false,
              }) }}
            </div>
          {% endfor %}
        </div>
      </div>
    {% endif %}
  {% endif %}
{% else %}
  <hr/>
  <h2>User Groups</h2>

  <table class="data">
    <colgroup>
      <col style="width: 50%">
      <col style="width: 15%">
      <col style="width: 15%">
      <col style="width: 15%">
      <col style="width: 5%">
    </colgroup>
    <thead>
      <tr>
        <th>User Group</th>
        <th>Schema</th>
        <th>Site</th>
        <th>Registration</th>
        <th style="text-align: right"></th>
      </tr>
    </thead>

    <tbody>
      {% for row in userGroupsTable %}
        {% set groupSettings = settings.granularSchemas[row.groupKey] ?? null %}
        <tr>
          <td>{{ row.name }}</td>
          <td>{{ row.schemaLabel }}</td>
          <td>{{ row.siteLabel }}</td>
          <td>{{ row.registrationLabel }}</td>
          <td style="text-align: right">
            {% if groupSettings is not empty %}
              {{ hiddenInput('granularSchemas[' ~ row.groupKey ~ '][schemaName]', groupSettings.schemaName ?? '') }}
              {{ hiddenInput('granularSchemas[' ~ row.groupKey ~ '][siteId]', groupSettings.siteId ?? '') }}
              {{ hiddenInput('granularSchemas[' ~ row.groupKey ~ '][allowRegistration]', (groupSettings.allowRegistration ?? false) ? 1 : 0) }}

              {% for handle, allowed in groupSettings.entryQueries ?? {} %}
                {{ hiddenInput('granularSchemas[' ~ row.groupKey ~ '][entryQueries][' ~ handle ~ ']', allowed ? 1 : 0) }}
              {% endfor %}

              {% for handle, allowed in groupSettings.entryMutations ?? {} %}
                {{ hiddenInput('granularSchemas[' ~ row.groupKey ~ '][entryMutations][' ~ handle ~ ']', allowed ? 1 : 0) }}
              {% endfor %}

              {% for handle, allowed in groupSettings.assetQueries ?? {} %}
                {{ hiddenInput('granularSchemas[' ~ row.groupKey ~ '][assetQueries][' ~ handle ~ ']', allowed ? 1 : 0) }}
              {% endfor %}

              {% for handle, allowed in groupSettings.assetMutations ?? {} %}
                {{ hiddenInput('granularSchemas[' ~ row.groupKey ~ '][assetMutations][' ~ handle ~ ']', allowed ? 1 : 0) }}
              {% endfor %}
            {% endif %}

            <a href="{{ url('graphql-authentication/settings/user-group/' ~ row.id) }}" class="btn btn small">Configure</a>
          </td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
{% endif %}

<script>
  const usersForm = document.getElementById('main-form');
  const permissionType = document.getElementById('settings-permissionType');
  permissionType.addEventListener('change', () => usersForm.submit());
</script>