<section>
  {{#unless isEnabled}}
      <BannerMessage
          @color='bg-warning'
          @icon='icon-alert'
          @message={{t 'authPage.googleoauth.header.disabled.label'}}
      />
  {{/unless}}
  {{top-errors errors=errors}}
</section>

{{#accordion-list showExpandAll=false  as |al expandFn|}}

  {{#if isEnabled}}
    {{#accordion-list-item
         expand=(action expandFn)
         expandAll=al.expandAll
         expandOnInit=true
         expanded=true
         showExpand=false
         title=(t 'authPage.googleoauth.authenticated.header.text')
    }}
      <section class=''>
        <div class='clearfix'>
          <div class='pull-right'>
            <button class='btn btn-sm right-divider-btn bg-error' {{action 'disable'}}>
              {{t 'authPage.googleoauth.authenticated.disableAccess.disable'}}
            </button>
          </div>
        </div>
        <hr />
        <div><b>{{t 'authPage.googleoauth.authenticated.header.adminEmail.text'}} </b> <span class='text-muted'>{{authConfig.adminEmail}}</span></div>
      </section>
    {{/accordion-list-item}}

    {{#accordion-list-item
         classNames='mt-30'
         detail=(t 'siteAccess.helpText' appName=settings.appName htmlSafe=true)
         expand=(action expandFn)
         expandAll=al.expandAll
         expandOnInit=true
         expanded=true
         showExpand=false
         title=(t 'siteAccess.header')
    }}
      {{site-access
          model=authConfig
          principals=model.principals
          collection='siteAccess.organizations'
      }}
    {{/accordion-list-item}}
  {{/if}}

  {{#unless isEnabled}}
    {{#accordion-list-item
        expand=(action expandFn)
        expandAll=al.expandAll
        expandOnInit=true
        expanded=true
        showExpand=false
        title=(t 'authPage.googleoauth.notAuthenticated.header')
    }}
      <section class=''>
        <p>
          <ol class='alphalist ml-40'>
            <li>
              {{t 'authPage.googleoauth.notAuthenticated.ul.li1.text' htmlSafe=true}}
              <ul>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li1.ul.li1'}}
                  <p class="help-block">{{t 'authPage.googleoauth.notAuthenticated.ul.li1.helpertext'}}</p>
                </li>
              </ul>
            </li>
            <li>
              {{t 'authPage.googleoauth.notAuthenticated.ul.li2.text'}}
              <ul>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li2.ul.li1' appName=settings.appName htmlSafe=true}}
                  <span>
                    {{destinationDomain}}
                    {{copy-to-clipboard
                      size='small'
                      clipboardText=destinationDomain
                      htmlSafe=true
                    }}
                  </span>
                  <p class="help-block">{{t 'authPage.googleoauth.notAuthenticated.ul.li2.helperText'}}</p>
                </li>
                <li>
                  <b>{{t 'authPage.googleoauth.notAuthenticated.ul.li2.ul.li2' htmlSafe=true}}</b>
                  <span>
                    {{destinationUrl}}
                    {{copy-to-clipboard
                      size='small'
                      clipboardText=destinationUrl
                      htmlSafe=true
                    }}
                  </span>
                </li>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li2.ul.li3'}}</li>
              </ul>
            </li>
            <li>
              {{t 'authPage.googleoauth.notAuthenticated.ul.li3.text'}}
              <ul>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li3.ul.li1'}}
                </li>
                <li>
                  <b>{{t 'authPage.googleoauth.notAuthenticated.ul.li3.ul.li2' htmlSafe=true}}</b>
                  <span>
                    {{authorizedJavascriptOrigin}}
                    {{copy-to-clipboard
                      size='small'
                      clipboardText=authorizedJavascriptOrigin
                      htmlSafe=true
                    }}
                  </span>
                </li>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li3.ul.li3' htmlSafe=true}}
                  <span>
                    {{redirectURI}}
                    {{copy-to-clipboard
                      size='small'
                      clipboardText=redirectURI
                      htmlSafe=true
                    }}
                  </span>
                </li>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li3.ul.li4'}}</li>
              </ul>
            </li>
             <li>
              {{t 'authPage.googleoauth.notAuthenticated.ul.li4.text'}}
              <ul>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li4.ul.li1' htmlSafe=true}}</li>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li4.ul.li2'}}
                </li>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li4.ul.li3'}}</li>
                <li>{{t 'authPage.googleoauth.notAuthenticated.ul.li4.ul.li4'}}</li>
              </ul>
            </li>
          </ol>
        </p>
      </section>
    {{/accordion-list-item}}

    {{#accordion-list-item
         expand=(action expandFn)
         expandAll=al.expandAll
         expandOnInit=true
         expanded=true
         showExpand=false
         title=(t 'authPage.googleoauth.notAuthenticated.form.header' appName=settings.appName)
    }}
      <form autcomplete='on'>
        <section class=''>

          <div class='row'>
            <div class='col span-6'>
              <div class='inline-form'>
                <label class='acc-label pb-5'>{{t 'authPage.googleoauth.notAuthenticated.form.adminEmail.labelText'}}{{field-required}}</label>
                {{input
                  type='text'
                  name='username'
                  value=authConfig.adminEmail
                  classNames='form-control'
                }}
                <p class='help-block'>{{t 'authPage.googleoauth.notAuthenticated.form.adminEmail.helperText'}}</p>
              </div>
            </div>
            <div class='col span-6'>
              <div class='inline-form'>
                <label class='acc-label pb-5'>{{t 'authPage.googleoauth.notAuthenticated.form.hostname.labelText'}}{{field-required}}</label>
                {{input
                  type='text'
                  value=authConfig.hostname
                  classNames='form-control'
                }}
                <p class='help-block'>{{t 'authPage.googleoauth.notAuthenticated.form.hostname.helperText'}}</p>
              </div>
            </div>
          </div>

          <div class='row'>
            <div class='col span-12'>
              {{#input-text-file
                classNames='box'
                label='authPage.googleoauth.notAuthenticated.form.oauthCredential.labelText'
                value=authConfig.oauthCredential
                accept='text/*, .json'
                minHeight=60
                canChangeName=false
                nameRequired=true
                placeholder='authPage.googleoauth.notAuthenticated.form.oauthCredential.labelText'
                concealValue=true
                as |section|
              }}
                {{#if (eq section 'description')}}
                  <div class='row help'>
                    <div class='col span-12 help-block wrap mb-0'>
                      {{t 'authPage.googleoauth.notAuthenticated.form.oauthCredential.helperText' htmlSafe=true}}
                    </div>
                  </div>
                {{/if}}
              {{/input-text-file}}
            </div>
          </div>

          <div class='row'>
            <div class='col span-12'>
              {{#input-text-file
                classNames='box'
                label='authPage.googleoauth.notAuthenticated.form.serviceAccountCredential.labelText'
                value=authConfig.serviceAccountCredential
                accept='text/*, .json'
                minHeight=60
                canChangeName=false
                nameRequired=true
                placeholder='authPage.googleoauth.notAuthenticated.form.serviceAccountCredential.labelText'
                concealValue=true
                as |section|
              }}
                {{#if (eq section 'description')}}
                  <div class='row help'>
                    <div class='col span-12 help-block wrap mb-0'>
                      {{t 'authPage.googleoauth.notAuthenticated.form.serviceAccountCredential.helperText' htmlSafe=true}}
                    </div>
                  </div>
                {{/if}}
              {{/input-text-file}}
            </div>
          </div>

          <div class='row text-center'>
            <div class='btn-group'>
              <button
                disabled={{buttonDisabled}}
                class='btn bg-primary'
                {{action 'save'}}>
                {{#if saving}}
                  <i class='icon icon-spinner icon-spin'></i> {{t 'authPage.googleoauth.testAuth.buttonText.post'}}
                {{else if doneSaving}}
                  {{t 'generic.saved'}}
                {{else}}
                  <i class='icon icon-google'></i> {{t 'authPage.googleoauth.testAuth.buttonText.pre'}}
                {{/if}}
              </button>
              <button {{action 'cancel'}} class='btn bg-transparent'>{{t 'saveCancel.cancel'}}</button>
            </div>
          </div>

        </section>
      </form>
    {{/accordion-list-item}}
  {{/unless}}
{{/accordion-list}}