ui/lib/pipeline/addon/components/settings-git/template.hbs

<section>
  <div class="row nav nav-boxes checked-active">
      <a href="#" alt='github' class="col span-2 nav-box-item driver auth-driver github {{if (eq selectedOauthType 'github') 'active' ''}}" {{action "changeOauthType" "github"}}></a>
      {{!-- <div class="col span-1"></div>
      <a href="#" alt='gitlab' class="col span-2 nav-box-item driver auth-driver gitlab {{if (eq selectedOauthType 'gitlab') 'active' ''}}" {{action "changeOauthType" "gitlab"}}></a> --}}
  </div>
</section>

{{#if model.githubConfig}}
  <section>
    {{banner-message icon="icon-success" color='bg-success mb-0 mt-10' message=(t 'authPage.github.header.enabled.label' github='GitHub')}}
  </section>
  <section class="box mt-30">
    <h3>{{t 'authPage.github.authenticated.header.text'}}</h3>
    <hr/>
    {{#if model.githubConfig.host}}
      <div><b>{{t 'authPage.github.authenticated.header.enterpriseHostName'}} </b> <span class="text-muted">{{model.githubConfig.host}}</span></div>
    {{/if}}
    <div><b>{{t 'authPage.github.authenticated.header.clientId.text'}} </b> <span class="text-muted">{{model.githubConfig.clientId}}</span></div>
    <p class="text-info">{{t 'pipelinesSetting.changeConfiguration' oauthType='GitHub'}}
    </p>
  </section>
  {{#if model.deploy}}
    <section class="box mt-30">
      <h3>{{t 'authPage.github.authenticated.disableAccess.header' htmlSafe=true}}</h3>
      <hr/>

      {{#if confirmDisable}}
          {{#if revoking}}
            <button class="btn bg-disabled" disabled="disabled">
              <i class="icon icon-spinner icon-spin"></i> {{t 'generic.destroying'}}
          </button>
          {{else}}
          <button class="btn bg-error" {{action "disable"}}>
            <i class="icon icon-alert"></i> {{t 'pipelinesSetting.sureToDisableOAuth'}}
          </button>
          {{/if}}
      {{else}}
        <button class="btn bg-error" {{action "promptDisable"}}>
          <i class="icon icon-umbrella"></i> {{t 'pipelinesSetting.disableOAuth'}}
        </button>
      {{/if}}
    </section>
  {{else}}
    <section class="box mt-30">
      {{banner-message icon="icon-close" color='bg-error mb-0 mt-10' message='Pipeline Deploy Failed, Try Again'}}
      <hr/>
      <button class="btn bg-info" {{action "deployPipeline"}}>
        <i class="icon icon-umbrella"></i> {{t 'generic.deploy'}}
      </button>
    </section>
  {{/if}}
{{/if}}

{{#unless model.githubConfig}}
  {{#if (and globalGithubConfig.enabled useGloableConfig)}}
    <section>
      {{banner-message icon="icon-info" color='bg-info mb-0 mt-10' message=(t 'pipelinesSetting.userGlobalConfig' github='GitHub')}}
    </section>
    <section class="box mt-30">
      <h3>{{t 'authPage.github.authenticated.header.text'}} <div class="pull-right"><a href="javascript:void();" {{action 'changeOauthSource' false}}>{{t 'pipelinesSetting.customConfigChangeLabel'}}</a></div></h3>
      <hr/>
      {{#if globalGithubConfig.hostname}}
        <div><b>{{t 'authPage.github.authenticated.header.enterpriseHostName'}} </b> <span class="text-muted">{{globalGithubConfig.hostname}}</span></div>
      {{/if}}
      <div><b>{{t 'authPage.github.authenticated.header.clientId.text'}} </b> <span class="text-muted">{{globalGithubConfig.clientId}}</span></div>
      <p class="text-info">{{t 'pipelinesSetting.userGlobalConfig'}}
      </p>

      {{top-errors errors=errors}}
      <div class="row text-center">
        <button disabled={{createDisabled}} class="btn bg-primary" {{action "globalGithubConfigAuthenticate"}}>
          {{#if testing}}
            <i class="icon icon-spinner icon-spin"></i> {{t 'authPage.github.testAuth.buttonText.post'}}
          {{else}}
            <i class="icon icon-{{selectedOauthType}}"></i> {{t 'authPage.github.testAuth.buttonText.preVariable' GitHub=selectedOauthType}}
          {{/if}}
        </button>
      </div>
    </section>
  {{else}}
    <section>
      <div class="banner bg-warning">
        <div class="banner-icon"><span class="icon icon-alert"></span></div>
        <div class="banner-message">
          {{#if (eq selectedOauthType 'github')}}
            <p>{{t 'authPage.github.header.disabled.label'}}</p>
          {{/if}}
          {{#if (eq selectedOauthType 'gitlab')}}
            <p>{{t 'authPage.github.header.disabled.labelGitlab'}}</p>
          {{/if}}
        </div>
      </div>
    </section>
    <section class="box mt-30">
      {{#if globalGithubConfig.enabled
      }}
        <h3>{{t 'authPage.github.notAuthenticated.headerVariable'}} <div class="pull-right"><a href="javascript:void();" class="{{if globalGithubConfig.enabled  "" "text-line-through text-muted"}}" {{action 'changeOauthSource' true}}>{{t 'pipelinesSetting.globalConfigChangeLabel'}}</a></div></h3>
      {{/if}}
      <hr/>
      <p>
        <ol class="alphalist ml-40">
          {{#if (eq selectedOauthType 'github')}}
          <li>
            {{{t 'authPage.github.notAuthenticated.ul.li1.text'}}}
          </li>
          {{/if}}
          {{#if (eq selectedOauthType 'gitlab')}}
          <li>
            {{{t 'authPage.github.notAuthenticated.ul.li1.gitlabText'}}}
          </li>
          {{/if}}
          <li>
            {{#if (eq selectedOauthType 'github')}}
              {{t 'authPage.github.notAuthenticated.ul.li2.text'}}
            {{/if}}
            {{#if (eq selectedOauthType 'gitlab')}}
              {{t 'authPage.github.notAuthenticated.ul.li2.text2'}}
            {{/if}}
            <ul>
              <li>
                {{#if (eq selectedOauthType 'github')}}
                  {{t 'authPage.github.notAuthenticated.ul.li2.ul.li1' appName="Rancher Pipeline" htmlSafe=true}}
                {{/if}}
                {{#if (eq selectedOauthType 'gitlab')}}
                  {{t 'authPage.github.notAuthenticated.ul.li2.ul.li1_2' appName="Rancher Pipeline" htmlSafe=true}}
                {{/if}}

              </li>
              {{#if (eq selectedOauthType 'github')}}
              <li>
                <b>{{t 'authPage.github.notAuthenticated.ul.li2.ul.li2'}}</b> <span>{{homePageURL}}{{copy-to-clipboard size='small' clipboardText=homePageURL htmlSafe=true}}</span>
              </li>
              <li>{{t 'authPage.github.notAuthenticated.ul.li2.ul.li3' htmlSafe=true}}</li>
              {{/if}}
              <li>
                {{#if (eq selectedOauthType 'github')}}
                  <b>{{t 'authPage.github.notAuthenticated.ul.li2.ul.li4'}}</b>
                {{/if}}
                {{#if (eq selectedOauthType 'gitlab')}}
                  <b>{{t 'authPage.github.notAuthenticated.ul.li2.ul.li4_2'}}</b>
                {{/if}}
                <span id="auth-callback-url">{{destinationUrl}} {{copy-to-clipboard size='small' clipboardText=destinationUrl}}</span></li>
            </ul>
          </li>
          <li>
          {{#if (eq selectedOauthType 'github')}}
            {{t 'authPage.github.notAuthenticated.ul.li3.text'}}
          {{/if}}
          {{#if (eq selectedOauthType 'gitlab')}}
            {{t 'authPage.github.notAuthenticated.ul.li3.text2'}}
          {{/if}}
          </li>
        </ol>
      </p>
    </section>

    <form autcomplete="on">
      <section class="box mt-30">
        <h3>{{t 'authPage.github.notAuthenticated.form.headerVariable' appName='Rancher Pipeline' SCM='GitHub' }}</h3>
        <div class="row">
          <div class="col span-6">
            <div class="inline-form">
              <label class="acc-label pb-5">{{t 'authPage.github.notAuthenticated.form.clientId.labelText'}}{{field-required}}</label>
              {{input type="text" name="username" value=oauthModel.clientId classNames="form-control"}}
              <p class="help-block">{{t 'authPage.github.notAuthenticated.form.subtextVariable' GitHub=selectedOauthType}}</p>
            </div>
          </div>
          <div class="col span-6">
            <div class="inline-form">
              <label class="acc-label pb-5">{{t 'authPage.github.notAuthenticated.form.clientSecret.labelText'}}{{field-required}}</label>
              {{input type="password" name="password" value=oauthModel.clientSecret classNames="form-control"}}
              <div class="checkbox pt-10">
                <label class="acc-label pb-5">{{input type="checkbox" checked=isEnterprise}} {{#if (eq selectedOauthType 'github')}} {{t 'authPage.github.notAuthenticated.form.ghEnterprise.labelText'}} {{/if}} {{#if (eq selectedOauthType 'gitlab')}} {{t 'authPage.github.notAuthenticated.form.glPrivate.labelText'}}{{/if}}</label>
              </div>
              {{#liquid-if isEnterprise}}
                <div class="checkbox pt-10">
                  <label class="acc-label pb-5">{{input type="checkbox" checked=secure}} {{t 'authPage.github.notAuthenticated.form.isGHEnterprise.labelText'}} (<code>https://</code>).</label>
                </div>
              {{/liquid-if}}
              {{#liquid-if isEnterprise}}
              <label class="acc-label pb-5">{{t 'authPage.github.notAuthenticated.form.enterpriseHost.labelText'}}{{field-required}}</label>
               {{#if (eq selectedOauthType 'github')}} {{input type="text" value=oauthModel.hostName classNames="form-control" placeholder=(t 'authPage.github.notAuthenticated.form.enterpriseHost.placeholder')}}
               {{/if}}
               {{#if (eq selectedOauthType 'gitlab')}} {{input type="text" value=oauthModel.hostName classNames="form-control" placeholder=(t 'authPage.github.notAuthenticated.form.enterpriseHost.placeholder2')}}
               {{/if}}
              {{/liquid-if}}
            </div>
          </div>
        </div>

        {{top-errors errors=errors}}

        <div class="row text-center">
          <button disabled={{createDisabled}} class="btn bg-primary" {{action "authenticate"}}>
            {{#if testing}}
              <i class="icon icon-spinner icon-spin"></i> {{t 'authPage.github.testAuth.buttonText.post'}}
            {{else}}
              <i class="icon icon-{{selectedOauthType}}"></i> {{t 'authPage.github.testAuth.buttonText.preVariable' GitHub=selectedOauthType}}
            {{/if}}
          </button>
        </div>
      </section>
    </form>
  {{/if}}
{{/unless}}