GitHub CI/CD-only projects FE

MR: https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/4688
Other MR for "Repo by URL",
https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/4642

app/assets/javascripts/importer_status.js

-import { __ } from './locale';
+import _ from 'underscore';
+import { __, sprintf } from './locale';
 import axios from './lib/utils/axios_utils';
 import flash from './flash';
+import { convertPermissionToBoolean } from './lib/utils/common_utils';
 
 class ImporterStatus {
-  constructor(jobsUrl, importUrl) {
+  constructor({ jobsUrl, importUrl, ciCdOnly }) {
     this.jobsUrl = jobsUrl;
     this.importUrl = importUrl;
+    this.ciCdOnly = ciCdOnly;
     this.initStatusPage();
     this.setAutoUpdate();
   }
@@ -45,6 +48,7 @@ class ImporterStatus {
       repo_id: id,
       target_namespace: targetNamespace,
       new_name: newName,
+      ci_cd_only: this.ciCdOnly,
     })
     .then(({ data }) => {
       const job = $(`tr#repo_${id}`);
@@ -54,7 +58,13 @@ class ImporterStatus {
       $('table.import-jobs tbody').prepend(job);
 
       job.addClass('active');
-      job.find('.import-actions').html('<i class="fa fa-spinner fa-spin" aria-label="importing"></i> started');
+      const connectingVerb = this.ciCdOnly ? __('connecting') : __('importing');
+      job.find('.import-actions').html(sprintf(
+        _.escape(__('%{loadingIcon} Started')), {
+          loadingIcon: `<i class="fa fa-spinner fa-spin" aria-label="${_.escape(connectingVerb)}"></i>`,
+        },
+        false,
+      ));
     })
     .catch(() => flash(__('An error occurred while importing project')));
   }
@@ -71,13 +81,16 @@ class ImporterStatus {
           switch (job.import_status) {
             case 'finished':
               jobItem.removeClass('active').addClass('success');
-              statusField.html('<span><i class="fa fa-check"></i> done</span>');
+              statusField.html(`<span><i class="fa fa-check"></i> ${__('Done')}</span>`);
               break;
             case 'scheduled':
-              statusField.html(`${spinner} scheduled`);
+              statusField.html(`${spinner} ${__('Scheduled')}`);
               break;
             case 'started':
-              statusField.html(`${spinner} started`);
+              statusField.html(`${spinner} ${__('Started')}`);
+              break;
+            case 'failed':
+              statusField.html(__('Failed'));
               break;
             default:
               statusField.html(job.import_status);
@@ -98,7 +111,11 @@ function initImporterStatus() {
 
   if (importerStatus) {
     const data = importerStatus.dataset;
-    return new ImporterStatus(data.jobsImportPath, data.importPath);
+    return new ImporterStatus({
+      jobsUrl: data.jobsImportPath,
+      importUrl: data.importPath,
+      ciCdOnly: convertPermissionToBoolean(data.ciCdOnly),
+    });
   }
 }
 

app/helpers/import_helper.rb

@@ -36,6 +36,42 @@ module ImportHelper
     _('Please wait while we import the repository for you. Refresh at will.')
   end
 
+  def import_github_title
+    _('Import repositories from GitHub')
+  end
+
+  def import_github_authorize_message
+    _('To import GitHub repositories, you first need to authorize GitLab to access the list of your GitHub repositories:')
+  end
+
+  def import_github_personal_access_token_message
+    personal_access_token_link = link_to _('Personal Access Token'), 'https://github.com/settings/tokens'
+
+    if github_import_configured?
+      _('Alternatively, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to import.').html_safe % { personal_access_token_link: personal_access_token_link }
+    else
+      _('To import GitHub repositories, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to import.').html_safe % { personal_access_token_link: personal_access_token_link }
+    end
+  end
+
+  def import_configure_github_admin_message
+    github_integration_link = link_to 'GitHub integration', help_page_path('integration/github')
+
+    if current_user.admin?
+      _('Note: As an administrator you may like to configure %{github_integration_link}, which will allow login via GitHub and allow importing repositories without generating a Personal Access Token.').html_safe % { github_integration_link: github_integration_link }
+    else
+      _('Note: Consider asking your GitLab administrator to configure %{github_integration_link}, which will allow login via GitHub and allow importing repositories without generating a Personal Access Token.').html_safe % { github_integration_link: github_integration_link }
+    end
+  end
+
+  def import_githubish_choose_repository_message
+    _('Choose which repositories you want to import.')
+  end
+
+  def import_all_githubish_repositories_button_label
+    _('Import all repositories')
+  end
+
   private
 
   def github_project_url(full_path)

app/views/import/_githubish_status.html.haml

@@ -2,11 +2,11 @@
 - provider_title = Gitlab::ImportSources.title(provider)
 
 %p.light
-  Select projects you want to import.
+  = import_githubish_choose_repository_message
 %hr
 %p
   = button_tag class: "btn btn-import btn-success js-import-all" do
-    Import all projects
+    = import_all_githubish_repositories_button_label
     = icon("spinner spin", class: "loading-icon")
 
 .table-responsive
@@ -16,9 +16,9 @@
     %colgroup.import-jobs-status-col
     %thead
       %tr
-        %th From #{provider_title}
-        %th To GitLab
-        %th Status
+        %th= _('From %{provider_title}') % { provider_title: provider_title }
+        %th= _('To GitLab')
+        %th= _('Status')
     %tbody
       - @already_added_projects.each do |project|
         %tr{ id: "project_#{project.id}", class: "#{project_status_css_class(project.import_status)}" }
@@ -30,10 +30,12 @@
             - if project.import_status == 'finished'
               %span
                 %i.fa.fa-check
-                done
+                = _('Done')
             - elsif project.import_status == 'started'
               %i.fa.fa-spinner.fa-spin
-              started
+              = _('Started')
+            - elsif project.import_status == 'failed'
+              = _('Failed')
             - else
               = project.human_import_status_name
 
@@ -55,7 +57,9 @@
               = text_field_tag :path, repo.name, class: "input-mini form-control", tabindex: 2, autofocus: true, required: true
           %td.import-actions.job-status
             = button_tag class: "btn btn-import js-add-to-import" do
-              Import
+              = has_ci_cd_only_params? ? _('Connect') : _('Import')
               = icon("spinner spin", class: "loading-icon")
 
-.js-importer-status{ data: { jobs_import_path: "#{url_for([:jobs, :import, provider])}", import_path: "#{url_for([:import, provider])}" } }
+.js-importer-status{ data: { jobs_import_path: "#{url_for([:jobs, :import, provider])}",
+                             import_path: "#{url_for([:import, provider])}",
+                             ci_cd_only: "#{has_ci_cd_only_params?}" } }

app/views/import/github/new.html.haml

-- page_title "GitHub Import"
+- title = has_ci_cd_only_params? ? _('Connect repositories from GitHub') : _('GitHub import')
+- page_title title
+- breadcrumb_title title
 - header_title "Projects", root_path
 
 %h3.page-title
-  = icon 'github', text: 'Import Projects from GitHub'
+  = icon 'github', text: import_github_title
 
 - if github_import_configured?
   %p
-    To import a GitHub project, you first need to authorize GitLab to access
-    the list of your GitHub repositories:
+    = import_github_authorize_message
 
-  = link_to 'List your GitHub repositories', status_import_github_path, class: 'btn btn-success'
+  = link_to _('List your GitHub repositories'), status_import_github_path, class: 'btn btn-success'
 
   %hr
 
 %p
-  - if github_import_configured?
-    Alternatively,
-  - else
-    To import a GitHub project,
-  you can use a
-  = succeed '.' do
-    = link_to 'Personal Access Token', 'https://github.com/settings/tokens'
-  When you create your Personal Access Token,
-  you will need to select the <code>repo</code> scope, so we can display a
-  list of your public and private repositories which are available for import.
+  = import_github_personal_access_token_message
 
 = form_tag personal_access_token_import_github_path, method: :post, class: 'form-inline' do
   .form-group
-    = text_field_tag :personal_access_token, '', class: 'form-control', placeholder: "Personal Access Token", size: 40
-    = submit_tag 'List your GitHub repositories', class: 'btn btn-success'
+    = text_field_tag :personal_access_token, '', class: 'form-control', placeholder: _('Personal Access Token'), size: 40
+    = submit_tag _('List your GitHub repositories'), class: 'btn btn-success'
 
   -# EE-specific start
   = hidden_field_tag :ci_cd_only, params[:ci_cd_only]
@@ -37,11 +29,4 @@
 - unless github_import_configured?
   %hr
   %p
-    Note:
-    - if current_user.admin?
-      As an administrator you may like to configure
-    - else
-      Consider asking your GitLab administrator to configure
-    = link_to 'GitHub integration', help_page_path("integration/github")
-    which will allow login via GitHub and allow importing projects without
-    generating a Personal Access Token.
+    = import_configure_github_admin_message

app/views/import/github/status.html.haml

-- page_title "GitHub Import"
+- title = has_ci_cd_only_params? ? _('Connect repositories from GitHub') : _('GitHub import')
+- page_title title
+- breadcrumb_title title
 - header_title "Projects", root_path
 %h3.page-title
-  = icon 'github', text: 'Import Projects from GitHub'
+  = icon 'github', text: import_github_title
 
 = render 'import/githubish_status', provider: 'github'

app/views/projects/new.html.haml

@@ -77,7 +77,7 @@
                             = icon('gitlab', text: 'GitLab export')
                       %div
                         - if github_import_enabled?
-                          = link_to new_import_github_path, class: 'btn import_github' do
+                          = link_to new_import_github_path, class: 'btn js-import-github' do
                             = icon('github', text: 'GitHub')
                       %div
                         - if bitbucket_import_enabled?

doc/user/project/ci_cd_for_external_repo.md

+## CI/CD for external repositories
+
+>[Introduced][ee-4642] in [GitLab Premium][eep] 10.6.
+
+Instead of importing the repo directly to GitLab, you can connect your
+external repository to get GitLab CI/CD benefits.
+
+This will set up [repository mirroring](../../workflow/repository_mirroring.md)
+and create a stripped-down version of a project that has issues, merge requests,
+container registry, wiki, and snippets disabled but
+[can be re-enabled later on](settings/index.md#sharing-and-permissions).
+
+1. From your GitLab dashboard click **New project**
+1. Switch to the **CI/CD for external repo** tab
+1. Choose **GitHub** or **Repo by URL**
+1. The next steps are similar to the [import flow](import/index.md)
+
+![CI/CD for external repository project creation](img/ci_cd_for_external_repo.png)
+
+
+[ee-4642]: https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/4642
+[eep]: https://about.gitlab.com/products/

doc/user/project/import/index.md

@@ -16,6 +16,8 @@ In addition to the specific migration documentation above, you can import any
 Git repository via HTTP from the New Project page. Be aware that if the
 repository is too large the import can timeout.
 
+There is also the option of [connecting your external repository to get CI/CD benefits](../ci_cd_for_external_repo.md).
+
 ## Migrating from self-hosted GitLab to GitLab.com
 
 You can copy your repos by changing the remote and pushing to the new server,

doc/user/project/import/repo_by_url.md

@@ -10,21 +10,3 @@ You can import your existing repositories by providing the Git URL:
 1. Once complete, you will be redirected to your newly created project
 
 ![Import project by repo URL](img/import_projects_from_repo_url.png)
-
-## CI/CD for external repositories
-
->[Introduced][ee-4642] in [GitLab Premium][eep] 10.6.
-
-Instead of importing the repo directly to GitLab, you can connect your
-external repository to get GitLab CI/CD benefits.
-
-This will set up [repository mirroring](../../../workflow/repository_mirroring.md) and create a stripped-down version of a project
-that has issues, merge requests, container registry, wiki, and snippets disabled
-but [can be re-enabled later on](../settings/index.md#sharing-and-permissions).
-
-1. From your GitLab dashboard click **New project**
-1. Switch to the **CI/CD for external repo** tab
-1. Follow the same import project steps (see above)
-
-[ee-4642]: https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/4642
-[eep]: https://about.gitlab.com/products/

doc/user/project/index.md

@@ -115,6 +115,13 @@ Read through the documentation on [project settings](settings/index.md).
 - [Export a project from GitLab](settings/import_export.md#exporting-a-project-and-its-data)
 - [Importing and exporting projects between GitLab instances](settings/import_export.md)
 
+## CI/CD for external repositories
+
+Instead of importing a repository directly to GitLab, you can connect your repository
+as a CI/CD project.
+
+Read through the documentation on [CI/CD for external repositories](ci_cd_for_external_repo.md).
+
 ## Project's members
 
 Learn how to [add members to your projects](members/index.md).

ee/app/helpers/ee/import_helper.rb

@@ -44,5 +44,71 @@ module EE
         super
       end
     end
+
+    override :import_github_title
+    def import_github_title
+      if has_ci_cd_only_params?
+        _('Connect repositories from GitHub')
+      else
+        super
+      end
+    end
+
+    override :import_github_authorize_message
+    def import_github_authorize_message
+      if has_ci_cd_only_params?
+        _('To connect GitHub repositories, you first need to authorize GitLab to access the list of your GitHub repositories:')
+      else
+        super
+      end
+    end
+
+    override :import_github_personal_access_token_message
+    def import_github_personal_access_token_message
+      if has_ci_cd_only_params?
+        personal_access_token_link = link_to _('Personal Access Token'), 'https://github.com/settings/tokens'
+
+        if github_import_configured?
+          _('Alternatively, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to connect.').html_safe % { personal_access_token_link: personal_access_token_link }
+        else
+          _('To connect GitHub repositories, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to connect.').html_safe % { personal_access_token_link: personal_access_token_link }
+        end
+      else
+        super
+      end
+    end
+
+    override :import_configure_github_admin_message
+    def import_configure_github_admin_message
+      if has_ci_cd_only_params?
+        github_integration_link = link_to 'GitHub integration', help_page_path('integration/github')
+
+        if current_user.admin?
+          _('Note: As an administrator you may like to configure %{github_integration_link}, which will allow login via GitHub and allow connecting repositories without generating a Personal Access Token.').html_safe % { github_integration_link: github_integration_link }
+        else
+          _('Note: Consider asking your GitLab administrator to configure %{github_integration_link}, which will allow login via GitHub and allow connecting repositories without generating a Personal Access Token.').html_safe % { github_integration_link: github_integration_link }
+        end
+      else
+        super
+      end
+    end
+
+    override :import_githubish_choose_repository_message
+    def import_githubish_choose_repository_message
+      if has_ci_cd_only_params?
+        _('Choose which repositories you want to connect and run CI/CD pipelines.')
+      else
+        super
+      end
+    end
+
+    override :import_all_githubish_repositories_button_label
+    def import_all_githubish_repositories_button_label
+      if has_ci_cd_only_params?
+        _('Connect all repositories')
+      else
+        super
+      end
+    end
   end
 end

ee/app/views/projects/_new_ci_cd_only_project_pane.html.haml

@@ -13,6 +13,10 @@
           = f.label :visibility_level, class: 'label-light' do
             = s_('ImportButtons|Connect repositories from')
           .import-buttons
+            %div
+              - if github_import_enabled?
+                = link_to new_import_github_path(ci_cd_only: true), class: 'btn js-import-github' do
+                  = icon('github', text: 'GitHub')
             %div
               - if git_import_enabled?
                 %button.btn.js-toggle-button.js-import-git-toggle-button{ type: "button", data: { toggle_open_class: 'active' } }

ee/changelogs/unreleased/3839-ci-cd-only-github-projects-fe.yml

+---
+title: Add GitHub support to CI/CD for external repositories
+merge_request: 4688
+author:
+type: added

ee/spec/features/projects/new_project_spec.rb

@@ -37,12 +37,23 @@ feature 'New project' do
   end
 
   context 'CI/CD for external repositories', :js do
+    let(:repo) do
+      OpenStruct.new(
+        id: 123,
+        login: 'some-github-repo',
+        owner: OpenStruct.new(login: 'some-github-repo'),
+        name: 'some-github-repo',
+        full_name: 'my-user/some-github-repo',
+        clone_url: 'https://github.com/my-user/some-github-repo.git'
+      )
+    end
+
     context 'when licensed' do
       before do
         stub_licensed_features(ci_cd_projects: true)
       end
 
-      it 'shows CI/CD tab' do
+      it 'shows CI/CD tab and pane' do
         visit new_project_path
 
         expect(page).to have_css('#ci-cd-project-tab')
@@ -70,6 +81,62 @@ feature 'New project' do
           expect(created_project.project_feature).not_to be_issues_enabled
         end
       end
+
+      it 'creates CI/CD project from GitHub' do
+        visit new_project_path
+        find('#ci-cd-project-tab').click
+
+        page.within '#ci-cd-project-pane' do
+          find('.js-import-github').click
+        end
+
+        expect(page).to have_text('Connect repositories from GitHub')
+
+        allow_any_instance_of(Gitlab::LegacyGithubImport::Client).to receive(:repos).and_return([repo])
+
+        fill_in 'personal_access_token', with: 'fake-token'
+        click_button 'List your GitHub repositories'
+        wait_for_requests
+
+        # Mock the POST `/import/github`
+        allow_any_instance_of(Gitlab::LegacyGithubImport::Client).to receive(:repo).and_return(repo)
+        project = create(:project, name: 'some-github-repo', creator: user, import_type: 'github', import_status: 'finished', import_url: repo.clone_url)
+        allow_any_instance_of(CiCd::SetupProject).to receive(:setup_external_service)
+        CiCd::SetupProject.new(project, user).execute
+        allow_any_instance_of(Gitlab::LegacyGithubImport::ProjectCreator)
+          .to receive(:execute).with(hash_including(ci_cd_only: true))
+          .and_return(project)
+
+        click_button 'Connect'
+        wait_for_requests
+
+        expect(page).to have_text('Started')
+        wait_for_requests
+
+        expect(page).to have_text('Done')
+
+        created_project = Project.last
+        expect(created_project.name).to eq('some-github-repo')
+        expect(created_project.mirror).to eq(true)
+        expect(created_project.project_feature).not_to be_issues_enabled
+      end
+
+      it 'stays on GitHub import page after access token failure' do
+        visit new_project_path
+        find('#ci-cd-project-tab').click
+
+        page.within '#ci-cd-project-pane' do
+          find('.js-import-github').click
+        end
+
+        allow_any_instance_of(Gitlab::LegacyGithubImport::Client).to receive(:repos).and_raise(Octokit::Unauthorized)
+
+        fill_in 'personal_access_token', with: 'unauthorized-fake-token'
+        click_button 'List your GitHub repositories'
+
+        expect(page).to have_text('Access denied to your GitHub account.')
+        expect(page).to have_current_path(new_import_github_path(ci_cd_only: true))
+      end
     end
 
     context 'when unlicensed' do

locale/gitlab.pot

@@ -8,8 +8,8 @@ msgid ""
 msgstr ""
 "Project-Id-Version: gitlab 1.0.0\n"
 "Report-Msgid-Bugs-To: \n"
-"POT-Creation-Date: 2018-03-05 14:09-0600\n"
-"PO-Revision-Date: 2018-03-05 14:09-0600\n"
+"POT-Creation-Date: 2018-03-05 14:35-0600\n"
+"PO-Revision-Date: 2018-03-05 14:35-0600\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
 "Language: \n"
@@ -228,6 +228,12 @@ msgstr ""
 msgid "Allows you to add and manage Kubernetes clusters."
 msgstr ""
 
+msgid "Alternatively, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to connect."
+msgstr ""
+
+msgid "Alternatively, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to import."
+msgstr ""
+
 msgid "An error occurred previewing the blob"
 msgstr ""
 
@@ -683,6 +689,12 @@ msgstr ""
 msgid "Choose which groups you wish to synchronize to this secondary node."
 msgstr ""
 
+msgid "Choose which repositories you want to connect and run CI/CD pipelines."
+msgstr ""
+
+msgid "Choose which repositories you want to import."
+msgstr ""
+
 msgid "Choose which shards you wish to synchronize to this secondary node."
 msgstr ""
 
@@ -1173,6 +1185,15 @@ msgstr ""
 msgid "Confidentiality"
 msgstr ""
 
+msgid "Connect"
+msgstr ""
+
+msgid "Connect all repositories"
+msgstr ""
+
+msgid "Connect repositories from GitHub"
+msgstr ""
+
 msgid "Connect your external repositories, and CI/CD pipelines will run for new commits. A GitLab project will be created with only CI/CD features enabled."
 msgstr ""
 
@@ -1439,6 +1460,9 @@ msgstr ""
 msgid "Don't show again"
 msgstr ""
 
+msgid "Done"
+msgstr ""
+
 msgid "Download"
 msgstr ""
 
@@ -1634,6 +1658,9 @@ msgstr ""
 msgid "ExternalAuthorizationService|When no classification label is set the default label `%{default_label}` will be used."
 msgstr ""
 
+msgid "Failed"
+msgstr ""
+
 msgid "Failed Jobs"
 msgstr ""
 
@@ -1699,6 +1726,9 @@ msgstr ""
 msgid "Format"
 msgstr ""
 
+msgid "From %{provider_title}"
+msgstr ""
+
 msgid "From issue creation until deploy to production"
 msgstr ""
 
@@ -1840,6 +1870,9 @@ msgstr ""
 msgid "Git version"
 msgstr ""
 
+msgid "GitHub import"
+msgstr ""
+
 msgid "GitLab Runner section"
 msgstr ""
 
@@ -1983,9 +2016,18 @@ msgstr ""
 msgid "If your HTTP repository is not publicly accessible, add authentication information to the URL: <code>https://username:password@gitlab.company.com/group/project.git</code>."
 msgstr ""
 
+msgid "Import"
+msgstr ""
+
+msgid "Import all repositories"
+msgstr ""
+
 msgid "Import in progress"
 msgstr ""
 
+msgid "Import repositories from GitHub"
+msgstr ""
+
 msgid "Import repository"
 msgstr ""
 
@@ -2173,6 +2215,9 @@ msgstr ""
 msgid "List"
 msgstr ""
 
+msgid "List your GitHub repositories"
+msgstr ""
+
 msgid "Loading the GitLab IDE..."
 msgstr ""
 
@@ -2391,6 +2436,18 @@ msgstr ""
 msgid "Note that the master branch is automatically protected. %{link_to_protected_branches}"
 msgstr ""
 
+msgid "Note: As an administrator you may like to configure %{github_integration_link}, which will allow login via GitHub and allow connecting repositories without generating a Personal Access Token."
+msgstr ""
+
+msgid "Note: As an administrator you may like to configure %{github_integration_link}, which will allow login via GitHub and allow importing repositories without generating a Personal Access Token."
+msgstr ""
+
+msgid "Note: Consider asking your GitLab administrator to configure %{github_integration_link}, which will allow login via GitHub and allow connecting repositories without generating a Personal Access Token."
+msgstr ""
+
+msgid "Note: Consider asking your GitLab administrator to configure %{github_integration_link}, which will allow login via GitHub and allow importing repositories without generating a Personal Access Token."
+msgstr ""
+
 msgid "Notification events"
 msgstr ""
 
@@ -2520,6 +2577,9 @@ msgstr ""
 msgid "Password"
 msgstr ""
 
+msgid "Personal Access Token"
+msgstr ""
+
 msgid "Pipeline"
 msgstr ""
 
@@ -3023,6 +3083,9 @@ msgstr ""
 msgid "Schedule a new pipeline"
 msgstr ""
 
+msgid "Scheduled"
+msgstr ""
+
 msgid "Schedules"
 msgstr ""
 
@@ -3319,6 +3382,12 @@ msgstr ""
 msgid "Start the Runner!"
 msgstr ""
 
+msgid "Started"
+msgstr ""
+
+msgid "Status"
+msgstr ""
+
 msgid "Stopped"
 msgstr ""
 
@@ -3757,9 +3826,24 @@ msgstr ""
 msgid "Title"
 msgstr ""
 
+msgid "To GitLab"
+msgstr ""
+
+msgid "To connect GitHub repositories, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to connect."
+msgstr ""
+
+msgid "To connect GitHub repositories, you first need to authorize GitLab to access the list of your GitHub repositories:"
+msgstr ""
+
 msgid "To connect an SVN repository, check out %{svn_link}."
 msgstr ""
 
+msgid "To import GitHub repositories, you can use a %{personal_access_token_link}. When you create your Personal Access Token, you will need to select the <code>repo</code> scope, so we can display a list of your public and private repositories which are available to import."
+msgstr ""
+
+msgid "To import GitHub repositories, you first need to authorize GitLab to access the list of your GitHub repositories:"
+msgstr ""
+
 msgid "To import an SVN repository, check out %{svn_link}."
 msgstr ""
 
@@ -4216,6 +4300,9 @@ msgstr ""
 msgid "confidentiality|You are going to turn on the confidentiality. This means that only team members with <strong>at least Reporter access</strong> are able to see and leave comments on the issue."
 msgstr ""
 
+msgid "connecting"
+msgstr ""
+
 msgid "day"
 msgid_plural "days"
 msgstr[0] ""
@@ -4227,6 +4314,9 @@ msgstr ""
 msgid "here"
 msgstr ""
 
+msgid "importing"
+msgstr ""
+
 msgid "is invalid because there is downstream lock"
 msgstr ""
 

spec/features/projects/new_project_spec.rb

@@ -173,11 +173,11 @@ feature 'New project' do
 
     context 'from GitHub' do
       before do
-        first('.import_github').click
+        first('.js-import-github').click
       end
 
       it 'shows import instructions' do
-        expect(page).to have_content('Import Projects from GitHub')
+        expect(page).to have_content('Import repositories from GitHub')
         expect(current_path).to eq new_import_github_path
       end
     end

spec/javascripts/importer_status_spec.js

@@ -29,7 +29,10 @@ describe('Importer Status', () => {
       `);
       spyOn(ImporterStatus.prototype, 'initStatusPage').and.callFake(() => {});
       spyOn(ImporterStatus.prototype, 'setAutoUpdate').and.callFake(() => {});
-      instance = new ImporterStatus('', importUrl);
+      instance = new ImporterStatus({
+        jobsUrl: '',
+        importUrl,
+      });
     });
 
     it('sets table row to active after post request', (done) => {
@@ -65,7 +68,9 @@ describe('Importer Status', () => {
 
       spyOn(ImporterStatus.prototype, 'initStatusPage').and.callFake(() => {});
       spyOn(ImporterStatus.prototype, 'setAutoUpdate').and.callFake(() => {});
-      instance = new ImporterStatus(jobsUrl);
+      instance = new ImporterStatus({
+        jobsUrl,
+      });
     });
 
     function setupMock(importStatus) {
@@ -86,17 +91,17 @@ describe('Importer Status', () => {
 
     it('sets the job status to done', (done) => {
       setupMock('finished');
-      expectJobStatus(done, 'done');
+      expectJobStatus(done, 'Done');
     });
 
     it('sets the job status to scheduled', (done) => {
       setupMock('scheduled');
-      expectJobStatus(done, 'scheduled');
+      expectJobStatus(done, 'Scheduled');
     });
 
     it('sets the job status to started', (done) => {
       setupMock('started');
-      expectJobStatus(done, 'started');
+      expectJobStatus(done, 'Started');
     });
 
     it('sets the job status to custom status', (done) => {