port

app/assets/javascripts/pages/projects/settings/repository/show/index.js

 import initForm from '../form';
+import PushPull from './push_pull';
 
-document.addEventListener('DOMContentLoaded', initForm);
+document.addEventListener('DOMContentLoaded', () => {
+  initForm();
+
+  const pushPullContainer = document.querySelector('.js-mirror-settings');
+  if (pushPullContainer) new PushPull(pushPullContainer).init();
+});

app/assets/javascripts/pages/projects/settings/repository/show/push_pull.js

+import $ from 'jquery';
+import _ from 'underscore';
+import { __ } from '~/locale';
+import Flash from '~/flash';
+import axios from '~/lib/utils/axios_utils';
+
+export default class PushPull {
+  constructor(container) {
+    this.$container = $(container);
+    this.$form = $('.js-mirror-form', this.$container);
+    this.$urlInput = $('.js-mirror-url', this.$form);
+    this.$protectedBranchesInput = $('.js-mirror-protected', this.$form);
+    this.mirrorEndpoint = this.$form.data('projectMirrorEndpoint');
+    this.$table = $('.js-mirrors-table-body', this.$container);
+  }
+
+  init() {
+    this.registerUpdateListeners();
+
+    this.$table.on('click', '.js-delete-mirror', this.deleteMirror.bind(this));
+  }
+
+  updateUrl() {
+    $('.js-mirror-url-hidden', this.$form).val(this.$urlInput.val());
+  }
+
+  updateProtectedBranches() {
+    const val = this.$protectedBranchesInput.get(0).checked
+      ? this.$protectedBranchesInput.val()
+      : '0';
+    $('.js-mirror-protected-hidden', this.$form).val(val);
+  }
+
+  registerUpdateListeners() {
+    this.$urlInput.on('change', () => this.updateUrl());
+    this.$protectedBranchesInput.on('change', () => this.updateProtectedBranches());
+  }
+
+  deleteMirror(event, existingPayload) {
+    const $target = $(event.currentTarget);
+    let payload = existingPayload;
+
+    debugger;
+
+    if (!payload) {
+      payload = {
+        project: {
+          remote_mirrors_attributes: {
+            id: $target.data('mirrorId'),
+            enabled: 0,
+          },
+        },
+      };
+    }
+
+    return axios
+      .put(this.mirrorEndpoint, payload)
+      .then(() => this.removeRow($target))
+      .catch(() => Flash(__('Failed to remove mirror.')));
+  }
+
+  /* eslint-disable class-methods-use-this */
+  removeRow($target) {
+    const row = $target.closest('tr');
+    $('.js-delete-mirror', row).tooltip('hide');
+    row.remove();
+  }
+  /* eslint-enable class-methods-use-this */
+}

app/assets/stylesheets/pages/settings.scss

@@ -301,3 +301,13 @@
     margin-bottom: 0;
   }
 }
+
+.mirror-error-badge {
+  background-color: $error-bg;
+  border-radius: $border-radius-default;
+  color: $white-light;
+}
+
+.push-pull-table {
+  margin-top: 1em;
+}

app/helpers/mirror_helper.rb

+module MirrorHelper
+  def mirrors_form_data_attributes
+    { project_mirror_endpoint: project_mirror_path(@project) }
+  end
+end
\ No newline at end of file

app/views/projects/mirrors/_instructions.html.haml

 .account-well.prepend-top-default.append-bottom-default
   %ul
     %li
