CE Improve import status table UI

What does this MR do?

EE: https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/8707

Improve import status table UI, replace with vue app.

• Add "Go to project" button
• Align import buttons to the right
• Remove namespace select grey container
• Removing row status colour and use ci-style status icons to represent status

What are the relevant issue numbers?

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/14010

Does this MR meet the acceptance criteria?

• Changelog entry added, if necessary
• Documentation created/updated
• Tests added for this feature/bug
• Conforms to the code review guidelines
• Conforms to the merge request performance guidelines
• Conforms to the style guides
• Conforms to the database guides

app/assets/javascripts/import-projects/components/provider_repo_table_row.vue

@@ -45,7 +45,7 @@ export default {
     select2Options() {
       return {
         data: this.namespaceSelectOptions,
-        containerCssClass: 'import-namespace-select',
+        containerCssClass: 'import-namespace-select qa-project-namespace-select',
       };
     },
   },
@@ -73,7 +73,7 @@ export default {
 </script>
 
 <template>
-  <tr>
+  <tr class="qa-project-import-row">
     <td>
       <a
         :href="repo.providerLink"
@@ -92,7 +92,7 @@ export default {
       <input 
         v-model="newName" 
         type="text" 
-        class="form-control import-project-name-input"
+        class="form-control import-project-name-input qa-project-path-field"
       />
     </td>
     <td>
@@ -101,6 +101,7 @@ export default {
     </td>
     <td>
       <loading-button
+        class="qa-import-button"
         :loading="isLoadingImport(repo.id)"
         :label="importButtonText"
         type="button"