<LinkTo @route="adminApiKeys.index" class="go-back">
  {{d-icon "arrow-left"}}
  <span>{{i18n "admin.api.all_api_keys"}}</span>
</LinkTo>

<div class="api-key api-key-new">
  {{#if this.model.id}}
    <AdminFormRow @label="admin.api.key">
      <div>{{this.model.key}}</div>
    </AdminFormRow>
    <AdminFormRow>
      {{i18n "admin.api.not_shown_again"}}
    </AdminFormRow>
    <AdminFormRow>
      <DButton
        @icon="angle-right"
        @label="admin.api.continue"
        @action={{action "continue"}}
        @class="btn-primary"
      />
    </AdminFormRow>
  {{else}}
    <AdminFormRow @label="admin.api.description">
      <Input
        @value={{this.model.description}}
        maxlength="255"
        placeholder={{i18n "admin.api.description_placeholder"}}
      />
    </AdminFormRow>

    <AdminFormRow @label="admin.api.user_mode">
      <ComboBox
        @content={{this.userModes}}
        @value={{this.userMode}}
        @onChange={{action "changeUserMode"}}
      />
    </AdminFormRow>

    {{#if this.showUserSelector}}
      <AdminFormRow @label="admin.api.user">
        <EmailGroupUserChooser
          @value={{this.model.username}}
          @onChange={{action "updateUsername"}}
          @options={{hash
            maximum=1
            filterPlaceholder="admin.api.user_placeholder"
          }}
        />
      </AdminFormRow>
    {{/if}}

    <AdminFormRow @label="admin.api.scope_mode">
      <ComboBox
        @content={{this.scopeModes}}
        @value={{this.scopeMode}}
        @onChange={{action "changeScopeMode"}}
      />

      {{#if (eq this.scopeMode "read_only")}}
        <p>{{i18n "admin.api.scopes.descriptions.global.read"}}</p>
      {{else if (eq this.scopeMode "global")}}
        <p>{{i18n "admin.api.scopes.global_description"}}</p>
      {{/if}}
    </AdminFormRow>

    {{#if (eq this.scopeMode "granular")}}
      <h2 class="scopes-title">{{i18n "admin.api.scopes.title"}}</h2>
      <p>{{i18n "admin.api.scopes.description"}}</p>
      <table class="scopes-table grid">
        <thead>
          <tr>
            <td></td>
            <td></td>
            <td>{{i18n "admin.api.scopes.allowed_urls"}}</td>
            <td>{{i18n "admin.api.scopes.optional_allowed_parameters"}}</td>
          </tr>
        </thead>
        <tbody>
          {{#each-in this.scopes as |resource actions|}}
            <tr class="scope-resource-name">
              <td><b>{{resource}}</b></td>
              <td></td>
              <td></td>
              <td></td>
            </tr>
            {{#each actions as |act|}}
              <tr>
                <td><Input @type="checkbox" @checked={{act.selected}} /></td>
                <td>
                  <div class="scope-name">{{act.name}}</div>
                  <span
                    class="scope-tooltip"
                    data-tooltip={{i18n
                      (concat
                        "admin.api.scopes.descriptions." resource "." act.key
                      )
                    }}
                  >
                    {{d-icon "question-circle"}}
                  </span>
                </td>
                <td>
                  <DButton
                    @icon="link"
                    @action={{action "showURLs" act.urls}}
                    @class="btn-info"
                  />
                </td>
                <td>
                  {{#each act.params as |p|}}
                    <Input
                      maxlength="255"
                      @value={{get act p}}
                      placeholder={{p}}
                    />
                  {{/each}}
                </td>
              </tr>
            {{/each}}
          {{/each-in}}
        </tbody>
      </table>
    {{/if}}

    <DButton
      @icon="check"
      @label="admin.api.save"
      @action={{action "save"}}
      @class="btn-primary"
      @disabled={{this.saveDisabled}}
    />
  {{/if}}
</div>