-      The repository must be accessible over <code>http://</code>, <code>https://</code>, <code>ssh://</code> or <code>git://</code>.
-    %li
-      Include the username in the URL if required: <code>https://username@gitlab.company.com/group/project.git</code>.
-    %li
-      The update action will time out after 10 minutes. For big repositories, use a clone/push combination.
-    %li
-      The Git LFS objects will <strong>not</strong> be synced.
+      = _('The repository must be accessible over <code>http://</code>,
+      <code>https://</code>, <code>ssh://</code> and <code>git://</code>.').html_safe
+    %li= _('The update action will time out after 10 minutes. For big repositories, use a clone/push combination.')
+    %li= _('The Git LFS objects will <strong>not</strong> be synced.').html_safe
+    %li
+      = _('This user will be the author of all events in the activity feed that are the result of an update,
+      like new branches being created or new commits being pushed to existing branches.')
+

app/views/projects/mirrors/_push.html.haml

-- expanded = Rails.env.test?
-%section.settings.no-animate#js-push-remote-settings{ class: ('expanded' if expanded) }
-  .settings-header
-    %h4
-      Push to a remote repository
-    %button.btn.js-settings-toggle
-      = expanded ? 'Collapse' : 'Expand'
-    %p
-      Set up the remote repository that you want to update with the content of the current repository
-      every time someone pushes to it.
-      = link_to 'Read more', help_page_path('workflow/repository_mirroring', anchor: 'pushing-to-a-remote-repository'), target: '_blank'
-  .settings-content
-    = form_for @project, url: project_mirror_path(@project) do |f|
-      %div
-        = form_errors(@project)
-      = render "shared/remote_mirror_update_button", remote_mirror: @remote_mirror
-      - if @remote_mirror.last_error.present?
-        .panel.panel-danger
-          .panel-heading
-            - if @remote_mirror.last_update_at
-              The remote repository failed to update #{time_ago_with_tooltip(@remote_mirror.last_update_at)}.
-            - else
-              The remote repository failed to update.
-
-            - if @remote_mirror.last_successful_update_at
-              Last successful update #{time_ago_with_tooltip(@remote_mirror.last_successful_update_at)}.
-          .panel-body
-            %pre
-              :preserve
-                #{h(@remote_mirror.last_error.strip)}
-      = f.fields_for :remote_mirrors, @remote_mirror do |rm_form|
-        .form-group
-          = rm_form.check_box :enabled, class: "float-left"
-          .prepend-left-20
-            = rm_form.label :enabled, "Remote mirror repository", class: "label-bold append-bottom-0"
-            %p.light.append-bottom-0
-              Automatically update the remote mirror's branches, tags, and commits from this repository every time someone pushes to it.
-        .form-group.has-feedback
-          = rm_form.label :url, "Git repository URL", class: "label-bold"
-          = rm_form.text_field :url, class: "form-control", placeholder: 'https://username:password@gitlab.company.com/group/project.git'
-
-          = render "projects/mirrors/instructions"
-
-        .form-group
-          = rm_form.check_box :only_protected_branches, class: 'float-left'
-          .prepend-left-20
-            = rm_form.label :only_protected_branches, class: 'label-bold'
-            = link_to icon('question-circle'), help_page_path('user/project/protected_branches')
-
-        = f.submit 'Save changes', class: 'btn btn-create', name: 'update_remote_mirror'

app/views/projects/mirrors/_push_pull.html.haml

+- expanded = Rails.env.test?
+- protocols = Gitlab::UrlSanitizer::ALLOWED_SCHEMES.join('|')
+- can_push = can?(current_user, :admin_remote_mirror, @project)
+- can_pull = can?(current_user, :admin_mirror, @project)
+- options = []
+- options.unshift([_('Pull'), 'pull']) if can_pull
+- options.unshift([_('Push'), 'push']) if can_push
+
+%section.settings.project-mirror-settings.js-mirror-settings.no-animate{ class: ('expanded' if expanded) }
+  .settings-header
+    %h4= _('Mirroring repositories')
+    %button.btn.js-settings-toggle
+      = expanded ? _('Collapse') : _('Expand')
+    %p
+      = _('Set up your project to automatically push and/or pull changes to/from another repository. Branches, tags, and commits will be synced automatically.')
+      = link_to _('Read more'), help_page_path('workflow/repository_mirroring'), target: '_blank'
+
+  .settings-content
+    = form_for @project, url: project_mirror_path(@project), html: { class: 'gl-show-field-errors js-mirror-form', autocomplete: 'false', data: mirrors_form_data_attributes } do |f|
+      .panel.panel-default
+        .panel-heading
+          %h3.panel-title= _('Mirror a repository')
+        .panel-body
+          %div= form_errors(@project)
+
+          .form-group.has-feedback
+            = label_tag :url, _('Git repository URL'), class: 'label-light'
+            = text_field_tag :url, nil, class: 'form-control js-mirror-url js-repo-url', placeholder: _('Input your repository URL'), required: true, pattern: "(#{protocols}):\/\/.+"
+
+          = render 'projects/mirrors/instructions'
+
+          = render_if_exists 'projects/mirrors/direction_dropdown', options: options
+
+          = render 'projects/mirrors/push_pull_form', can_push: can_push, can_pull: can_pull, f: f
+
+          .form-check.append-bottom-10
+            = check_box_tag :only_protected_branches, '1', false, class: 'js-mirror-protected form-check-input'
+            = label_tag :only_protected_branches, _('Only mirror protected branches'), class: 'form-check-label'
+            = link_to icon('question-circle'), help_page_path('user/project/protected_branches')
+
+        .panel-footer
+          = f.submit _('Mirror repository'), class: 'btn btn-create', name: :update_remote_mirror
+
+    .panel.panel-default
+      .table-responsive
+        %table.table.push-pull-table
+          %thead
+            %tr
+              %th
+                = _('Mirrored repositories')
+                = render_if_exists 'projects/mirrors/mirrored_repositories_count'
+              %th= _('Direction')
+              %th= _('Last update')
+              %th
+              %th
+          %tbody.js-mirrors-table-body
+            = render_if_exists 'projects/mirrors/table_pull_row'
+            - @project.remote_mirrors.each_with_index do |mirror, index|
+              - if mirror.enabled
+                %tr
+                  %td= mirror.safe_url
+                  %td= _('Push')
+                  %td= mirror.last_update_at.present? ? time_ago_with_tooltip(mirror.last_update_at) : _('Never')
+                  %td
+                    - if mirror.last_error.present?
+                      .badge.mirror-error-badge{ data: { toggle: 'tooltip', html: 'true' }, title: html_escape(mirror.last_error.try(:strip)) }= _('Error')
+                  %td
+                    .btn-group.mirror-actions-group{ role: 'group' }
+                      = render 'shared/remote_mirror_update_button', remote_mirror: mirror
+                      %button.js-delete-mirror.btn.btn-danger{ type: 'button', data: { mirror_id: mirror.id, toggle: 'tooltip', container: 'body' }, title: _('Remove') }= icon('trash-o')

app/views/projects/mirrors/_push_pull_form.html.haml

+- protocols = Gitlab::UrlSanitizer::ALLOWED_SCHEMES.join('|')
+
+= f.fields_for :remote_mirrors, @remote_mirror do |rm_f|
+  = rm_f.hidden_field :enabled, value: '1'
+  = rm_f.hidden_field :url, class: 'js-mirror-url-hidden', required: true, pattern: "(#{protocols}):\/\/.+"
+  = rm_f.hidden_field :only_protected_branches, class: 'js-mirror-protected-hidden'
\ No newline at end of file

app/views/projects/mirrors/_show.html.haml

-- if can?(current_user, :admin_remote_mirror, @project)
-  = render 'projects/mirrors/push'
-
+= render 'projects/mirrors/push_pull'
\ No newline at end of file

app/views/shared/_remote_mirror_update_button.html.haml

-- if @project.has_remote_mirror?
-  .append-bottom-default
-    - if remote_mirror.update_in_progress?
-      %span.btn.disabled
+- if remote_mirror.update_in_progress?
+  %button.btn.disabled{ type: 'button', data: { toggle: 'tooltip', container: 'body' }, title: _('Updating') }
     = icon("refresh spin")
-        Updating…
-    - else
-      = link_to update_now_project_mirror_path(@project, sync_remote: true), method: :post, class: "btn" do
+- else
+  = link_to update_now_project_mirror_path(@project, sync_remote: true), method: :post, class: "btn", data: { toggle: 'tooltip', container: 'body' }, title: _('Update now') do
     = icon("refresh")
-        Update Now
-    - if @remote_mirror.last_successful_update_at
-      %p.inline.prepend-left-10
-        Successfully updated #{time_ago_with_tooltip(@remote_mirror.last_successful_update_at)}.

db/schema.rb

@@ -11,7 +11,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 20180704204006) do
+ActiveRecord::Schema.define(version: 20180718005113) do
 
   # These are extensions that must be enabled in order to support this database
   enable_extension "plpgsql"
@@ -168,6 +168,7 @@ ActiveRecord::Schema.define(version: 20180704204006) do
     t.boolean "enforce_terms", default: false
     t.boolean "mirror_available", default: true, null: false
     t.boolean "hide_third_party_offers", default: false, null: false
+    t.boolean "instance_statistics_visibility_private", default: false, null: false
   end
 
   create_table "audit_events", force: :cascade do |t|
@@ -326,10 +327,10 @@ ActiveRecord::Schema.define(version: 20180704204006) do
     t.integer "auto_canceled_by_id"
     t.boolean "retried"
     t.integer "stage_id"
-    t.integer "artifacts_file_store"
-    t.integer "artifacts_metadata_store"
     t.boolean "protected"
     t.integer "failure_reason"
+    t.integer "artifacts_file_store"
+    t.integer "artifacts_metadata_store"
   end
 
   add_index "ci_builds", ["artifacts_expire_at"], name: "index_ci_builds_on_artifacts_expire_at", where: "(artifacts_file <> ''::text)", using: :btree
@@ -386,13 +387,13 @@ ActiveRecord::Schema.define(version: 20180704204006) do
     t.integer "project_id", null: false
     t.integer "job_id", null: false
     t.integer "file_type", null: false
-    t.integer "file_store"
     t.integer "size", limit: 8
     t.datetime_with_timezone "created_at", null: false
     t.datetime_with_timezone "updated_at", null: false
     t.datetime_with_timezone "expire_at"
     t.string "file"
     t.binary "file_sha256"
+    t.integer "file_store"
   end
 
   add_index "ci_job_artifacts", ["expire_at", "job_id"], name: "index_ci_job_artifacts_on_expire_at_and_job_id", using: :btree