Improve github import page UI

3 files changed, 25 insertions, 20 deletions

diff --git a/app/controllers/github_imports_controller.rb b/app/controllers/github_imports_controller.rb
index 97a2637b1eb..c96bef598be 100644
--- a/app/controllers/github_imports_controller.rb
+++ b/app/controllers/github_imports_controller.rb
@@ -2,7 +2,7 @@ class GithubImportsController < ApplicationController
   before_filter :github_auth, except: :callback
 
   rescue_from Octokit::Unauthorized, with: :github_unauthorized
-  
+
   def callback
     token = client.auth_code.get_token(params[:code]).token
     current_user.github_access_token = token
diff --git a/app/views/github_imports/create.js.haml b/app/views/github_imports/create.js.haml
index e354c2da4dd..363dfeb4f54 100644
--- a/app/views/github_imports/create.js.haml
+++ b/app/views/github_imports/create.js.haml
@@ -13,6 +13,4 @@
 - else
   :plain
     $("table.import-jobs tbody").prepend($("tr#repo_#{@repo_id}"))
-    $("tr#repo_#{@repo_id}").addClass("active").find(".import-actions").text("started")
-
-  
\ No newline at end of file
+    $("tr#repo_#{@repo_id}").addClass("active").find(".import-actions").html("<i class='fa fa-spinner fa-spin'></i> started")
diff --git a/app/views/github_imports/status.html.haml b/app/views/github_imports/status.html.haml
index 6a196cae39d..47c60e4d45f 100644
--- a/app/views/github_imports/status.html.haml
+++ b/app/views/github_imports/status.html.haml
@@ -1,31 +1,41 @@
 %h3.page-title
-  Import repositories from github
+  %i.fa.fa-github
+  Import repositories from GitHub.com
 
-%hr
-%h4
+%p.light
   Select projects you want to import.
-  
-%table.table.table-bordered.import-jobs
+  %span.pull-right
+    Reload to see the progress.
+
+%hr
+%table.table.import-jobs
   %thead
     %tr
       %th From GitHub
       %th To GitLab
       %th Status
   %tbody
-    - @already_added_projects.each do |repo|
-      %tr{id: "repo_#{repo.id}", class: "#{project_status_css_class(repo.import_status)}"}
-        %td= repo.import_source
-        %td= repo.name_with_namespace
-        %td= repo.human_import_status_name
-    
+    - @already_added_projects.each do |project|
+      %tr{id: "repo_#{project.id}", class: "#{project_status_css_class(project.import_status)}"}
+        %td= project.import_source
+        %td
+          %strong= link_to project.name_with_namespace, project
+        %td
+          - if project.import_status == 'finished'
+            %span.cgreen
+              %i.fa.fa-check
+              done
+          - else
+            = project.human_import_status_name
+
     - @repos.each do |repo|
       %tr{id: "repo_#{repo.id}"}
         %td= repo.full_name
-        %td.import-target 
+        %td.import-target
           = repo.full_name
         %td.import-actions
           = button_tag "Add", class: "btn btn-add-to-import"
-        
+
 
 :coffeescript
   $(".btn-add-to-import").click () ->
@@ -36,6 +46,3 @@
       new_namespace = tr.find(".import-target input").prop("value")
       tr.find(".import-target").empty().append(new_namespace + "/" + tr.find(".import-target").data("project_name"))
     $.post "#{github_import_url}", {repo_id: id, new_namespace: new_namespace}, dataType: 'script'
-
-
-