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/ci_variable_list/ci_variable_list.js

@@ -36,7 +36,9 @@ export default class VariableList {
       },
       protected: {
         selector: '.js-ci-variable-input-protected',
-        default: 'false',
+        // use `attr` instead of `data` as we don't want the value to be
+        // converted. we need the value as a string.
+        default: $('.js-ci-variable-input-protected').attr('data-default'),
       },
       environment_scope: {
         // We can't use a `.js-` class here because