From b0c2772a900bd4390d0ead7192e1bda3acd01bab Mon Sep 17 00:00:00 2001
From: Mike Greiling <mike@pixelcog.com>
Date: Thu, 12 Oct 2017 11:31:29 -0500
Subject: convert Autosave into pure es module and remove global export

---
 app/assets/javascripts/autosave.js                 | 31 +++++++++-------------
 app/assets/javascripts/issuable_form.js            |  2 +-
 app/assets/javascripts/notes.js                    |  4 +--
 .../notes/components/issue_comment_form.vue        |  3 +--
 app/assets/javascripts/notes/mixins/autosave.js    |  3 +--
 5 files changed, 18 insertions(+), 25 deletions(-)

diff --git a/app/assets/javascripts/autosave.js b/app/assets/javascripts/autosave.js
index 4d2d4db7c0e..73bdab4ecb7 100644
--- a/app/assets/javascripts/autosave.js
+++ b/app/assets/javascripts/autosave.js
@@ -1,8 +1,9 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-param-reassign, quotes, prefer-template, no-var, one-var, no-unused-vars, one-var-declaration-per-line, no-void, consistent-return, no-empty, max-len */
+/* eslint-disable no-param-reassign, prefer-template, no-var, no-void, consistent-return */
+
 import AccessorUtilities from './lib/utils/accessor';
 
-window.Autosave = (function() {
-  function Autosave(field, key, resource) {
+export default class Autosave {
+  constructor(field, key, resource) {
     this.field = field;
     this.isLocalStorageAvailable = AccessorUtilities.isLocalStorageAccessSafe();
     this.resource = resource;
@@ -12,14 +13,10 @@ window.Autosave = (function() {
     this.key = 'autosave/' + key;
     this.field.data('autosave', this);
     this.restore();
-    this.field.on('input', (function(_this) {
-      return function() {
-        return _this.save();
-      };
-    })(this));
+    this.field.on('input', () => this.save());
   }
 
-  Autosave.prototype.restore = function() {
+  restore() {
     var text;
 
     if (!this.isLocalStorageAvailable) return;
@@ -40,9 +37,9 @@ window.Autosave = (function() {
         field.dispatchEvent(event);
       }
     }
-  };
+  }
 
-  Autosave.prototype.save = function() {
+  save() {
     var text;
     text = this.field.val();
 
@@ -51,15 +48,13 @@ window.Autosave = (function() {
     }
 
     return this.reset();
-  };
+  }
 
-  Autosave.prototype.reset = function() {
+  reset() {
     if (!this.isLocalStorageAvailable) return;
 
     return window.localStorage.removeItem(this.key);
-  };
-
-  return Autosave;
-})();
+  }
+}
 
-export default window.Autosave;
+window.Autosave = Autosave;
diff --git a/app/assets/javascripts/issuable_form.js b/app/assets/javascripts/issuable_form.js
index 470c39c6f76..10f853066ca 100644
--- a/app/assets/javascripts/issuable_form.js
+++ b/app/assets/javascripts/issuable_form.js
@@ -1,9 +1,9 @@
 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, no-use-before-define, no-useless-escape, no-new, quotes, object-shorthand, no-unused-vars, comma-dangle, no-alert, consistent-return, no-else-return, prefer-template, one-var, one-var-declaration-per-line, curly, max-len */
 /* global GitLab */
-/* global Autosave */
 /* global dateFormat */
 
 import Pikaday from 'pikaday';
+import Autosave from './autosave';
 import UsersSelect from './users_select';
 import GfmAutoComplete from './gfm_auto_complete';
 import ZenMode from './zen_mode';
diff --git a/app/assets/javascripts/notes.js b/app/assets/javascripts/notes.js
index 790f78d2e11..a09f938a281 100644
--- a/app/assets/javascripts/notes.js
+++ b/app/assets/javascripts/notes.js
@@ -5,7 +5,7 @@ default-case, prefer-template, consistent-return, no-alert, no-return-assign,
 no-param-reassign, prefer-arrow-callback, no-else-return, comma-dangle, no-new,
 brace-style, no-lonely-if, vars-on-top, no-unused-vars, no-sequences, no-shadow,
 newline-per-chained-call, no-useless-escape, class-methods-use-this */
-/* global Autosave */
+
 /* global ResolveService */
 /* global mrRefreshWidgetUrl */
 
@@ -21,7 +21,7 @@ import Flash from './flash';
 import CommentTypeToggle from './comment_type_toggle';
 import GLForm from './gl_form';
 import loadAwardsHandler from './awards_handler';
-import './autosave';
+import Autosave from './autosave';
 import './dropzone_input';
 import TaskList from './task_list';
 import { ajaxPost, isInViewport, getPagePath, scrollToElement, isMetaKey } from './lib/utils/common_utils';
diff --git a/app/assets/javascripts/notes/components/issue_comment_form.vue b/app/assets/javascripts/notes/components/issue_comment_form.vue
index 2ce52e4538a..ad384a1cc36 100644
--- a/app/assets/javascripts/notes/components/issue_comment_form.vue
+++ b/app/assets/javascripts/notes/components/issue_comment_form.vue
@@ -1,10 +1,9 @@
 <script>
-  /* global Autosave */
   import { mapActions, mapGetters } from 'vuex';
   import _ from 'underscore';
   import autosize from 'vendor/autosize';
   import Flash from '../../flash';
-  import '../../autosave';
+  import Autosave from '../../autosave';
   import TaskList from '../../task_list';
   import * as constants from '../constants';
   import eventHub from '../event_hub';
diff --git a/app/assets/javascripts/notes/mixins/autosave.js b/app/assets/javascripts/notes/mixins/autosave.js
index 5843b97f225..a008171beda 100644
--- a/app/assets/javascripts/notes/mixins/autosave.js
+++ b/app/assets/javascripts/notes/mixins/autosave.js
@@ -1,5 +1,4 @@
-/* globals Autosave */
-import '../../autosave';
+import Autosave from '../../autosave';
 
 export default {
   methods: {
-- 
cgit v1.2.1


From 411d02631721689b73ee4833a0945f5ea71901e2 Mon Sep 17 00:00:00 2001
From: Mike Greiling <mike@pixelcog.com>
Date: Thu, 12 Oct 2017 11:32:07 -0500
Subject: remove global export

---
 app/assets/javascripts/autosave.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/app/assets/javascripts/autosave.js b/app/assets/javascripts/autosave.js
index 73bdab4ecb7..0f28bd233ac 100644
--- a/app/assets/javascripts/autosave.js
+++ b/app/assets/javascripts/autosave.js
@@ -56,5 +56,3 @@ export default class Autosave {
     return window.localStorage.removeItem(this.key);
   }
 }
-
-window.Autosave = Autosave;
-- 
cgit v1.2.1


From 9cd528aa7ac5066570cb50b909951a6c6b723935 Mon Sep 17 00:00:00 2001
From: Mike Greiling <mike@pixelcog.com>
Date: Thu, 12 Oct 2017 11:33:42 -0500
Subject: remove import from main.js

---
 app/assets/javascripts/main.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 8d7608ce0f4..1b22e58c654 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -50,7 +50,6 @@ import './behaviors/';
 import './activities';
 import './admin';
 import './aside';
-import './autosave';
 import loadAwardsHandler from './awards_handler';
 import bp from './breakpoints';
 import './broadcast_message';
-- 
cgit v1.2.1


From c207122fd2b4439ff8303a1860c35de658d6bdfb Mon Sep 17 00:00:00 2001
From: Matt Coleman <matt@datto.com>
Date: Thu, 21 Sep 2017 16:05:44 -0400
Subject: Add Packagist project service

---
 app/models/project.rb                              |  1 +
 app/models/project_services/packagist_service.rb   | 65 ++++++++++++++++++++++
 app/models/service.rb                              |  1 +
 .../unreleased/add-packagist-project-service.yml   |  5 ++
 doc/api/services.md                                | 34 +++++++++++
 doc/user/project/integrations/project_services.md  |  1 +
 lib/api/services.rb                                | 21 +++++++
 lib/api/v3/services.rb                             | 20 +++++++
 .../services/user_activates_packagist_spec.rb      | 24 ++++++++
 .../projects/services/user_views_services_spec.rb  |  1 +
 spec/lib/gitlab/import_export/all_models.yml       |  1 +
 .../project_services/packagist_service_spec.rb     | 46 +++++++++++++++
 spec/models/project_spec.rb                        |  1 +
 13 files changed, 221 insertions(+)
 create mode 100644 app/models/project_services/packagist_service.rb
 create mode 100644 changelogs/unreleased/add-packagist-project-service.yml
 create mode 100644 spec/features/projects/services/user_activates_packagist_spec.rb
 create mode 100644 spec/models/project_services/packagist_service_spec.rb

diff --git a/app/models/project.rb b/app/models/project.rb
index 57e91ab3b88..fdc225f4525 100644
--- a/app/models/project.rb
+++ b/app/models/project.rb
@@ -117,6 +117,7 @@ class Project < ActiveRecord::Base
   has_one :mock_deployment_service
   has_one :mock_monitoring_service
   has_one :microsoft_teams_service
+  has_one :packagist_service
 
   # TODO: replace these relations with the fork network versions
   has_one  :forked_project_link,  foreign_key: "forked_to_project_id"
diff --git a/app/models/project_services/packagist_service.rb b/app/models/project_services/packagist_service.rb
new file mode 100644
index 00000000000..f68a0c1a3c3
--- /dev/null
+++ b/app/models/project_services/packagist_service.rb
@@ -0,0 +1,65 @@
+class PackagistService < Service
+  include HTTParty
+
+  prop_accessor :username, :token, :server
+
+  validates :username, presence: true, if: :activated?
+  validates :token, presence: true, if: :activated?
+
+  default_value_for :push_events, true
+  default_value_for :tag_push_events, true
+
+  after_save :compose_service_hook, if: :activated?
+
+  def title
+    'Packagist'
+  end
+
+  def description
+    'Update your project on Packagist, the main Composer repository'
+  end
+
+  def self.to_param
+    'packagist'
+  end
+
+  def fields
+    [
+      { type: 'text', name: 'username', placeholder: '', required: true },
+      { type: 'text', name: 'token', placeholder: '', required: true },
+      { type: 'text', name: 'server', placeholder: 'https://packagist.org', required: false }
+    ]
+  end
+
+  def self.supported_events
+    %w(push merge_request tag_push)
+  end
+
+  def execute(data)
+    return unless supported_events.include?(data[:object_kind])
+
+    service_hook.execute(data)
+  end
+
+  def test(data)
+    begin
+      result = execute(data)
+      return { success: false, result: result[:message] } if result[:http_status] != 202
+    rescue StandardError => error
+      return { success: false, result: error }
+    end
+
+    { success: true, result: result[:message] }
+  end
+
+  def compose_service_hook
+    hook = service_hook || build_service_hook
+    hook.url = hook_url
+    hook.save
+  end
+
+  def hook_url
+    base_url = server.present? ? server : 'https://packagist.org'
+    "#{base_url}/api/update-package?username=#{username}&apiToken=#{token}"
+  end
+end
diff --git a/app/models/service.rb b/app/models/service.rb
index 6b64079215f..fdd2605e3e3 100644
--- a/app/models/service.rb
+++ b/app/models/service.rb
@@ -238,6 +238,7 @@ class Service < ActiveRecord::Base
       kubernetes
       mattermost_slash_commands
       mattermost
+      packagist
       pipelines_email
       pivotaltracker
       prometheus
diff --git a/changelogs/unreleased/add-packagist-project-service.yml b/changelogs/unreleased/add-packagist-project-service.yml
new file mode 100644
index 00000000000..a13d00e91f7
--- /dev/null
+++ b/changelogs/unreleased/add-packagist-project-service.yml
@@ -0,0 +1,5 @@
+---
+title: Add Packagist project service
+merge_request: 14493
+author: Matt Coleman
+type: added
diff --git a/doc/api/services.md b/doc/api/services.md
index 49b87a4228c..dd923843645 100644
--- a/doc/api/services.md
+++ b/doc/api/services.md
@@ -582,6 +582,40 @@ Delete Mattermost slash command service for a project.
 DELETE /projects/:id/services/mattermost-slash-commands
 ```
 
+## Packagist
+
+Update your project on Packagist, the main Composer repository, when commits or tags are pushed to GitLab.
+
+### Create/Edit Packagist service
+
+Set Packagist service for a project.
+
+```
+PUT /projects/:id/services/packagist
+```
+
+Parameters:
+
+- `username` (**required**)
+- `token` (**required**)
+- `server` (optional)
+
+### Delete Packagist service
+
+Delete Packagist service for a project.
+
+```
+DELETE /projects/:id/services/packagist
+```
+
+### Get Packagist service settings
+
+Get Packagist service settings for a project.
+
+```
+GET /projects/:id/services/packagist
+```
+
 ## Pipeline-Emails
 
 Get emails for GitLab CI pipelines.
diff --git a/doc/user/project/integrations/project_services.md b/doc/user/project/integrations/project_services.md
index 51989ccaaea..a0405161495 100644
--- a/doc/user/project/integrations/project_services.md
+++ b/doc/user/project/integrations/project_services.md
@@ -43,6 +43,7 @@ Click on the service links to see further configuration instructions and details
 | [Mattermost slash commands](mattermost_slash_commands.md) | Mattermost chat and ChatOps slash commands |
 | [Mattermost Notifications](mattermost.md) | Receive event notifications in Mattermost |
 | [Microsoft teams](microsoft_teams.md) |  Receive notifications for actions that happen on GitLab into a room on Microsoft Teams using Office 365 Connectors |
+| Packagist | Update your project on Packagist, the main Composer repository |
 | Pipelines emails | Email the pipeline status to a list of recipients |
 | [Slack Notifications](slack.md) | Send GitLab events (e.g. issue created) to Slack as notifications |
 | [Slack slash commands](slack_slash_commands.md) | Use slash commands in Slack to control GitLab |
diff --git a/lib/api/services.rb b/lib/api/services.rb
index 2cbd0517dc3..7eaf6a2158a 100644
--- a/lib/api/services.rb
+++ b/lib/api/services.rb
@@ -374,6 +374,26 @@ module API
           desc: 'The Slack token'
         }
       ],
+      'packagist' => [
+        {
+          required: true,
+          name: :username,
+          type: String,
+          desc: 'The username'
+        },
+        {
+          required: true,
+          name: :token,
+          type: String,
+          desc: 'The Packagist API token'
+        },
+        {
+          required: false,
+          name: :server,
+          type: String,
+          desc: 'The server'
+        }
+      ],
       'pipelines-email' => [
         {
           required: true,
@@ -551,6 +571,7 @@ module API
       KubernetesService,
       MattermostSlashCommandsService,
       SlackSlashCommandsService,
+      PackagistService,
       PipelinesEmailService,
       PivotaltrackerService,
       PrometheusService,
diff --git a/lib/api/v3/services.rb b/lib/api/v3/services.rb
index 2d13d6fabfd..44ed94d2869 100644
--- a/lib/api/v3/services.rb
+++ b/lib/api/v3/services.rb
@@ -395,6 +395,26 @@ module API
             desc: 'The Slack token'
           }
         ],
+        'packagist' => [
+          {
+            required: true,
+            name: :username,
+            type: String,
+            desc: 'The username'
+          },
+          {
+            required: true,
+            name: :token,
+            type: String,
+            desc: 'The Packagist API token'
+          },
+          {
+            required: false,
+            name: :server,
+            type: String,
+            desc: 'The server'
+          }
+        ],
         'pipelines-email' => [
           {
             required: true,
diff --git a/spec/features/projects/services/user_activates_packagist_spec.rb b/spec/features/projects/services/user_activates_packagist_spec.rb
new file mode 100644
index 00000000000..b0cc818f093
--- /dev/null
+++ b/spec/features/projects/services/user_activates_packagist_spec.rb
@@ -0,0 +1,24 @@
+require 'spec_helper'
+
+describe 'User activates Packagist' do
+  let(:project) { create(:project) }
+  let(:user) { create(:user) }
+
+  before do
+    project.add_master(user)
+    sign_in(user)
+
+    visit(project_settings_integrations_path(project))
+
+    click_link('Packagist')
+  end
+
+  it 'activates service' do
+    check('Active')
+    fill_in('Username', with: 'theUser')
+    fill_in('Token', with: 'verySecret')
+    click_button('Save')
+
+    expect(page).to have_content('Packagist activated.')
+  end
+end
diff --git a/spec/features/projects/services/user_views_services_spec.rb b/spec/features/projects/services/user_views_services_spec.rb
index f86591c2633..5c5e8b66642 100644
--- a/spec/features/projects/services/user_views_services_spec.rb
+++ b/spec/features/projects/services/user_views_services_spec.rb
@@ -21,5 +21,6 @@ describe 'User views services' do
     expect(page).to have_content('JetBrains TeamCity')
     expect(page).to have_content('Asana')
     expect(page).to have_content('Irker (IRC gateway)')
+    expect(page).to have_content('Packagist')
   end
 end
diff --git a/spec/lib/gitlab/import_export/all_models.yml b/spec/lib/gitlab/import_export/all_models.yml
index 29baa70d5ae..3824bb0757c 100644
--- a/spec/lib/gitlab/import_export/all_models.yml
+++ b/spec/lib/gitlab/import_export/all_models.yml
@@ -195,6 +195,7 @@ project:
 - mattermost_slash_commands_service
 - slack_slash_commands_service
 - irker_service
+- packagist_service
 - pivotaltracker_service
 - prometheus_service
 - hipchat_service
diff --git a/spec/models/project_services/packagist_service_spec.rb b/spec/models/project_services/packagist_service_spec.rb
new file mode 100644
index 00000000000..6acee311700
--- /dev/null
+++ b/spec/models/project_services/packagist_service_spec.rb
@@ -0,0 +1,46 @@
+require 'spec_helper'
+
+describe PackagistService do
+  describe "Associations" do
+    it { is_expected.to belong_to :project }
+    it { is_expected.to have_one :service_hook }
+  end
+
+  let(:project) { create(:project) }
+
+  let(:packagist_server) { 'https://packagist.example.com' }
+  let(:packagist_username) { 'theUser' }
+  let(:packagist_token) { 'verySecret' }
+  let(:packagist_hook_url) do
+    "#{packagist_server}/api/update-package?username=#{packagist_username}&apiToken=#{packagist_token}"
+  end
+
+  let(:packagist_params) do
+    {
+        active: true,
+        project: project,
+        properties: {
+            username: packagist_username,
+            token: packagist_token,
+            server: packagist_server
+        }
+    }
+  end
+
+  describe '#execute' do
+    let(:user)    { create(:user) }
+    let(:project) { create(:project, :repository) }
+    let(:push_sample_data) { Gitlab::DataBuilder::Push.build_sample(project, user) }
+    let(:packagist_service) { described_class.create(packagist_params) }
+
+    before do
+      stub_request(:post, packagist_hook_url)
+    end
+
+    it 'calls Packagist API' do
+      packagist_service.execute(push_sample_data)
+
+      expect(a_request(:post, packagist_hook_url)).to have_been_made.once
+    end
+  end
+end
diff --git a/spec/models/project_spec.rb b/spec/models/project_spec.rb
index cf26dbfea49..fe572ec922e 100644
--- a/spec/models/project_spec.rb
+++ b/spec/models/project_spec.rb
@@ -24,6 +24,7 @@ describe Project do
     it { is_expected.to have_one(:slack_service) }
     it { is_expected.to have_one(:microsoft_teams_service) }
     it { is_expected.to have_one(:mattermost_service) }
+    it { is_expected.to have_one(:packagist_service) }
     it { is_expected.to have_one(:pushover_service) }
     it { is_expected.to have_one(:asana_service) }
     it { is_expected.to have_many(:boards) }
-- 
cgit v1.2.1


From c44dff9984d4ee055a40b9c3354888193b3d5f57 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Fri, 20 Oct 2017 13:28:30 +0100
Subject: Remove page-specific GLForm init and add support_autocomplete: false
 local to groups/milestones/_form

---
 app/assets/javascripts/dispatcher.js        | 1 -
 app/views/groups/milestones/_form.html.haml | 2 +-
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index 2885923aeda..eb576672d25 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -234,7 +234,6 @@ import DueDateSelectors from './due_date_select';
         case 'groups:milestones:update':
           new ZenMode();
           new DueDateSelectors();
-          new GLForm($('.milestone-form'), true);
           break;
         case 'projects:compare:show':
           new gl.Diff();
diff --git a/app/views/groups/milestones/_form.html.haml b/app/views/groups/milestones/_form.html.haml
index cc879e5a308..a1be0d3220a 100644
--- a/app/views/groups/milestones/_form.html.haml
+++ b/app/views/groups/milestones/_form.html.haml
@@ -11,7 +11,7 @@
         = f.label :description, "Description", class: "control-label"
         .col-sm-10
           = render layout: 'projects/md_preview', locals: { url: group_preview_markdown_path } do
-            = render 'projects/zen', f: f, attr: :description, classes: 'note-textarea', placeholder: 'Write milestone description...'
+            = render 'projects/zen', f: f, attr: :description, classes: 'note-textarea', placeholder: 'Write milestone description...', supports_autocomplete: false
             .clearfix
             .error-alert
 
-- 
cgit v1.2.1


From c8d29d17aef6ac4fd0620dc0d69df5ef454fd102 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Fri, 20 Oct 2017 17:11:31 +0100
Subject: Added group milestones form spec

---
 spec/features/groups/milestone_spec.rb | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/spec/features/groups/milestone_spec.rb b/spec/features/groups/milestone_spec.rb
index 12aa54a3da1..1b41b3842c8 100644
--- a/spec/features/groups/milestone_spec.rb
+++ b/spec/features/groups/milestone_spec.rb
@@ -19,9 +19,9 @@ feature 'Group milestones', :js do
     end
 
     it 'renders description preview' do
-      form = find('.gfm-form')
+      description = find('.note-textarea')
 
-      form.fill_in(:milestone_description, with: '')
+      description.native.send_keys('')
 
       click_link('Preview')
 
@@ -31,7 +31,7 @@ feature 'Group milestones', :js do
 
       click_link('Write')
 
-      form.fill_in(:milestone_description, with: ':+1: Nice')
+      description.native.send_keys(':+1: Nice')
 
       click_link('Preview')
 
@@ -51,6 +51,13 @@ feature 'Group milestones', :js do
 
       expect(find('.start_date')).to have_content(Date.today.at_beginning_of_month.strftime('%b %-d, %Y'))
     end
+
+    it 'description input does not support autocomplete' do
+      description = find('.note-textarea')
+      description.native.send_keys('!')
+
+      expect(page).not_to have_selector('.atwho-view')
+    end
   end
 
   context 'milestones list' do
-- 
cgit v1.2.1


From 3e5bfe5abd70f11224fa934f78a3e68f2038359a Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Mon, 23 Oct 2017 13:41:52 +0100
Subject: Prefer dispatcher glform init over global init

---
 app/assets/javascripts/dispatcher.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index eb576672d25..07535508d59 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -234,6 +234,7 @@ import DueDateSelectors from './due_date_select';
         case 'groups:milestones:update':
           new ZenMode();
           new DueDateSelectors();
+          new GLForm($('.milestone-form'), false);
           break;
         case 'projects:compare:show':
           new gl.Diff();
-- 
cgit v1.2.1


From 57a275791ff0e263dbe07ba7f1bfc4fdf53842cf Mon Sep 17 00:00:00 2001
From: Brett Walker <bwalker@gitlab.com>
Date: Mon, 23 Oct 2017 19:04:57 +0300
Subject: grab the correct username when confirming secondary email

---
 app/controllers/confirmations_controller.rb | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/app/controllers/confirmations_controller.rb b/app/controllers/confirmations_controller.rb
index 80ab681ed87..43b5d557429 100644
--- a/app/controllers/confirmations_controller.rb
+++ b/app/controllers/confirmations_controller.rb
@@ -15,7 +15,8 @@ class ConfirmationsController < Devise::ConfirmationsController
     if signed_in?(:user)
       after_sign_in(resource)
     else
-      Gitlab::AppLogger.info("Email Confirmed: username=#{resource.username} email=#{resource.email} ip=#{request.remote_ip}")
+      username = (_resource_name == :email ? resource.user.username : resource.username)
+      Gitlab::AppLogger.info("Email Confirmed: username=#{username} email=#{resource.email} ip=#{request.remote_ip}")
       flash[:notice] += " Please sign in."
       new_session_path(:user)
     end
-- 
cgit v1.2.1


From bb943537adbeaec64b6b9a703ffb17dfa1af5fd5 Mon Sep 17 00:00:00 2001
From: Eric Eastwood <contact@ericeastwood.com>
Date: Tue, 24 Oct 2017 07:16:57 +0300
Subject: Update i18n in FE docs, marking, interpolation

---
 changelogs/unreleased/update-fe-i18n-guide.yml |  5 ++++
 doc/development/fe_guide/index.md              |  4 +++
 doc/development/i18n/externalization.md        | 40 +++++++++++++++++++-------
 3 files changed, 39 insertions(+), 10 deletions(-)
 create mode 100644 changelogs/unreleased/update-fe-i18n-guide.yml

diff --git a/changelogs/unreleased/update-fe-i18n-guide.yml b/changelogs/unreleased/update-fe-i18n-guide.yml
new file mode 100644
index 00000000000..10bcf7836c6
--- /dev/null
+++ b/changelogs/unreleased/update-fe-i18n-guide.yml
@@ -0,0 +1,5 @@
+---
+title: Update i18n section in FE docs for marking and interpolation
+merge_request:
+author:
+type: changed
diff --git a/doc/development/fe_guide/index.md b/doc/development/fe_guide/index.md
index 73366eb9f3f..8f956681693 100644
--- a/doc/development/fe_guide/index.md
+++ b/doc/development/fe_guide/index.md
@@ -106,6 +106,10 @@ Frontend security practices.
 ## [Accessibility](accessibility.md)
 Our accessibility standards and resources.
 
+## [Internationalization (i18n) and Translations](../i18n/externalization.md)
+Frontend internationalization support is described in [this document](../i18n/).
+The [externalization part of the guide](../i18n/externalization.md) explains the helpers/methods available.
+
 
 [rails]: http://rubyonrails.org/
 [haml]: http://haml.info/
diff --git a/doc/development/i18n/externalization.md b/doc/development/i18n/externalization.md
index 167260b6e0e..7c38260406d 100644
--- a/doc/development/i18n/externalization.md
+++ b/doc/development/i18n/externalization.md
@@ -180,15 +180,43 @@ aren't in the message with id `1 pipeline`.
 
 ## Working with special content
 
+
+### Just marking content for parsing
+
+- In Ruby/HAML:
+
+    ```ruby
+    _('Subscribe')
+    ```
+
+- In JavaScript:
+
+    ```js
+    import { __ } from '../../../locale';
+    const label = __('Subscribe');
+    ```
+
+
+Sometimes there are some dynamic translations that can't be found by the
+parser when running `bundle exec rake gettext:find`. For these scenarios you can
+use the [`_N` method](https://github.com/grosser/gettext_i18n_rails/blob/c09e38d481e0899ca7d3fc01786834fa8e7aab97/Readme.md#unfound-translations-with-rake-gettextfind).
+
+There is also and alternative method to [translate messages from validation errors](https://github.com/grosser/gettext_i18n_rails/blob/c09e38d481e0899ca7d3fc01786834fa8e7aab97/Readme.md#option-a).
+
 ### Interpolation
 
 - In Ruby/HAML:
 
     ```ruby
-    _("Hello %{name}") % { name: 'Joe' }
+    _("Hello %{name}") % { name: 'Joe' } => 'Hello Joe'
     ```
 
-- In JavaScript: Not supported at this moment.
+- In JavaScript:
+
+    ```js
+    import { __, sprintf } from '../../../locale';
+    sprintf(__('Hello %{username}'), { username: 'Joe' }) => 'Hello Joe'
+    ```
 
 ### Plurals
 
@@ -234,14 +262,6 @@ Sometimes you need to add some context to the text that you want to translate
     s__('OpenedNDaysAgo|Opened')
     ```
 
-### Just marking content for parsing
-
-Sometimes there are some dynamic translations that can't be found by the
-parser when running `bundle exec rake gettext:find`. For these scenarios you can
-use the [`_N` method](https://github.com/grosser/gettext_i18n_rails/blob/c09e38d481e0899ca7d3fc01786834fa8e7aab97/Readme.md#unfound-translations-with-rake-gettextfind).
-
-There is also and alternative method to [translate messages from validation errors](https://github.com/grosser/gettext_i18n_rails/blob/c09e38d481e0899ca7d3fc01786834fa8e7aab97/Readme.md#option-a).
-
 ## Adding a new language
 
 Let's suppose you want to add translations for a new language, let's say French.
-- 
cgit v1.2.1


From 196df264467c2332fbeed1ff350ef176e92d0fd6 Mon Sep 17 00:00:00 2001
From: Brett Walker <bwalker@gitlab.com>
Date: Tue, 24 Oct 2017 09:23:35 +0300
Subject: fix to pass static-analysis

---
 app/controllers/confirmations_controller.rb | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/controllers/confirmations_controller.rb b/app/controllers/confirmations_controller.rb
index 43b5d557429..8ca01a6e2c6 100644
--- a/app/controllers/confirmations_controller.rb
+++ b/app/controllers/confirmations_controller.rb
@@ -10,12 +10,12 @@ class ConfirmationsController < Devise::ConfirmationsController
     users_almost_there_path
   end
 
-  def after_confirmation_path_for(_resource_name, resource)
+  def after_confirmation_path_for(resource_name, resource)
     # incoming resource can either be a :user or an :email
     if signed_in?(:user)
       after_sign_in(resource)
     else
-      username = (_resource_name == :email ? resource.user.username : resource.username)
+      username = (resource_name == :email ? resource.user.username : resource.username)
       Gitlab::AppLogger.info("Email Confirmed: username=#{username} email=#{resource.email} ip=#{request.remote_ip}")
       flash[:notice] += " Please sign in."
       new_session_path(:user)
-- 
cgit v1.2.1


From e6b0f4420059285e1ad6e98d98321381ebd9d671 Mon Sep 17 00:00:00 2001
From: "Luke \"Jared\" Bennett" <lbennett@gitlab.com>
Date: Tue, 24 Oct 2017 23:01:49 +0100
Subject: Split project and group milestone dispatcher branch

---
 app/assets/javascripts/dispatcher.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index 07535508d59..98b843279aa 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -229,6 +229,10 @@ import DueDateSelectors from './due_date_select';
         case 'projects:milestones:new':
         case 'projects:milestones:edit':
         case 'projects:milestones:update':
+          new ZenMode();
+          new DueDateSelectors();
+          new GLForm($('.milestone-form'), true);
+          break;
         case 'groups:milestones:new':
         case 'groups:milestones:edit':
         case 'groups:milestones:update':
-- 
cgit v1.2.1


From 05728e785ce7cd39c4c517aa0ea50b3bba44d537 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Thu, 26 Oct 2017 11:14:31 +0100
Subject: [WIP] Move multi-file editor store to Vuex

---
 app/assets/javascripts/api.js                      |   1 +
 .../repo/components/new_branch_form.vue            |  49 +++---
 app/assets/javascripts/repo/components/repo.vue    |  78 +++-------
 .../repo/components/repo_commit_section.vue        | 167 ++++++++-------------
 .../repo/components/repo_edit_button.vue           |  75 ++++-----
 .../javascripts/repo/components/repo_editor.vue    | 147 +++++++-----------
 .../javascripts/repo/components/repo_file.vue      |  19 +--
 .../repo/components/repo_file_buttons.vue          |  45 ++----
 .../repo/components/repo_loading_file.vue          |  10 +-
 .../repo/components/repo_prev_directory.vue        |  28 ++--
 .../javascripts/repo/components/repo_preview.vue   |  33 ++--
 .../javascripts/repo/components/repo_sidebar.vue   | 116 +++-----------
 .../javascripts/repo/components/repo_tab.vue       |  24 ++-
 .../javascripts/repo/components/repo_tabs.vue      |  12 +-
 .../repo/helpers/monaco_loader_helper.js           |   4 -
 app/assets/javascripts/repo/index.js               |  82 +++++-----
 app/assets/javascripts/repo/mixins/repo_mixin.js   |  17 ---
 app/assets/javascripts/repo/services/index.js      |  28 ++++
 app/assets/javascripts/repo/stores/actions.js      |  94 ++++++++++++
 .../javascripts/repo/stores/actions/branch.js      |  20 +++
 app/assets/javascripts/repo/stores/actions/file.js |  50 ++++++
 app/assets/javascripts/repo/stores/actions/tree.js |  70 +++++++++
 app/assets/javascripts/repo/stores/getters.js      |  39 +++++
 app/assets/javascripts/repo/stores/index.js        |  15 ++
 .../javascripts/repo/stores/mutation_types.js      |  26 ++++
 app/assets/javascripts/repo/stores/mutations.js    |  54 +++++++
 .../javascripts/repo/stores/mutations/branch.js    |   9 ++
 .../javascripts/repo/stores/mutations/file.js      |  50 ++++++
 .../javascripts/repo/stores/mutations/tree.js      |  27 ++++
 app/assets/javascripts/repo/stores/repo_store.js   |   7 -
 app/assets/javascripts/repo/stores/state.js        |  21 +++
 app/assets/javascripts/repo/stores/utils.js        |  73 +++++++++
 app/views/shared/repo/_repo.html.haml              |   4 +-
 33 files changed, 910 insertions(+), 584 deletions(-)
 delete mode 100644 app/assets/javascripts/repo/mixins/repo_mixin.js
 create mode 100644 app/assets/javascripts/repo/services/index.js
 create mode 100644 app/assets/javascripts/repo/stores/actions.js
 create mode 100644 app/assets/javascripts/repo/stores/actions/branch.js
 create mode 100644 app/assets/javascripts/repo/stores/actions/file.js
 create mode 100644 app/assets/javascripts/repo/stores/actions/tree.js
 create mode 100644 app/assets/javascripts/repo/stores/getters.js
 create mode 100644 app/assets/javascripts/repo/stores/index.js
 create mode 100644 app/assets/javascripts/repo/stores/mutation_types.js
 create mode 100644 app/assets/javascripts/repo/stores/mutations.js
 create mode 100644 app/assets/javascripts/repo/stores/mutations/branch.js
 create mode 100644 app/assets/javascripts/repo/stores/mutations/file.js
 create mode 100644 app/assets/javascripts/repo/stores/mutations/tree.js
 create mode 100644 app/assets/javascripts/repo/stores/state.js
 create mode 100644 app/assets/javascripts/repo/stores/utils.js

diff --git a/app/assets/javascripts/api.js b/app/assets/javascripts/api.js
index 242b3e2b990..d963101028a 100644
--- a/app/assets/javascripts/api.js
+++ b/app/assets/javascripts/api.js
@@ -16,6 +16,7 @@ const Api = {
   usersPath: '/api/:version/users.json',
   commitPath: '/api/:version/projects/:id/repository/commits',
   branchSinglePath: '/api/:version/projects/:id/repository/branches/:branch',
+  createBranchPath: '/api/:version/projects/:id/repository/branches',
 
   group(groupId, callback) {
     const url = Api.buildUrl(Api.groupPath)
diff --git a/app/assets/javascripts/repo/components/new_branch_form.vue b/app/assets/javascripts/repo/components/new_branch_form.vue
index eac43e692b0..ba7090e4a9d 100644
--- a/app/assets/javascripts/repo/components/new_branch_form.vue
+++ b/app/assets/javascripts/repo/components/new_branch_form.vue
@@ -1,18 +1,12 @@
 <script>
+  import { mapState, mapActions } from 'vuex';
   import flash, { hideFlash } from '../../flash';
   import loadingIcon from '../../vue_shared/components/loading_icon.vue';
-  import eventHub from '../event_hub';
 
   export default {
     components: {
       loadingIcon,
     },
-    props: {
-      currentBranch: {
-        type: String,
-        required: true,
-      },
-    },
     data() {
       return {
         branchName: '',
@@ -20,11 +14,17 @@
       };
     },
     computed: {
+      ...mapState([
+        'currentBranch',
+      ]),
       btnDisabled() {
         return this.loading || this.branchName === '';
       },
     },
     methods: {
+      ...mapActions([
+        'createNewBranch',
+      ]),
       toggleDropdown() {
         this.$dropdown.dropdown('toggle');
       },
@@ -38,19 +38,21 @@
           hideFlash(flashEl, false);
         }
 
-        eventHub.$emit('createNewBranch', this.branchName);
-      },
-      showErrorMessage(message) {
-        this.loading = false;
-        flash(message, 'alert', this.$el);
-      },
-      createdNewBranch(newBranchName) {
-        this.loading = false;
-        this.branchName = '';
+        this.createNewBranch(this.branchName)
+          .then(() => {
+            this.loading = false;
+            this.branchName = '';
 
-        if (this.dropdownText) {
-          this.dropdownText.textContent = newBranchName;
-        }
+            if (this.dropdownText) {
+              this.dropdownText.textContent = this.currentBranch;
+            }
+
+            this.toggleDropdown();
+          })
+          .catch(res => res.json().then((data) => {
+            this.loading = false;
+            flash(data.message, 'alert', this.$el);
+          }));
       },
     },
     created() {
@@ -59,15 +61,6 @@
 
       // text element is outside Vue app
       this.dropdownText = document.querySelector('.project-refs-form .dropdown-toggle-text');
-
-      eventHub.$on('createNewBranchSuccess', this.createdNewBranch);
-      eventHub.$on('createNewBranchError', this.showErrorMessage);
-      eventHub.$on('toggleNewBranchDropdown', this.toggleDropdown);
-    },
-    destroyed() {
-      eventHub.$off('createNewBranchSuccess', this.createdNewBranch);
-      eventHub.$off('toggleNewBranchDropdown', this.toggleDropdown);
-      eventHub.$off('createNewBranchError', this.showErrorMessage);
     },
   };
 </script>
diff --git a/app/assets/javascripts/repo/components/repo.vue b/app/assets/javascripts/repo/components/repo.vue
index 788976a9804..0bc5271f95c 100644
--- a/app/assets/javascripts/repo/components/repo.vue
+++ b/app/assets/javascripts/repo/components/repo.vue
@@ -1,75 +1,42 @@
 <script>
+import { mapState, mapGetters } from 'vuex';
 import RepoSidebar from './repo_sidebar.vue';
 import RepoCommitSection from './repo_commit_section.vue';
 import RepoTabs from './repo_tabs.vue';
 import RepoFileButtons from './repo_file_buttons.vue';
 import RepoPreview from './repo_preview.vue';
-import RepoMixin from '../mixins/repo_mixin';
-import PopupDialog from '../../vue_shared/components/popup_dialog.vue';
-import Store from '../stores/repo_store';
-import Helper from '../helpers/repo_helper';
-import Service from '../services/repo_service';
 import MonacoLoaderHelper from '../helpers/monaco_loader_helper';
-import eventHub from '../event_hub';
 
 export default {
-  data() {
-    return Store;
+  computed: {
+    ...mapState([
+      'currentBlobView',
+      'editMode',
+    ]),
+    ...mapGetters([
+      'isMini',
+      'changedFiles',
+    ]),
   },
-  mixins: [RepoMixin],
   components: {
     RepoSidebar,
     RepoTabs,
     RepoFileButtons,
     'repo-editor': MonacoLoaderHelper.repoEditorLoader,
     RepoCommitSection,
-    PopupDialog,
     RepoPreview,
   },
-  created() {
-    eventHub.$on('createNewBranch', this.createNewBranch);
-  },
   mounted() {
-    Helper.getContent().catch(Helper.loadingError);
-  },
-  destroyed() {
-    eventHub.$off('createNewBranch', this.createNewBranch);
-  },
-  methods: {
-    getCurrentLocation() {
-      return location.href;
-    },
-    toggleDialogOpen(toggle) {
-      this.dialog.open = toggle;
-    },
-
-    dialogSubmitted(status) {
-      this.toggleDialogOpen(false);
-      this.dialog.status = status;
-
-      // remove tmp files
-      Helper.removeAllTmpFiles('openedFiles');
-      Helper.removeAllTmpFiles('files');
-    },
-    toggleBlobView: Store.toggleBlobView,
-    createNewBranch(branch) {
-      Service.createBranch({
-        branch,
-        ref: Store.currentBranch,
-      }).then((res) => {
-        const newBranchName = res.data.name;
-        const newUrl = this.getCurrentLocation().replace(Store.currentBranch, newBranchName);
+    window.onbeforeunload = (e) => {
+      const event = e || window.event;
 
-        Store.currentBranch = newBranchName;
+      if (!this.changedFiles.length) return undefined;
 
-        history.pushState({ key: Helper.key }, '', newUrl);
+      if (event) event.returnValue = 'Are you sure you want to lose unsaved changes?';
 
-        eventHub.$emit('createNewBranchSuccess', newBranchName);
-        eventHub.$emit('toggleNewBranchDropdown');
-      }).catch((err) => {
-        eventHub.$emit('createNewBranchError', err.response.data.message);
-      });
-    },
+      // For Safari
+      return 'Are you sure you want to lose unsaved changes?';
+    };
   },
 };
 </script>
@@ -88,15 +55,6 @@ export default {
         <repo-file-buttons/>
       </div>
     </div>
-    <repo-commit-section/>
-    <popup-dialog
-      v-show="dialog.open"
-      :primary-button-label="__('Discard changes')"
-      kind="warning"
-      :title="__('Are you sure?')"
-      :text="__('Are you sure you want to discard your changes?')"
-      @toggle="toggleDialogOpen"
-      @submit="dialogSubmitted"
-    />
+    <repo-commit-section v-if="changedFiles.length" />
   </div>
 </template>
diff --git a/app/assets/javascripts/repo/components/repo_commit_section.vue b/app/assets/javascripts/repo/components/repo_commit_section.vue
index 0d6259a37a8..37fc35f35c9 100644
--- a/app/assets/javascripts/repo/components/repo_commit_section.vue
+++ b/app/assets/javascripts/repo/components/repo_commit_section.vue
@@ -1,141 +1,97 @@
 <script>
-import Flash from '../../flash';
-import Store from '../stores/repo_store';
-import RepoMixin from '../mixins/repo_mixin';
-import Service from '../services/repo_service';
+import { mapGetters, mapState, mapActions } from 'vuex';
 import PopupDialog from '../../vue_shared/components/popup_dialog.vue';
-import { visitUrl } from '../../lib/utils/url_utility';
+import { n__ } from '../../locale';
 
 export default {
-  mixins: [RepoMixin],
-
-  data() {
-    return Store;
-  },
-
   components: {
     PopupDialog,
   },
-
+  data() {
+    return {
+      showNewBranchDialog: false,
+      submitCommitsLoading: false,
+      startNewMR: false,
+      commitMessage: '',
+    };
+  },
   computed: {
-    showCommitable() {
-      return this.isCommitable && this.changedFiles.length;
-    },
-
-    branchPaths() {
-      return this.changedFiles.map(f => f.path);
-    },
-
-    cantCommitYet() {
+    ...mapState([
+      'currentBranch',
+    ]),
+    ...mapGetters([
+      'changedFiles',
+    ]),
+    commitButtonDisabled() {
       return !this.commitMessage || this.submitCommitsLoading;
     },
-
-    filePluralize() {
-      return this.changedFiles.length > 1 ? 'files' : 'file';
+    commitButtonText() {
+      return n__('Commit %d file', 'Commit %d files', this.changedFiles.length);
     },
   },
-
   methods: {
-    commitToNewBranch(status) {
-      if (status) {
-        this.showNewBranchDialog = false;
-        this.tryCommit(null, true, true);
-      } else {
-        // reset the state
-      }
-    },
+    ...mapActions([
+      'checkCommitStatus',
+      'commitChanges',
+    ]),
+    makeCommit(newBranch = false) {
+      const createNewBranch = newBranch || this.startNewMR;
 
-    makeCommit(newBranch) {
-      // see https://docs.gitlab.com/ce/api/commits.html#create-a-commit-with-multiple-files-and-actions
-      const commitMessage = this.commitMessage;
-      const actions = this.changedFiles.map(f => ({
-        action: f.tempFile ? 'create' : 'update',
-        file_path: f.path,
-        content: f.newContent,
-      }));
-      const branch = newBranch ? `${this.currentBranch}-${this.currentShortHash}` : this.currentBranch;
       const payload = {
-        branch,
-        commit_message: commitMessage,
-        actions,
+        branch: createNewBranch ? `${this.currentBranch}-${new Date().getTime().toString()}` : this.currentBranch,
+        commit_message: this.commitMessage,
+        actions: this.changedFiles.map(f => ({
+          action: f.tempFile ? 'create' : 'update',
+          file_path: f.path,
+          content: f.content,
+        })),
+        start_branch: createNewBranch ? this.currentBranch : undefined,
       };
-      if (newBranch) {
-        payload.start_branch = this.currentBranch;
-      }
-      Service.commitFiles(payload)
+
+      this.showNewBranchDialog = false;
+      this.submitCommitsLoading = true;
+
+      this.commitChanges({ payload, newMr: this.startNewMR })
         .then(() => {
-          this.resetCommitState();
-          if (this.startNewMR) {
-            this.redirectToNewMr(branch);
-          } else {
-            this.redirectToBranch(branch);
-          }
+          this.submitCommitsLoading = false;
         })
         .catch(() => {
-          Flash('An error occurred while committing your changes');
+          this.submitCommitsLoading = false;
         });
     },
-
-    tryCommit(e, skipBranchCheck = false, newBranch = false) {
+    tryCommit() {
       this.submitCommitsLoading = true;
 
-      if (skipBranchCheck) {
-        this.makeCommit(newBranch);
-      } else {
-        Store.setBranchHash()
-          .then(() => {
-            if (Store.branchChanged) {
-              Store.showNewBranchDialog = true;
-              return;
-            }
-            this.makeCommit(newBranch);
-          })
-          .catch(() => {
-            this.submitCommitsLoading = false;
-            Flash('An error occurred while committing your changes');
-          });
-      }
-    },
-
-    redirectToNewMr(branch) {
-      visitUrl(this.newMrTemplateUrl.replace('{{source_branch}}', branch));
-    },
-
-    redirectToBranch(branch) {
-      visitUrl(this.customBranchURL.replace('{{branch}}', branch));
-    },
-
-    resetCommitState() {
-      this.submitCommitsLoading = false;
-      this.openedFiles = this.openedFiles.map((file) => {
-        const f = file;
-        f.changed = false;
-        return f;
-      });
-      this.changedFiles = [];
-      this.commitMessage = '';
-      this.editMode = false;
-      window.scrollTo(0, 0);
+      this.checkCommitStatus()
+        .then((branchChanged) => {
+          if (branchChanged) {
+            this.showNewBranchDialog = true;
+          } else {
+            this.makeCommit();
+          }
+        })
+        .catch(() => {
+          this.submitCommitsLoading = false;
+        });
     },
   },
 };
 </script>
 
 <template>
-<div
-  v-if="showCommitable"
-  id="commit-area">
+<div id="commit-area">
   <popup-dialog
     v-if="showNewBranchDialog"
     :primary-button-label="__('Create new branch')"
     kind="primary"
     :title="__('Branch has changed')"
     :text="__('This branch has changed since you started editing. Would you like to create a new branch?')"
-    @submit="commitToNewBranch"
+    @toggle="showNewBranchDialog = false"
+    @submit="makeCommit(true)"
   />
   <form
     class="form-horizontal"
-    @submit.prevent="tryCommit">
+    @submit.prevent="tryCommit()">
     <fieldset>
       <div class="form-group">
         <label class="col-md-4 control-label staged-files">
@@ -144,10 +100,10 @@ export default {
         <div class="col-md-6">
           <ul class="list-unstyled changed-files">
             <li
-              v-for="branchPath in branchPaths"
-              :key="branchPath">
+              v-for="(file, index) in changedFiles"
+              :key="index">
               <span class="help-block">
-                {{branchPath}}
+                {{ file.path }}
               </span>
             </li>
           </ul>
@@ -182,9 +138,8 @@ export default {
       </div>
       <div class="col-md-offset-4 col-md-6">
         <button
-          ref="submitCommit"
           type="submit"
-          :disabled="cantCommitYet"
+          :disabled="commitButtonDisabled"
           class="btn btn-success">
           <i
             v-if="submitCommitsLoading"
@@ -193,7 +148,7 @@ export default {
             aria-label="loading">
           </i>
           <span class="commit-summary">
-            Commit {{changedFiles.length}} {{filePluralize}}
+            {{ commitButtonText }}
           </span>
         </button>
       </div>
diff --git a/app/assets/javascripts/repo/components/repo_edit_button.vue b/app/assets/javascripts/repo/components/repo_edit_button.vue
index e6e8b2e5205..59c1ed6e4be 100644
--- a/app/assets/javascripts/repo/components/repo_edit_button.vue
+++ b/app/assets/javascripts/repo/components/repo_edit_button.vue
@@ -1,50 +1,57 @@
 <script>
-import Store from '../stores/repo_store';
-import RepoMixin from '../mixins/repo_mixin';
+import { mapGetters, mapActions, mapState } from 'vuex';
+import popupDialog from '../../vue_shared/components/popup_dialog.vue';
 
 export default {
-  data() {
-    return Store;
+  components: {
+    popupDialog,
   },
-  mixins: [RepoMixin],
   computed: {
+    ...mapState([
+      'editMode',
+      'discardPopupOpen',
+    ]),
+    ...mapGetters([
+      'canEditFile',
+    ]),
     buttonLabel() {
       return this.editMode ? this.__('Cancel edit') : this.__('Edit');
     },
-
-    showButton() {
-      return this.isCommitable &&
-        !this.activeFile.render_error &&
-        !this.binary &&
-        this.openedFiles.length;
-    },
   },
   methods: {
-    editCancelClicked() {
-      if (this.changedFiles.length) {
-        this.dialog.open = true;
-        return;
-      }
-      this.editMode = !this.editMode;
-      Store.toggleBlobView();
-    },
+    ...mapActions([
+      'toggleEditMode',
+      'closeDiscardPopup',
+    ]),
   },
 };
 </script>
 
 <template>
-<button
-  v-if="showButton"
-  class="btn btn-default"
-  type="button"
-  @click.prevent="editCancelClicked">
-  <i
-    v-if="!editMode"
-    class="fa fa-pencil"
-    aria-hidden="true">
-  </i>
-  <span>
-    {{buttonLabel}}
-  </span>
-</button>
+  <div>
+    <button
+      v-if="canEditFile"
+      class="btn btn-default"
+      type="button"
+      @click.prevent="toggleEditMode()">
+      <i
+        v-if="!editMode"
+        class="fa fa-pencil"
+        aria-hidden="true">
+      </i>
+      <span>
+        {{buttonLabel}}
+      </span>
+    </button>
+    <popup-dialog
+      v-if="discardPopupOpen"
+      class="text-left"
+      :primary-button-label="__('Discard changes')"
+      kind="warning"
+      :title="__('Are you sure?')"
+      :text="__('Are you sure you want to discard your changes?')"
+      @toggle="closeDiscardPopup"
+      @submit="toggleEditMode(true)"
+    />
+  </div>
 </template>
diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue
index df4caba51d8..06ded6332e1 100644
--- a/app/assets/javascripts/repo/components/repo_editor.vue
+++ b/app/assets/javascripts/repo/components/repo_editor.vue
@@ -1,122 +1,83 @@
 <script>
 /* global monaco */
-import Store from '../stores/repo_store';
-import Service from '../services/repo_service';
+import { mapGetters, mapActions } from 'vuex';
 import Helper from '../helpers/repo_helper';
+import flash from '../../flash';
 
-const RepoEditor = {
-  data() {
-    return Store;
-  },
-
+export default {
   destroyed() {
-    if (Helper.monacoInstance) {
-      Helper.monacoInstance.destroy();
+    if (this.monacoInstance) {
+      this.monacoInstance.destroy();
     }
   },
-
   mounted() {
-    Service.getRaw(this.activeFile)
-      .then((rawResponse) => {
-        Store.blobRaw = rawResponse.data;
-        Store.activeFile.plain = rawResponse.data;
-
-        const monacoInstance = Helper.monaco.editor.create(this.$el, {
-          model: null,
-          readOnly: false,
-          contextmenu: true,
-          scrollBeyondLastLine: false,
-        });
-
-        Helper.monacoInstance = monacoInstance;
-
-        this.addMonacoEvents();
-
-        this.setupEditor();
-      })
-      .catch(Helper.loadingError);
+    this.initMonaco();
   },
-
   methods: {
-    setupEditor() {
-      this.showHide();
-
-      Helper.setMonacoModelFromLanguage();
-    },
-
-    showHide() {
-      if (!this.openedFiles.length || (this.binary && !this.activeFile.raw)) {
-        this.$el.style.display = 'none';
-      } else {
-        this.$el.style.display = 'inline-block';
+    ...mapActions([
+      'getRawFileData',
+      'changeFileContent',
+    ]),
+    initMonaco() {
+      if (this.monacoInstance) {
+        this.monacoInstance.setModel(null);
       }
-    },
 
-    addMonacoEvents() {
-      Helper.monacoInstance.onMouseUp(this.onMonacoEditorMouseUp);
-      Helper.monacoInstance.onKeyUp(this.onMonacoEditorKeysPressed.bind(this));
-    },
+      this.getRawFileData(this.activeFile)
+        .then(() => {
+          if (!this.monacoInstance) {
+            this.monacoInstance = Helper.monaco.editor.create(this.$el, {
+              model: null,
+              readOnly: false,
+              contextmenu: true,
+              scrollBeyondLastLine: false,
+            });
 
-    onMonacoEditorKeysPressed() {
-      Store.setActiveFileContents(Helper.monacoInstance.getValue());
-    },
-
-    onMonacoEditorMouseUp(e) {
-      if (!e.target.position) return;
-      const lineNumber = e.target.position.lineNumber;
-      if (e.target.element.classList.contains('line-numbers')) {
-        location.hash = `L${lineNumber}`;
-        Store.setActiveLine(lineNumber);
-      }
-    },
-  },
+            this.languages = Helper.monaco.languages.getLanguages();
 
-  watch: {
-    dialog: {
-      handler(obj) {
-        const newObj = obj;
-        if (newObj.status) {
-          newObj.status = false;
-          this.openedFiles = this.openedFiles.map((file) => {
-            const f = file;
-            if (f.active) {
-              this.blobRaw = f.plain;
-            }
-            f.changed = false;
-            delete f.newContent;
+            this.addMonacoEvents();
+          }
 
-            return f;
-          });
-          this.editMode = false;
-          Store.toggleBlobView();
-        }
-      },
-      deep: true,
+          this.setupEditor();
+        })
+        .catch(() => flash('Error setting up monaco. Please try again.'));
     },
-
-    blobRaw() {
-      if (Helper.monacoInstance) {
-        this.setupEditor();
-      }
+    setupEditor() {
+      const foundLang = this.languages.find(lang =>
+        lang.extensions && lang.extensions.indexOf(this.activeFileExtension) === 0,
+      );
+      const newModel = Helper.monaco.editor.createModel(
+        this.activeFile.raw, foundLang ? foundLang.id : 'plaintext',
+      );
+
+      this.monacoInstance.setModel(newModel);
     },
-
-    activeLine() {
-      if (Helper.monacoInstance) {
-        Helper.monacoInstance.setPosition({
-          lineNumber: this.activeLine,
-          column: 1,
+    addMonacoEvents() {
+      this.monacoInstance.onKeyUp(() => {
+        this.changeFileContent({
+          file: this.activeFile,
+          content: this.monacoInstance.getValue(),
         });
+      });
+    },
+  },
+  watch: {
+    activeFile(oldVal, newVal) {
+      if (newVal.active) {
+        this.initMonaco();
       }
     },
   },
   computed: {
+    ...mapGetters([
+      'activeFile',
+      'activeFileExtension',
+    ]),
     shouldHideEditor() {
-      return !this.openedFiles.length || (this.binary && !this.activeFile.raw);
+      return this.activeFile.binary && !this.activeFile.raw;
     },
   },
 };
-
-export default RepoEditor;
 </script>
 
 <template>
diff --git a/app/assets/javascripts/repo/components/repo_file.vue b/app/assets/javascripts/repo/components/repo_file.vue
index 8c86e87ed3a..f78c9591da4 100644
--- a/app/assets/javascripts/repo/components/repo_file.vue
+++ b/app/assets/javascripts/repo/components/repo_file.vue
@@ -1,11 +1,9 @@
 <script>
+  import { mapActions, mapGetters } from 'vuex';
   import timeAgoMixin from '../../vue_shared/mixins/timeago';
-  import eventHub from '../event_hub';
-  import repoMixin from '../mixins/repo_mixin';
 
   export default {
     mixins: [
-      repoMixin,
       timeAgoMixin,
     ],
     props: {
@@ -15,13 +13,15 @@
       },
     },
     computed: {
+      ...mapGetters([
+        'isMini',
+      ]),
       fileIcon() {
-        const classObj = {
+        return {
           'fa-spinner fa-spin': this.file.loading,
           [this.file.icon]: !this.file.loading,
           'fa-folder-open': !this.file.loading && this.file.opened,
         };
-        return classObj;
       },
       levelIndentation() {
         return {
@@ -33,9 +33,10 @@
       },
     },
     methods: {
-      linkClicked(file) {
-        eventHub.$emit('fileNameClicked', file);
-      },
+      ...mapActions([
+        'getTreeData',
+        'clickedTreeRow',
+      ]),
     },
   };
 </script>
@@ -43,7 +44,7 @@
 <template>
   <tr
     class="file"
-    @click.prevent="linkClicked(file)">
+    @click.prevent="clickedTreeRow(file)">
     <td>
       <i
         class="fa fa-fw file-icon"
diff --git a/app/assets/javascripts/repo/components/repo_file_buttons.vue b/app/assets/javascripts/repo/components/repo_file_buttons.vue
index c98f641c853..3d72a635035 100644
--- a/app/assets/javascripts/repo/components/repo_file_buttons.vue
+++ b/app/assets/javascripts/repo/components/repo_file_buttons.vue
@@ -1,37 +1,22 @@
 <script>
-import Store from '../stores/repo_store';
-import Helper from '../helpers/repo_helper';
-import RepoMixin from '../mixins/repo_mixin';
-
-const RepoFileButtons = {
-  data() {
-    return Store;
-  },
-
-  mixins: [RepoMixin],
+import { mapGetters } from 'vuex';
 
+export default {
   computed: {
+    ...mapGetters([
+      'activeFile',
+    ]),
     showButtons() {
-      return this.activeFile.raw_path ||
-        this.activeFile.blame_path ||
-        this.activeFile.commits_path ||
+      return this.activeFile.rawPath ||
+        this.activeFile.blamePath ||
+        this.activeFile.commitsPath ||
         this.activeFile.permalink;
     },
     rawDownloadButtonLabel() {
-      return this.binary ? 'Download' : 'Raw';
-    },
-
-    canPreview() {
-      return Helper.isRenderable();
+      return this.activeFile.binary ? 'Download' : 'Raw';
     },
   },
-
-  methods: {
-    rawPreviewToggle: Store.toggleRawPreview,
-  },
 };
-
-export default RepoFileButtons;
 </script>
 
 <template>
@@ -40,11 +25,11 @@ export default RepoFileButtons;
     class="repo-file-buttons"
   >
     <a
-      :href="activeFile.raw_path"
+      :href="activeFile.rawPath"
       target="_blank"
       class="btn btn-default raw"
       rel="noopener noreferrer">
-      {{rawDownloadButtonLabel}}
+      {{ rawDownloadButtonLabel }}
     </a>
 
     <div
@@ -52,12 +37,12 @@ export default RepoFileButtons;
       role="group"
       aria-label="File actions">
       <a
-        :href="activeFile.blame_path"
+        :href="activeFile.blamePath"
         class="btn btn-default blame">
         Blame
       </a>
       <a
-        :href="activeFile.commits_path"
+        :href="activeFile.commitsPath"
         class="btn btn-default history">
         History
       </a>
@@ -68,12 +53,12 @@ export default RepoFileButtons;
       </a>
     </div>
 
-    <a
+    <!-- <a
       v-if="canPreview"
       href="#"
       @click.prevent="rawPreviewToggle"
       class="btn btn-default preview">
       {{activeFileLabel}}
-    </a>
+    </a> -->
   </div>
 </template>
diff --git a/app/assets/javascripts/repo/components/repo_loading_file.vue b/app/assets/javascripts/repo/components/repo_loading_file.vue
index 832b45b2b29..51a2aade464 100644
--- a/app/assets/javascripts/repo/components/repo_loading_file.vue
+++ b/app/assets/javascripts/repo/components/repo_loading_file.vue
@@ -1,10 +1,12 @@
 <script>
-  import repoMixin from '../mixins/repo_mixin';
+  import { mapGetters } from 'vuex';
 
   export default {
-    mixins: [
-      repoMixin,
-    ],
+    computed: {
+      ...mapGetters([
+        'isMini',
+      ]),
+    },
     methods: {
       lineOfCode(n) {
         return `skeleton-line-${n}`;
diff --git a/app/assets/javascripts/repo/components/repo_prev_directory.vue b/app/assets/javascripts/repo/components/repo_prev_directory.vue
index c4bf6dcdec2..3c623dd8020 100644
--- a/app/assets/javascripts/repo/components/repo_prev_directory.vue
+++ b/app/assets/javascripts/repo/components/repo_prev_directory.vue
@@ -1,26 +1,22 @@
 <script>
-  import eventHub from '../event_hub';
-  import repoMixin from '../mixins/repo_mixin';
+  import { mapGetters, mapState, mapActions } from 'vuex';
 
   export default {
-    mixins: [
-      repoMixin,
-    ],
-    props: {
-      prevUrl: {
-        type: String,
-        required: true,
-      },
-    },
     computed: {
+      ...mapState([
+        'parentTreeUrl',
+      ]),
+      ...mapGetters([
+        'isMini',
+      ]),
       colSpanCondition() {
         return this.isMini ? undefined : 3;
       },
     },
     methods: {
-      linkClicked(file) {
-        eventHub.$emit('goToPreviousDirectoryClicked', file);
-      },
+      ...mapActions([
+        'getTreeData',
+      ]),
     },
   };
 </script>
@@ -30,9 +26,9 @@
     <td
       :colspan="colSpanCondition"
       class="table-cell"
-      @click.prevent="linkClicked(prevUrl)"
+      @click.prevent="getTreeData({ endpoint: parentTreeUrl })"
     >
-      <a :href="prevUrl">...</a>
+      <a :href="parentTreeUrl">...</a>
     </td>
   </tr>
 </template>
diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index b5be771d539..23b71b03a14 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -1,44 +1,31 @@
 <script>
 /* global LineHighlighter */
-
-import Store from '../stores/repo_store';
+import { mapGetters } from 'vuex';
 
 export default {
-  data() {
-    return Store;
-  },
   computed: {
-    html() {
-      return this.activeFile.html;
-    },
+    ...mapGetters([
+      'activeFile',
+    ]),
   },
   methods: {
     highlightFile() {
       $(this.$el).find('.file-content').syntaxHighlight();
     },
-    highlightLine() {
-      if (Store.activeLine > -1) {
-        this.lineHighlighter.highlightHash(`#L${Store.activeLine}`);
-      }
-    },
   },
   mounted() {
     this.highlightFile();
+
+    // TODO: get this to work across different files
     this.lineHighlighter = new LineHighlighter({
       fileHolderSelector: '.blob-viewer-container',
       scrollFileHolder: true,
     });
   },
-  watch: {
-    html() {
-      this.$nextTick(() => {
-        this.highlightFile();
-        this.highlightLine();
-      });
-    },
-    activeLine() {
-      this.highlightLine();
-    },
+  updated() {
+    this.$nextTick(() => {
+      this.highlightFile();
+    });
   },
 };
 </script>
diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue
index 09dc9ee25d7..34eaa26cf72 100644
--- a/app/assets/javascripts/repo/components/repo_sidebar.vue
+++ b/app/assets/javascripts/repo/components/repo_sidebar.vue
@@ -1,109 +1,44 @@
 <script>
-import _ from 'underscore';
-import Service from '../services/repo_service';
-import Helper from '../helpers/repo_helper';
-import Store from '../stores/repo_store';
-import eventHub from '../event_hub';
+import { mapState, mapGetters, mapActions } from 'vuex';
 import RepoPreviousDirectory from './repo_prev_directory.vue';
 import RepoFile from './repo_file.vue';
 import RepoLoadingFile from './repo_loading_file.vue';
-import RepoMixin from '../mixins/repo_mixin';
 
 export default {
-  mixins: [RepoMixin],
   components: {
     'repo-previous-directory': RepoPreviousDirectory,
     'repo-file': RepoFile,
     'repo-loading-file': RepoLoadingFile,
   },
   created() {
-    window.addEventListener('popstate', this.checkHistory);
+    window.addEventListener('popstate', this.popHistoryState);
   },
   destroyed() {
-    eventHub.$off('fileNameClicked', this.fileClicked);
-    eventHub.$off('goToPreviousDirectoryClicked', this.goToPreviousDirectoryClicked);
-    window.removeEventListener('popstate', this.checkHistory);
+    window.removeEventListener('popstate', this.popHistoryState);
   },
   mounted() {
-    eventHub.$on('fileNameClicked', this.fileClicked);
-    eventHub.$on('goToPreviousDirectoryClicked', this.goToPreviousDirectoryClicked);
-  },
-  data() {
-    return Store;
+    this.getTreeData();
   },
   computed: {
-    flattendFiles() {
-      const mapFiles = arr => (!arr.files.length ? [] : _.map(arr.files, a => [a, mapFiles(a)]));
-
-      return _.chain(this.files)
-        .map(arr => [arr, mapFiles(arr)])
-        .flatten()
-        .value();
-    },
+    ...mapState([
+      'loading',
+      'isRoot',
+    ]),
+    ...mapState({
+      projectName(state) {
+        return state.project.name;
+      },
+    }),
+    ...mapGetters([
+      'treeList',
+      'isMini',
+    ]),
   },
   methods: {
-    checkHistory() {
-      let selectedFile = this.files.find(file => location.pathname.indexOf(file.url) > -1);
-      if (!selectedFile) {
-        // Maybe it is not in the current tree but in the opened tabs
-        selectedFile = Helper.getFileFromPath(location.pathname);
-      }
-
-      let lineNumber = null;
-      if (location.hash.indexOf('#L') > -1) lineNumber = Number(location.hash.substr(2));
-
-      if (selectedFile) {
-        if (selectedFile.url !== this.activeFile.url) {
-          this.fileClicked(selectedFile, lineNumber);
-        } else {
-          Store.setActiveLine(lineNumber);
-        }
-      } else {
-        // Not opened at all lets open new tab
-        this.fileClicked({
-          url: location.href,
-        }, lineNumber);
-      }
-    },
-
-    fileClicked(clickedFile, lineNumber) {
-      const file = clickedFile;
-
-      if (file.loading) return;
-
-      if (file.type === 'tree' && file.opened) {
-        Helper.setDirectoryToClosed(file);
-        Store.setActiveLine(lineNumber);
-      } else if (file.type === 'submodule') {
-        file.loading = true;
-
-        gl.utils.visitUrl(file.url);
-      } else {
-        const openFile = Helper.getFileFromPath(file.url);
-
-        if (openFile) {
-          Store.setActiveFiles(openFile);
-          Store.setActiveLine(lineNumber);
-        } else {
-          file.loading = true;
-          Service.url = file.url;
-          Helper.getContent(file)
-            .then(() => {
-              file.loading = false;
-              Helper.scrollTabsRight();
-              Store.setActiveLine(lineNumber);
-            })
-            .catch(Helper.loadingError);
-        }
-      }
-    },
-
-    goToPreviousDirectoryClicked(prevURL) {
-      Service.url = prevURL;
-      Helper.getContent(null, true)
-        .then(() => Helper.scrollTabsRight())
-        .catch(Helper.loadingError);
-    },
+    ...mapActions([
+      'getTreeData',
+      'popHistoryState',
+    ]),
   },
 };
 </script>
@@ -136,17 +71,16 @@ export default {
     </thead>
     <tbody>
       <repo-previous-directory
-        v-if="!isRoot && !loading.tree"
-        :prev-url="prevURL"
+        v-if="!isRoot && treeList.length"
       />
       <repo-loading-file
-        v-if="!flattendFiles.length && loading.tree"
+        v-if="!treeList.length && loading"
         v-for="n in 5"
         :key="n"
       />
       <repo-file
-        v-for="file in flattendFiles"
-        :key="file.id"
+        v-for="(file, index) in treeList"
+        :key="index"
         :file="file"
       />
     </tbody>
diff --git a/app/assets/javascripts/repo/components/repo_tab.vue b/app/assets/javascripts/repo/components/repo_tab.vue
index 405d7b4cf86..4c418aba103 100644
--- a/app/assets/javascripts/repo/components/repo_tab.vue
+++ b/app/assets/javascripts/repo/components/repo_tab.vue
@@ -1,7 +1,7 @@
 <script>
-import Store from '../stores/repo_store';
+import { mapActions } from 'vuex';
 
-const RepoTab = {
+export default {
   props: {
     tab: {
       type: Object,
@@ -26,29 +26,23 @@ const RepoTab = {
   },
 
   methods: {
-    tabClicked(file) {
-      Store.setActiveFiles(file);
-    },
-    closeTab(file) {
-      if (file.changed || file.tempFile) return;
-
-      Store.removeFromOpenedFiles(file);
-    },
+    ...mapActions([
+      'setFileActive',
+      'closeFile',
+    ]),
   },
 };
-
-export default RepoTab;
 </script>
 
 <template>
   <li
     :class="{ active : tab.active }"
-    @click="tabClicked(tab)"
+    @click="setFileActive(tab)"
   >
     <button
       type="button"
       class="close-btn"
-      @click.stop.prevent="closeTab(tab)"
+      @click.stop.prevent="closeFile(tab)"
       :aria-label="closeLabel">
       <i
         class="fa"
@@ -61,7 +55,7 @@ export default RepoTab;
       href="#"
       class="repo-tab"
       :title="tab.url"
-      @click.prevent="tabClicked(tab)">
+      @click.prevent="setFileActive(tab)">
       {{tab.name}}
     </a>
   </li>
diff --git a/app/assets/javascripts/repo/components/repo_tabs.vue b/app/assets/javascripts/repo/components/repo_tabs.vue
index b57cd0960de..59beae53e8d 100644
--- a/app/assets/javascripts/repo/components/repo_tabs.vue
+++ b/app/assets/javascripts/repo/components/repo_tabs.vue
@@ -1,15 +1,15 @@
 <script>
-  import Store from '../stores/repo_store';
+  import { mapState } from 'vuex';
   import RepoTab from './repo_tab.vue';
-  import RepoMixin from '../mixins/repo_mixin';
 
   export default {
-    mixins: [RepoMixin],
     components: {
       'repo-tab': RepoTab,
     },
-    data() {
-      return Store;
+    computed: {
+      ...mapState([
+        'openFiles',
+      ]),
     },
   };
 </script>
@@ -20,7 +20,7 @@
     class="list-unstyled"
   >
     <repo-tab
-      v-for="tab in openedFiles"
+      v-for="tab in openFiles"
       :key="tab.id"
       :tab="tab"
     />
diff --git a/app/assets/javascripts/repo/helpers/monaco_loader_helper.js b/app/assets/javascripts/repo/helpers/monaco_loader_helper.js
index f8729bbf585..4d5ff92fbea 100644
--- a/app/assets/javascripts/repo/helpers/monaco_loader_helper.js
+++ b/app/assets/javascripts/repo/helpers/monaco_loader_helper.js
@@ -1,18 +1,14 @@
 /* global monaco */
 import RepoEditor from '../components/repo_editor.vue';
-import Store from '../stores/repo_store';
 import Helper from '../helpers/repo_helper';
 import monacoLoader from '../monaco_loader';
 
 function repoEditorLoader() {
-  Store.monacoLoading = true;
   return new Promise((resolve, reject) => {
     monacoLoader(['vs/editor/editor.main'], () => {
       Helper.monaco = monaco;
-      Store.monacoLoading = false;
       resolve(RepoEditor);
     }, () => {
-      Store.monacoLoading = false;
       reject();
     });
   });
diff --git a/app/assets/javascripts/repo/index.js b/app/assets/javascripts/repo/index.js
index 72fc5a70648..475d53e5765 100644
--- a/app/assets/javascripts/repo/index.js
+++ b/app/assets/javascripts/repo/index.js
@@ -1,5 +1,5 @@
-import $ from 'jquery';
 import Vue from 'vue';
+import { mapActions } from 'vuex';
 import { convertPermissionToBoolean } from '../lib/utils/common_utils';
 import Service from './services/repo_service';
 import Store from './stores/repo_store';
@@ -7,27 +7,11 @@ import Repo from './components/repo.vue';
 import RepoEditButton from './components/repo_edit_button.vue';
 import newBranchForm from './components/new_branch_form.vue';
 import newDropdown from './components/new_dropdown/index.vue';
+import vStore from './stores';
 import Translate from '../vue_shared/translate';
 
-function initDropdowns() {
-  $('.js-tree-ref-target-holder').hide();
-}
-
-function addEventsForNonVueEls() {
-  window.onbeforeunload = function confirmUnload(e) {
-    const hasChanged = Store.openedFiles
-      .some(file => file.changed);
-    if (!hasChanged) return undefined;
-    const event = e || window.event;
-    if (event) event.returnValue = 'Are you sure you want to lose unsaved changes?';
-    // For Safari
-    return 'Are you sure you want to lose unsaved changes?';
-  };
-}
-
 function setInitialStore(data) {
   Store.service = Service;
-  Store.service.url = data.url;
   Store.service.refsUrl = data.refsUrl;
   Store.path = data.currentPath;
   Store.projectId = data.projectId;
@@ -47,9 +31,37 @@ function setInitialStore(data) {
 function initRepo(el) {
   return new Vue({
     el,
+    store: vStore,
     components: {
       repo: Repo,
     },
+    methods: {
+      ...mapActions([
+        'setInitialData',
+      ]),
+    },
+    created() {
+      const data = el.dataset;
+
+      this.setInitialData({
+        project: {
+          id: data.projectId,
+          name: data.projectName,
+        },
+        endpoints: {
+          rootEndpoint: data.url,
+          newMergeRequestUrl: data.newMergeRequestUrl,
+          rootUrl: data.rootUrl,
+        },
+        canCommit: convertPermissionToBoolean(data.canCommit),
+        onTopOfBranch: convertPermissionToBoolean(data.onTopOfBranch),
+        currentRef: data.ref,
+        // TODO: get through data attribute
+        currentBranch: document.querySelector('.js-project-refs-dropdown').dataset.ref,
+        isRoot: convertPermissionToBoolean(data.root),
+        isInitialRoot: convertPermissionToBoolean(data.root),
+      });
+    },
     render(createElement) {
       return createElement('repo');
     },
@@ -59,6 +71,7 @@ function initRepo(el) {
 function initRepoEditButton(el) {
   return new Vue({
     el,
+    store: vStore,
     components: {
       repoEditButton: RepoEditButton,
     },
@@ -87,32 +100,21 @@ function initNewBranchForm() {
     components: {
       newBranchForm,
     },
+    store: vStore,
     render(createElement) {
-      return createElement('new-branch-form', {
-        props: {
-          currentBranch: Store.currentBranch,
-        },
-      });
+      return createElement('new-branch-form');
     },
   });
 }
 
-function initRepoBundle() {
-  const repo = document.getElementById('repo');
-  const editButton = document.querySelector('.editable-mode');
-  const newDropdownHolder = document.querySelector('.js-new-dropdown');
-  setInitialStore(repo.dataset);
-  addEventsForNonVueEls();
-  initDropdowns();
-
-  Vue.use(Translate);
-
-  initRepo(repo);
-  initRepoEditButton(editButton);
-  initNewBranchForm();
-  initNewDropdown(newDropdownHolder);
-}
+const repo = document.getElementById('repo');
+const editButton = document.querySelector('.editable-mode');
+const newDropdownHolder = document.querySelector('.js-new-dropdown');
+setInitialStore(repo.dataset);
 
-$(initRepoBundle);
+Vue.use(Translate);
 
-export default initRepoBundle;
+initRepo(repo);
+initRepoEditButton(editButton);
+initNewBranchForm();
+initNewDropdown(newDropdownHolder);
diff --git a/app/assets/javascripts/repo/mixins/repo_mixin.js b/app/assets/javascripts/repo/mixins/repo_mixin.js
deleted file mode 100644
index efeda426b96..00000000000
--- a/app/assets/javascripts/repo/mixins/repo_mixin.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import Store from '../stores/repo_store';
-
-const RepoMixin = {
-  computed: {
-    isMini() {
-      return !!Store.openedFiles.length;
-    },
-
-    changedFiles() {
-      const changedFileList = this.openedFiles
-        .filter(file => file.changed || file.tempFile);
-      return changedFileList;
-    },
-  },
-};
-
-export default RepoMixin;
diff --git a/app/assets/javascripts/repo/services/index.js b/app/assets/javascripts/repo/services/index.js
new file mode 100644
index 00000000000..57c234cd4c9
--- /dev/null
+++ b/app/assets/javascripts/repo/services/index.js
@@ -0,0 +1,28 @@
+import Vue from 'vue';
+import VueResource from 'vue-resource';
+import Api from '../../api';
+
+Vue.use(VueResource);
+
+export default {
+  getTreeData(endpoint) {
+    return Vue.http.get(endpoint, { params: { format: 'json' } });
+  },
+  getFileData(endpoint) {
+    return Vue.http.get(endpoint, { params: { format: 'json' } });
+  },
+  getRawFileData(endpoint) {
+    return Vue.http.get(endpoint);
+  },
+  getBranchData(projectId, currentBranch) {
+    return Api.branchSingle(projectId, currentBranch);
+  },
+  createBranch(projectId, payload) {
+    const url = Api.buildUrl(Api.createBranchPath).replace(':id', projectId);
+
+    return Vue.http.post(url, payload);
+  },
+  commit(projectId, payload) {
+    return Api.commitMultiple(projectId, payload);
+  },
+};
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
new file mode 100644
index 00000000000..c0b5ce47398
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -0,0 +1,94 @@
+import flash from '../../flash';
+import service from '../services';
+import * as types from './mutation_types';
+import * as getters from './getters';
+import { visitUrl } from '../../lib/utils/url_utility';
+
+export const redirectToUrl = url => visitUrl(url);
+
+export const setInitialData = ({ commit }, data) => commit(types.SET_INITIAL_DATA, data);
+
+export const closeDiscardPopup = ({ commit }) => commit(types.TOGGLE_DISCARD_POPUP, false);
+
+export const discardAllChanges = ({ commit, state }) => {
+  const changedFiles = getters.changedFiles(state);
+
+  changedFiles.forEach(file => commit(types.DISCARD_FILE_CHANGES, file));
+};
+
+export const closeAllFiles = ({ state, dispatch }) => {
+  state.openFiles.forEach(file => dispatch('closeFile', file));
+};
+
+export const toggleEditMode = ({ commit, state, dispatch }, force = false) => {
+  const changedFiles = getters.changedFiles(state);
+
+  if (changedFiles.length && !force) {
+    commit(types.TOGGLE_DISCARD_POPUP, true);
+  } else {
+    commit(types.TOGGLE_EDIT_MODE);
+    commit(types.TOGGLE_DISCARD_POPUP, false);
+    dispatch('toggleBlobView');
+    dispatch('discardAllChanges');
+  }
+};
+
+export const toggleBlobView = ({ commit, state }) => {
+  if (state.editMode) {
+    commit(types.SET_EDIT_MODE);
+  } else {
+    commit(types.SET_PREVIEW_MODE);
+  }
+};
+
+export const checkCommitStatus = ({ state }) => service.getBranchData(
+  state.project.id,
+  state.currentBranch,
+)
+  .then((data) => {
+    const { id } = data.commit;
+
+    if (state.currentRef !== id) {
+      return true;
+    }
+
+    return false;
+  })
+  .catch(() => flash('Error checking branch data. Please try again.'));
+
+export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =>
+  service.commit(state.project.id, payload)
+  .then((data) => {
+    if (!data.short_id) {
+      flash(data.message);
+      return;
+    }
+
+    flash(`Your changes have been committed. Commit ${data.short_id} with ${data.stats.additions} additions, ${data.stats.deletions} deletions.`, 'notice');
+
+    if (newMr) {
+      redirectToUrl(`${state.endpoints.newMergeRequestUrl}${payload.branch}`);
+    } else {
+      // TODO: push a new state with the branch name
+      commit(types.SET_COMMIT_REF, data.id);
+      dispatch('discardAllChanges');
+      dispatch('closeAllFiles');
+      dispatch('toggleEditMode');
+    }
+  })
+  .catch(() => flash('Error committing changes. Please try again.'));
+
+export const popHistoryState = ({ state, dispatch }) => {
+  const treeList = getters.treeList(state);
+  const tree = treeList.find(file => file.url === state.previousUrl);
+
+  if (!tree) return;
+
+  if (tree.type === 'tree') {
+    dispatch('toggleTreeOpen', { endpoint: tree.url, tree });
+  }
+};
+
+export * from './actions/tree';
+export * from './actions/file';
+export * from './actions/branch';
diff --git a/app/assets/javascripts/repo/stores/actions/branch.js b/app/assets/javascripts/repo/stores/actions/branch.js
new file mode 100644
index 00000000000..b81a70dfd1e
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/actions/branch.js
@@ -0,0 +1,20 @@
+import service from '../../services';
+import * as types from '../mutation_types';
+import { pushState } from '../utils';
+
+// eslint-disable-next-line import/prefer-default-export
+export const createNewBranch = ({ rootState, commit }, branch) => service.createBranch(
+  rootState.project.id,
+  {
+    branch,
+    ref: rootState.currentBranch,
+  },
+).then(res => res.json())
+.then((data) => {
+  const branchName = data.name;
+  const url = location.href.replace(rootState.currentBranch, branchName);
+
+  pushState(url);
+
+  commit(types.SET_CURRENT_BRANCH, branchName);
+});
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
new file mode 100644
index 00000000000..887eecf83f8
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -0,0 +1,50 @@
+import flash from '../../../flash';
+import service from '../../services';
+import * as types from '../mutation_types';
+import { activeFile } from '../getters';
+
+export const closeFile = ({ commit }, file) => {
+  if (file.changed || file.tempFile) return;
+
+  commit(types.TOGGLE_FILE_OPEN, file);
+  commit(types.SET_FILE_ACTIVE, { file, active: false });
+};
+
+export const setFileActive = ({ commit, state }, file) => {
+  const currentActiveFile = activeFile(state);
+
+  if (currentActiveFile) {
+    commit(types.SET_FILE_ACTIVE, { file: currentActiveFile, active: false });
+  }
+
+  commit(types.SET_FILE_ACTIVE, { file, active: true });
+};
+
+export const getFileData = ({ commit, dispatch }, file) => {
+  commit(types.TOGGLE_LOADING, file);
+
+  service.getFileData(file.url)
+    .then(res => res.json())
+    .then((data) => {
+      commit(types.SET_FILE_DATA, { data, file });
+      commit(types.SET_PREVIEW_MODE);
+      commit(types.TOGGLE_FILE_OPEN, file);
+      dispatch('setFileActive', file);
+      commit(types.TOGGLE_LOADING, file);
+    })
+    .catch(() => {
+      commit(types.TOGGLE_LOADING, file);
+      flash('Error loading file data. Please try again.');
+    });
+};
+
+export const getRawFileData = ({ commit, dispatch }, file) => service.getRawFileData(file.rawPath)
+  .then(res => res.text())
+  .then((raw) => {
+    commit(types.SET_FILE_RAW_DATA, { file, raw });
+  })
+  .catch(() => flash('Error loading file content. Please try again.'));
+
+export const changeFileContent = ({ commit }, { file, content }) => {
+  commit(types.UPDATE_FILE_CONTENT, { file, content });
+};
diff --git a/app/assets/javascripts/repo/stores/actions/tree.js b/app/assets/javascripts/repo/stores/actions/tree.js
new file mode 100644
index 00000000000..8869bb8da2a
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/actions/tree.js
@@ -0,0 +1,70 @@
+import { normalizeHeaders } from '../../../lib/utils/common_utils';
+import flash from '../../../flash';
+import service from '../../services';
+import * as types from '../mutation_types';
+import { pushState, setPageTitle } from '../utils';
+
+export const getTreeData = (
+  { commit, state },
+  { endpoint = state.endpoints.rootEndpoint, tree = state } = {},
+) => {
+  commit(types.TOGGLE_LOADING, tree);
+
+  service.getTreeData(endpoint)
+    .then((res) => {
+      const pageTitle = decodeURI(normalizeHeaders(res.headers)['PAGE-TITLE']);
+
+      setPageTitle(pageTitle);
+
+      return res.json();
+    })
+    .then((data) => {
+      if (!state.isInitialRoot) {
+        commit(types.SET_ROOT, data.path === '/');
+      }
+
+      commit(types.SET_DIRECTORY_DATA, { data, tree });
+      commit(types.SET_PARENT_TREE_URL, data.parent_tree_url);
+      commit(types.TOGGLE_LOADING, tree);
+
+      pushState(endpoint);
+    })
+    .catch(() => {
+      flash('Error loading tree data. Please try again.');
+      commit(types.TOGGLE_LOADING, tree);
+    });
+};
+
+export const toggleTreeOpen = ({ commit, dispatch }, { endpoint, tree }) => {
+  if (tree.opened) {
+    // send empty data to clear the tree
+    const data = { trees: [], blobs: [], submodules: [] };
+
+    pushState(tree.parentTreeUrl);
+
+    commit(types.SET_PREVIOUS_URL, tree.parentTreeUrl);
+    commit(types.SET_DIRECTORY_DATA, { data, tree });
+  } else {
+    commit(types.SET_PREVIOUS_URL, endpoint);
+    dispatch('getTreeData', { endpoint, tree });
+  }
+
+  commit(types.TOGGLE_TREE_OPEN, tree);
+};
+
+export const clickedTreeRow = ({ commit, dispatch }, row) => {
+  if (row.type === 'tree') {
+    dispatch('toggleTreeOpen', {
+      endpoint: row.url,
+      tree: row,
+    });
+  } else if (row.type === 'submodule') {
+    commit(types.TOGGLE_LOADING, row);
+
+    gl.utils.visitUrl(row.url);
+  } else if (row.type === 'blob' && row.opened) {
+    dispatch('setFileActive', row);
+  } else {
+    dispatch('getFileData', row);
+  }
+};
diff --git a/app/assets/javascripts/repo/stores/getters.js b/app/assets/javascripts/repo/stores/getters.js
new file mode 100644
index 00000000000..9fa593a82da
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/getters.js
@@ -0,0 +1,39 @@
+import _ from 'underscore';
+
+export const treeList = (state) => {
+  const mapTree = arr => (!arr.tree.length ? [] : _.map(arr.tree, a => [a, mapTree(a)]));
+
+  return _.chain(state.tree)
+    .map(arr => [arr, mapTree(arr)])
+    .flatten()
+    .value();
+};
+
+export const changedFiles = (state) => {
+  const files = state.openFiles;
+
+  return files.filter(file => file.changed);
+};
+
+export const activeFile = (state) => {
+  const openedFiles = state.openFiles;
+
+  return openedFiles.find(file => file.active);
+};
+
+export const activeFileExtension = (state) => {
+  const file = activeFile(state);
+  return file ? `.${file.path.split('.').pop()}` : '';
+};
+
+export const isMini = state => !!state.openFiles.length;
+
+export const canEditFile = (state) => {
+  const currentActiveFile = activeFile(state);
+  const openedFiles = state.openFiles;
+
+  return state.canCommit &&
+    state.onTopOfBranch &&
+    openedFiles.length &&
+    (currentActiveFile && !currentActiveFile.render_error && !currentActiveFile.binary);
+};
diff --git a/app/assets/javascripts/repo/stores/index.js b/app/assets/javascripts/repo/stores/index.js
new file mode 100644
index 00000000000..f8565fb244c
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/index.js
@@ -0,0 +1,15 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import state from './state';
+import * as actions from './actions';
+import * as getters from './getters';
+import mutations from './mutations';
+
+Vue.use(Vuex);
+
+export default new Vuex.Store({
+  state,
+  actions,
+  mutations,
+  getters,
+});
diff --git a/app/assets/javascripts/repo/stores/mutation_types.js b/app/assets/javascripts/repo/stores/mutation_types.js
new file mode 100644
index 00000000000..c6d0816080c
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/mutation_types.js
@@ -0,0 +1,26 @@
+export const SET_INITIAL_DATA = 'SET_INITIAL_DATA';
+export const TOGGLE_LOADING = 'TOGGLE_LOADING';
+export const SET_COMMIT_REF = 'SET_COMMIT_REF';
+export const SET_PARENT_TREE_URL = 'SET_PARENT_TREE_URL';
+export const SET_ROOT = 'SET_ROOT';
+export const SET_PREVIOUS_URL = 'SET_PREVIOUS_URL';
+
+// Tree mutation types
+export const SET_DIRECTORY_DATA = 'SET_DIRECTORY_DATA';
+export const TOGGLE_TREE_OPEN = 'TOGGLE_TREE_OPEN';
+
+// File mutation types
+export const SET_FILE_DATA = 'SET_FILE_DATA';
+export const TOGGLE_FILE_OPEN = 'TOGGLE_FILE_OPEN';
+export const SET_FILE_ACTIVE = 'SET_FILE_ACTIVE';
+export const SET_FILE_RAW_DATA = 'SET_FILE_RAW_DATA';
+export const UPDATE_FILE_CONTENT = 'UPDATE_FILE_CONTENT';
+export const DISCARD_FILE_CHANGES = 'DISCARD_FILE_CHANGES';
+
+// Viewer mutation types
+export const SET_PREVIEW_MODE = 'SET_PREVIEW_MODE';
+export const SET_EDIT_MODE = 'SET_EDIT_MODE';
+export const TOGGLE_EDIT_MODE = 'TOGGLE_EDIT_MODE';
+export const TOGGLE_DISCARD_POPUP = 'TOGGLE_DISCARD_POPUP';
+
+export const SET_CURRENT_BRANCH = 'SET_CURRENT_BRANCH';
diff --git a/app/assets/javascripts/repo/stores/mutations.js b/app/assets/javascripts/repo/stores/mutations.js
new file mode 100644
index 00000000000..2f9b038322b
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/mutations.js
@@ -0,0 +1,54 @@
+import * as types from './mutation_types';
+import fileMutations from './mutations/file';
+import treeMutations from './mutations/tree';
+import branchMutations from './mutations/branch';
+
+export default {
+  [types.SET_INITIAL_DATA](state, data) {
+    Object.assign(state, data);
+  },
+  [types.SET_PREVIEW_MODE](state) {
+    Object.assign(state, {
+      currentBlobView: 'repo-preview',
+    });
+  },
+  [types.SET_EDIT_MODE](state) {
+    Object.assign(state, {
+      currentBlobView: 'repo-editor',
+    });
+  },
+  [types.TOGGLE_LOADING](state, entry) {
+    Object.assign(entry, {
+      loading: !entry.loading,
+    });
+  },
+  [types.TOGGLE_EDIT_MODE](state) {
+    Object.assign(state, {
+      editMode: !state.editMode,
+    });
+  },
+  [types.TOGGLE_DISCARD_POPUP](state, discardPopupOpen) {
+    Object.assign(state, {
+      discardPopupOpen,
+    });
+  },
+  [types.SET_COMMIT_REF](state, ref) {
+    Object.assign(state, {
+      currentRef: ref,
+    });
+  },
+  [types.SET_ROOT](state, isRoot) {
+    Object.assign(state, {
+      isRoot,
+      isInitialRoot: isRoot,
+    });
+  },
+  [types.SET_PREVIOUS_URL](state, previousUrl) {
+    Object.assign(state, {
+      previousUrl,
+    });
+  },
+  ...fileMutations,
+  ...treeMutations,
+  ...branchMutations,
+};
diff --git a/app/assets/javascripts/repo/stores/mutations/branch.js b/app/assets/javascripts/repo/stores/mutations/branch.js
new file mode 100644
index 00000000000..d8229e8a620
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/mutations/branch.js
@@ -0,0 +1,9 @@
+import * as types from '../mutation_types';
+
+export default {
+  [types.SET_CURRENT_BRANCH](state, currentBranch) {
+    Object.assign(state, {
+      currentBranch,
+    });
+  },
+};
diff --git a/app/assets/javascripts/repo/stores/mutations/file.js b/app/assets/javascripts/repo/stores/mutations/file.js
new file mode 100644
index 00000000000..50d8a51d9b7
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/mutations/file.js
@@ -0,0 +1,50 @@
+import * as types from '../mutation_types';
+import { findIndexOfFile } from '../utils';
+
+export default {
+  [types.SET_FILE_ACTIVE](state, { file, active }) {
+    Object.assign(file, {
+      active,
+    });
+  },
+  [types.TOGGLE_FILE_OPEN](state, file) {
+    Object.assign(file, {
+      opened: !file.opened,
+    });
+
+    if (file.opened) {
+      state.openFiles.push(file);
+    } else {
+      state.openFiles.splice(findIndexOfFile(state.openFiles, file), 1);
+    }
+  },
+  [types.SET_FILE_DATA](state, { data, file }) {
+    Object.assign(file, {
+      blamePath: data.blame_path,
+      commitsPath: data.commits_path,
+      permalink: data.permalink,
+      rawPath: data.raw_path,
+      binary: data.binary,
+      html: data.html,
+    });
+  },
+  [types.SET_FILE_RAW_DATA](state, { file, raw }) {
+    Object.assign(file, {
+      raw,
+    });
+  },
+  [types.UPDATE_FILE_CONTENT](state, { file, content }) {
+    const changed = content !== file.raw;
+
+    Object.assign(file, {
+      content,
+      changed,
+    });
+  },
+  [types.DISCARD_FILE_CHANGES](state, file) {
+    Object.assign(file, {
+      content: '',
+      changed: false,
+    });
+  },
+};
diff --git a/app/assets/javascripts/repo/stores/mutations/tree.js b/app/assets/javascripts/repo/stores/mutations/tree.js
new file mode 100644
index 00000000000..700aff46827
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/mutations/tree.js
@@ -0,0 +1,27 @@
+import * as types from '../mutation_types';
+import * as utils from '../utils';
+
+export default {
+  [types.TOGGLE_TREE_OPEN](state, tree) {
+    Object.assign(tree, {
+      opened: !tree.opened,
+    });
+  },
+  [types.SET_DIRECTORY_DATA](state, { data, tree }) {
+    const level = tree.level !== undefined ? tree.level + 1 : 0;
+    const parentTreeUrl = data.parent_tree_url ? `${data.parent_tree_url}${data.path}` : state.endpoints.rootUrl;
+
+    Object.assign(tree, {
+      tree: [
+        ...data.trees.map(t => utils.decorateData(t, 'tree', parentTreeUrl, level)),
+        ...data.submodules.map(m => utils.decorateData(m, 'submodule', parentTreeUrl, level)),
+        ...data.blobs.map(b => utils.decorateData(b, 'blob', parentTreeUrl, level)),
+      ],
+    });
+  },
+  [types.SET_PARENT_TREE_URL](state, url) {
+    Object.assign(state, {
+      parentTreeUrl: url,
+    });
+  },
+};
diff --git a/app/assets/javascripts/repo/stores/repo_store.js b/app/assets/javascripts/repo/stores/repo_store.js
index 38df1e3e0d2..b68e2289319 100644
--- a/app/assets/javascripts/repo/stores/repo_store.js
+++ b/app/assets/javascripts/repo/stores/repo_store.js
@@ -7,15 +7,12 @@ const RepoStore = {
   canCommit: false,
   onTopOfBranch: false,
   editMode: false,
-  isRoot: null,
-  isInitialRoot: null,
   prevURL: '',
   projectId: '',
   projectName: '',
   projectUrl: '',
   branchUrl: '',
   blobRaw: '',
-  currentBlobView: 'repo-preview',
   openedFiles: [],
   submitCommitsLoading: false,
   dialog: {
@@ -40,10 +37,6 @@ const RepoStore = {
   branchChanged: false,
   commitMessage: '',
   path: '',
-  loading: {
-    tree: false,
-    blob: false,
-  },
 
   setBranchHash() {
     return Service.getBranch()
diff --git a/app/assets/javascripts/repo/stores/state.js b/app/assets/javascripts/repo/stores/state.js
new file mode 100644
index 00000000000..6cf7565c955
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/state.js
@@ -0,0 +1,21 @@
+export default {
+  project: {
+    id: 0,
+    name: '',
+  },
+  currentBranch: '',
+  endpoints: {},
+  isRoot: false,
+  isInitialRoot: false,
+  currentRef: '',
+  canCommit: false,
+  onTopOfBranch: false,
+  editMode: false,
+  loading: false,
+  currentBlobView: '',
+  discardPopupOpen: false,
+  tree: [],
+  openFiles: [],
+  parentTreeUrl: '',
+  previousUrl: '',
+};
diff --git a/app/assets/javascripts/repo/stores/utils.js b/app/assets/javascripts/repo/stores/utils.js
new file mode 100644
index 00000000000..ec733200552
--- /dev/null
+++ b/app/assets/javascripts/repo/stores/utils.js
@@ -0,0 +1,73 @@
+export const dataStructure = ({
+  id: '',
+  type: '',
+  name: '',
+  url: '',
+  path: '',
+  level: 0,
+  tempFile: false,
+  icon: '',
+  tree: [],
+  loading: false,
+  opened: false,
+  active: false,
+  changed: false,
+  lastCommit: {},
+  tree_url: '',
+  blamePath: '',
+  commitsPath: '',
+  permalink: '',
+  rawPath: '',
+  binary: false,
+  html: '',
+  raw: '',
+  content: '',
+  parentTreeUrl: '',
+});
+
+export const decorateData = (entity, type, parentTreeUrl = '', level = 0) => {
+  const {
+    id,
+    url,
+    name,
+    icon,
+    last_commit,
+    tree_url,
+    path,
+    tempFile,
+    active = false,
+    opened = false,
+  } = entity;
+
+  return {
+    ...dataStructure,
+    id,
+    type,
+    name,
+    url,
+    tree_url,
+    path,
+    level,
+    tempFile,
+    icon: `fa-${icon}`,
+    opened,
+    active,
+    parentTreeUrl,
+    // eslint-disable-next-line camelcase
+    lastCommit: last_commit ? {
+      // url: `${Store.projectUrl}/commit/${last_commit.id}`,
+      message: last_commit.message,
+      updatedAt: last_commit.committed_date,
+    } : {},
+  };
+};
+
+export const findIndexOfFile = (state, file) => state.findIndex(f => f.path === file.path);
+
+export const setPageTitle = (title) => {
+  document.title = title;
+};
+
+export const pushState = (url) => {
+  history.pushState({ url }, '', url);
+};
diff --git a/app/views/shared/repo/_repo.html.haml b/app/views/shared/repo/_repo.html.haml
index 7861f92b33f..8057d5295b9 100644
--- a/app/views/shared/repo/_repo.html.haml
+++ b/app/views/shared/repo/_repo.html.haml
@@ -1,11 +1,13 @@
 #repo{ data: { root: @path.empty?.to_s,
+               root_url: project_tree_path(@project),
                url: content_url,
+               ref: @commit.id,
                project_name: project.name,
                refs_url: refs_project_path(project, format: :json),
                project_url: project_path(project),
                project_id: project.id,
                blob_url: namespace_project_blob_path(project.namespace, project, '{{branch}}'),
-               new_mr_template_url: namespace_project_new_merge_request_path(project.namespace, project, merge_request: { source_branch: '{{source_branch}}' }),
+               new_merge_request_url: namespace_project_new_merge_request_path(project.namespace, project, merge_request: { source_branch: '' }),
                can_commit: (!!can_push_branch?(project, @ref)).to_s,
                on_top_of_branch: (!!on_top_of_branch?(project, @ref)).to_s,
                current_path: @path } }
-- 
cgit v1.2.1


From 6e2b842202ff7dfc7b2d249b5d0ca4d064caa3f2 Mon Sep 17 00:00:00 2001
From: Andrew Newdigate <andrew@gitlab.com>
Date: Thu, 26 Oct 2017 12:39:43 +0100
Subject: Upgrade Gitaly to v0.50.0

---
 GITALY_SERVER_VERSION | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/GITALY_SERVER_VERSION b/GITALY_SERVER_VERSION
index fbaaafa001b..564edf82ddf 100644
--- a/GITALY_SERVER_VERSION
+++ b/GITALY_SERVER_VERSION
@@ -1 +1 @@
-0.49.0
\ No newline at end of file
+0.50.0
-- 
cgit v1.2.1


From b4f7496b1c82f54e0fd94d0335526e37a0a20996 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Thu, 26 Oct 2017 15:12:34 +0100
Subject: moved new file/directory into new store removed old store, helper &
 monaco loader moved monaco loader into editor component because it is the
 only component that requires monaco

[ci skip]
---
 .../repo/components/new_dropdown/index.vue         |  21 +-
 .../repo/components/new_dropdown/modal.vue         |  12 +-
 app/assets/javascripts/repo/components/repo.vue    |   4 +-
 .../javascripts/repo/components/repo_editor.vue    |  18 +-
 app/assets/javascripts/repo/event_hub.js           |   3 -
 .../repo/helpers/monaco_loader_helper.js           |  21 --
 app/assets/javascripts/repo/helpers/repo_helper.js | 317 ---------------------
 app/assets/javascripts/repo/index.js               |  24 +-
 app/assets/javascripts/repo/services/index.js      |   9 +-
 .../javascripts/repo/services/repo_service.js      | 101 -------
 app/assets/javascripts/repo/stores/actions.js      |  24 +-
 app/assets/javascripts/repo/stores/actions/file.js |  27 +-
 app/assets/javascripts/repo/stores/actions/tree.js |  39 ++-
 .../javascripts/repo/stores/mutation_types.js      |   2 +
 .../javascripts/repo/stores/mutations/file.js      |   3 +
 .../javascripts/repo/stores/mutations/tree.js      |  24 +-
 app/assets/javascripts/repo/stores/repo_store.js   | 182 ------------
 app/assets/javascripts/repo/stores/state.js        |   4 +-
 app/assets/javascripts/repo/stores/utils.js        |  33 ++-
 19 files changed, 176 insertions(+), 692 deletions(-)
 delete mode 100644 app/assets/javascripts/repo/event_hub.js
 delete mode 100644 app/assets/javascripts/repo/helpers/monaco_loader_helper.js
 delete mode 100644 app/assets/javascripts/repo/helpers/repo_helper.js
 delete mode 100644 app/assets/javascripts/repo/services/repo_service.js
 delete mode 100644 app/assets/javascripts/repo/stores/repo_store.js

diff --git a/app/assets/javascripts/repo/components/new_dropdown/index.vue b/app/assets/javascripts/repo/components/new_dropdown/index.vue
index 3ccb50213ab..96b2087e1b9 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/index.vue
@@ -1,7 +1,5 @@
 <script>
-  import RepoStore from '../../stores/repo_store';
-  import RepoHelper from '../../helpers/repo_helper';
-  import eventHub from '../../event_hub';
+  import { mapState } from 'vuex';
   import newModal from './modal.vue';
 
   export default {
@@ -12,9 +10,13 @@
       return {
         openModal: false,
         modalType: '',
-        currentPath: RepoStore.path,
       };
     },
+    computed: {
+      ...mapState({
+        currentPath: 'path',
+      }),
+    },
     methods: {
       createNewItem(type) {
         this.modalType = type;
@@ -23,17 +25,6 @@
       toggleModalOpen() {
         this.openModal = !this.openModal;
       },
-      createNewEntryInStore(name, type) {
-        RepoHelper.createNewEntry(name, type);
-
-        this.toggleModalOpen();
-      },
-    },
-    created() {
-      eventHub.$on('createNewEntry', this.createNewEntryInStore);
-    },
-    beforeDestroy() {
-      eventHub.$off('createNewEntry', this.createNewEntryInStore);
     },
   };
 </script>
diff --git a/app/assets/javascripts/repo/components/new_dropdown/modal.vue b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
index 5ef629e0dde..e3496f26b8b 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/modal.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
@@ -1,7 +1,7 @@
 <script>
+  import { mapActions } from 'vuex';
   import { __ } from '../../../locale';
   import popupDialog from '../../../vue_shared/components/popup_dialog.vue';
-  import eventHub from '../../event_hub';
 
   export default {
     props: {
@@ -23,8 +23,16 @@
       popupDialog,
     },
     methods: {
+      ...mapActions([
+        'createTempEntry',
+      ]),
       createEntryInStore() {
-        eventHub.$emit('createNewEntry', this.entryName, this.type);
+        this.createTempEntry({
+          name: this.entryName,
+          type: this.type,
+        });
+
+        this.toggleModalOpen();
       },
       toggleModalOpen() {
         this.$emit('toggle');
diff --git a/app/assets/javascripts/repo/components/repo.vue b/app/assets/javascripts/repo/components/repo.vue
index 0bc5271f95c..e072af5c151 100644
--- a/app/assets/javascripts/repo/components/repo.vue
+++ b/app/assets/javascripts/repo/components/repo.vue
@@ -5,7 +5,7 @@ import RepoCommitSection from './repo_commit_section.vue';
 import RepoTabs from './repo_tabs.vue';
 import RepoFileButtons from './repo_file_buttons.vue';
 import RepoPreview from './repo_preview.vue';
-import MonacoLoaderHelper from '../helpers/monaco_loader_helper';
+import repoEditor from './repo_editor.vue';
 
 export default {
   computed: {
@@ -22,7 +22,7 @@ export default {
     RepoSidebar,
     RepoTabs,
     RepoFileButtons,
-    'repo-editor': MonacoLoaderHelper.repoEditorLoader,
+    repoEditor,
     RepoCommitSection,
     RepoPreview,
   },
diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue
index 06ded6332e1..0714ba90b6f 100644
--- a/app/assets/javascripts/repo/components/repo_editor.vue
+++ b/app/assets/javascripts/repo/components/repo_editor.vue
@@ -1,8 +1,8 @@
 <script>
 /* global monaco */
 import { mapGetters, mapActions } from 'vuex';
-import Helper from '../helpers/repo_helper';
 import flash from '../../flash';
+import monacoLoader from '../monaco_loader';
 
 export default {
   destroyed() {
@@ -11,7 +11,15 @@ export default {
     }
   },
   mounted() {
-    this.initMonaco();
+    if (this.monaco) {
+      this.initMonaco();
+    } else {
+      monacoLoader(['vs/editor/editor.main'], () => {
+        this.monaco = monaco;
+
+        this.initMonaco();
+      });
+    }
   },
   methods: {
     ...mapActions([
@@ -26,14 +34,14 @@ export default {
       this.getRawFileData(this.activeFile)
         .then(() => {
           if (!this.monacoInstance) {
-            this.monacoInstance = Helper.monaco.editor.create(this.$el, {
+            this.monacoInstance = this.monaco.editor.create(this.$el, {
               model: null,
               readOnly: false,
               contextmenu: true,
               scrollBeyondLastLine: false,
             });
 
-            this.languages = Helper.monaco.languages.getLanguages();
+            this.languages = this.monaco.languages.getLanguages();
 
             this.addMonacoEvents();
           }
@@ -46,7 +54,7 @@ export default {
       const foundLang = this.languages.find(lang =>
         lang.extensions && lang.extensions.indexOf(this.activeFileExtension) === 0,
       );
-      const newModel = Helper.monaco.editor.createModel(
+      const newModel = this.monaco.editor.createModel(
         this.activeFile.raw, foundLang ? foundLang.id : 'plaintext',
       );
 
diff --git a/app/assets/javascripts/repo/event_hub.js b/app/assets/javascripts/repo/event_hub.js
deleted file mode 100644
index 0948c2e5352..00000000000
--- a/app/assets/javascripts/repo/event_hub.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import Vue from 'vue';
-
-export default new Vue();
diff --git a/app/assets/javascripts/repo/helpers/monaco_loader_helper.js b/app/assets/javascripts/repo/helpers/monaco_loader_helper.js
deleted file mode 100644
index 4d5ff92fbea..00000000000
--- a/app/assets/javascripts/repo/helpers/monaco_loader_helper.js
+++ /dev/null
@@ -1,21 +0,0 @@
-/* global monaco */
-import RepoEditor from '../components/repo_editor.vue';
-import Helper from '../helpers/repo_helper';
-import monacoLoader from '../monaco_loader';
-
-function repoEditorLoader() {
-  return new Promise((resolve, reject) => {
-    monacoLoader(['vs/editor/editor.main'], () => {
-      Helper.monaco = monaco;
-      resolve(RepoEditor);
-    }, () => {
-      reject();
-    });
-  });
-}
-
-const MonacoLoaderHelper = {
-  repoEditorLoader,
-};
-
-export default MonacoLoaderHelper;
diff --git a/app/assets/javascripts/repo/helpers/repo_helper.js b/app/assets/javascripts/repo/helpers/repo_helper.js
deleted file mode 100644
index fb26f3b7380..00000000000
--- a/app/assets/javascripts/repo/helpers/repo_helper.js
+++ /dev/null
@@ -1,317 +0,0 @@
-import Service from '../services/repo_service';
-import Store from '../stores/repo_store';
-import Flash from '../../flash';
-
-const RepoHelper = {
-  monacoInstance: null,
-
-  getDefaultActiveFile() {
-    return {
-      id: '',
-      active: true,
-      binary: false,
-      extension: '',
-      html: '',
-      mime_type: '',
-      name: '',
-      plain: '',
-      size: 0,
-      url: '',
-      raw: false,
-      newContent: '',
-      changed: false,
-      loading: false,
-    };
-  },
-
-  key: '',
-
-  Time: window.performance
-  && window.performance.now
-  ? window.performance
-  : Date,
-
-  getFileExtension(fileName) {
-    return fileName.split('.').pop();
-  },
-
-  getLanguageIDForFile(file, langs) {
-    const ext = RepoHelper.getFileExtension(file.name);
-    const foundLang = RepoHelper.findLanguage(ext, langs);
-
-    return foundLang ? foundLang.id : 'plaintext';
-  },
-
-  setMonacoModelFromLanguage() {
-    RepoHelper.monacoInstance.setModel(null);
-    const languages = RepoHelper.monaco.languages.getLanguages();
-    const languageID = RepoHelper.getLanguageIDForFile(Store.activeFile, languages);
-    const newModel = RepoHelper.monaco.editor.createModel(Store.blobRaw, languageID);
-    RepoHelper.monacoInstance.setModel(newModel);
-  },
-
-  findLanguage(ext, langs) {
-    return langs.find(lang => lang.extensions && lang.extensions.indexOf(`.${ext}`) > -1);
-  },
-
-  setDirectoryOpen(tree, title) {
-    if (!tree) return;
-
-    Object.assign(tree, {
-      opened: true,
-    });
-
-    RepoHelper.updateHistoryEntry(tree.url, title);
-    Store.path = tree.path;
-  },
-
-  setDirectoryToClosed(entry) {
-    Object.assign(entry, {
-      opened: false,
-      files: [],
-    });
-  },
-
-  isRenderable() {
-    const okExts = ['md', 'svg'];
-    return okExts.indexOf(Store.activeFile.extension) > -1;
-  },
-
-  setBinaryDataAsBase64(file) {
-    Service.getBase64Content(file.raw_path)
-    .then((response) => {
-      Store.blobRaw = response;
-      file.base64 = response; // eslint-disable-line no-param-reassign
-    })
-    .catch(RepoHelper.loadingError);
-  },
-
-  getContent(treeOrFile, emptyFiles = false) {
-    let file = treeOrFile;
-
-    if (!Store.files.length) {
-      Store.loading.tree = true;
-    }
-
-    return Service.getContent()
-    .then((response) => {
-      const data = response.data;
-      if (response.headers && response.headers['page-title']) data.pageTitle = decodeURI(response.headers['page-title']);
-      if (data.path && !Store.isInitialRoot) {
-        Store.isRoot = data.path === '/';
-        Store.isInitialRoot = Store.isRoot;
-      }
-
-      if (file && file.type === 'blob') {
-        if (!file) file = data;
-        Store.binary = data.binary;
-
-        if (data.binary) {
-          // file might be undefined
-          RepoHelper.setBinaryDataAsBase64(data);
-          Store.setViewToPreview();
-        } else if (!Store.isPreviewView() && !data.render_error) {
-          Service.getRaw(data)
-          .then((rawResponse) => {
-            Store.blobRaw = rawResponse.data;
-            data.plain = rawResponse.data;
-            RepoHelper.setFile(data, file);
-          }).catch(RepoHelper.loadingError);
-        }
-
-        if (Store.isPreviewView()) {
-          RepoHelper.setFile(data, file);
-        }
-      } else {
-        Store.loading.tree = false;
-        RepoHelper.setDirectoryOpen(file, data.pageTitle || data.name);
-
-        if (emptyFiles) {
-          Store.files = [];
-        }
-
-        this.addToDirectory(file, data);
-
-        Store.prevURL = Service.blobURLtoParentTree(Service.url);
-      }
-    }).catch(RepoHelper.loadingError);
-  },
-
-  addToDirectory(file, data) {
-    const tree = file || Store;
-
-    // TODO: Figure out why `popstate` is being trigger in the specs
-    if (!tree.files) return;
-
-    const files = tree.files.concat(this.dataToListOfFiles(data, file ? file.level + 1 : 0));
-
-    tree.files = files;
-  },
-
-  setFile(data, file) {
-    const newFile = data;
-    newFile.url = file.url || Service.url; // Grab the URL from service, happens on page refresh.
-
-    if (newFile.render_error === 'too_large' || newFile.render_error === 'collapsed') {
-      newFile.tooLarge = true;
-    }
-    newFile.newContent = '';
-
-    Store.addToOpenedFiles(newFile);
-    Store.setActiveFiles(newFile);
-  },
-
-  serializeRepoEntity(type, entity, level = 0) {
-    const {
-      id,
-      url,
-      name,
-      icon,
-      last_commit,
-      tree_url,
-      path,
-      tempFile,
-      active,
-      opened,
-    } = entity;
-
-    return {
-      id,
-      type,
-      name,
-      url,
-      tree_url,
-      path,
-      level,
-      tempFile,
-      icon: `fa-${icon}`,
-      files: [],
-      loading: false,
-      opened,
-      active,
-      // eslint-disable-next-line camelcase
-      lastCommit: last_commit ? {
-        url: `${Store.projectUrl}/commit/${last_commit.id}`,
-        message: last_commit.message,
-        updatedAt: last_commit.committed_date,
-      } : {},
-    };
-  },
-
-  scrollTabsRight() {
-    const tabs = document.getElementById('tabs');
-    if (!tabs) return;
-    tabs.scrollLeft = tabs.scrollWidth;
-  },
-
-  dataToListOfFiles(data, level) {
-    const { blobs, trees, submodules } = data;
-    return [
-      ...trees.map(tree => RepoHelper.serializeRepoEntity('tree', tree, level)),
-      ...submodules.map(submodule => RepoHelper.serializeRepoEntity('submodule', submodule, level)),
-      ...blobs.map(blob => RepoHelper.serializeRepoEntity('blob', blob, level)),
-    ];
-  },
-
-  genKey() {
-    return RepoHelper.Time.now().toFixed(3);
-  },
-
-  updateHistoryEntry(url, title) {
-    const history = window.history;
-
-    RepoHelper.key = RepoHelper.genKey();
-
-    if (document.location.pathname !== url) {
-      history.pushState({ key: RepoHelper.key }, '', url);
-    }
-
-    if (title) {
-      document.title = title;
-    }
-  },
-
-  findOpenedFileFromActive() {
-    return Store.openedFiles.find(openedFile => Store.activeFile.id === openedFile.id);
-  },
-
-  getFileFromPath(path) {
-    return Store.openedFiles.find(file => file.url === path);
-  },
-
-  loadingError() {
-    Flash('Unable to load this content at this time.');
-  },
-  openEditMode() {
-    Store.editMode = true;
-    Store.currentBlobView = 'repo-editor';
-  },
-  updateStorePath(path) {
-    Store.path = path;
-  },
-  findOrCreateEntry(type, tree, name) {
-    let exists = true;
-    let foundEntry = tree.files.find(dir => dir.type === type && dir.name === name);
-
-    if (!foundEntry) {
-      foundEntry = RepoHelper.serializeRepoEntity(type, {
-        id: name,
-        name,
-        path: tree.path ? `${tree.path}/${name}` : name,
-        icon: type === 'tree' ? 'folder' : 'file-text-o',
-        tempFile: true,
-        opened: true,
-        active: true,
-      }, tree.level !== undefined ? tree.level + 1 : 0);
-
-      exists = false;
-      tree.files.push(foundEntry);
-    }
-
-    return {
-      entry: foundEntry,
-      exists,
-    };
-  },
-  removeAllTmpFiles(storeFilesKey) {
-    Store[storeFilesKey] = Store[storeFilesKey].filter(f => !f.tempFile);
-  },
-  createNewEntry(name, type) {
-    const originalPath = Store.path;
-    let entryName = name;
-
-    if (entryName.indexOf(`${originalPath}/`) !== 0) {
-      this.updateStorePath('');
-    } else {
-      entryName = entryName.replace(`${originalPath}/`, '');
-    }
-
-    if (entryName === '') return;
-
-    const fileName = type === 'tree' ? '.gitkeep' : entryName;
-    let tree = Store;
-
-    if (type === 'tree') {
-      const dirNames = entryName.split('/');
-
-      dirNames.forEach((dirName) => {
-        if (dirName === '') return;
-
-        tree = this.findOrCreateEntry('tree', tree, dirName).entry;
-      });
-    }
-
-    if ((type === 'tree' && tree.tempFile) || type === 'blob') {
-      const file = this.findOrCreateEntry('blob', tree, fileName);
-
-      if (!file.exists) {
-        this.setFile(file.entry, file.entry);
-        this.openEditMode();
-      }
-    }
-
-    this.updateStorePath(originalPath);
-  },
-};
-
-export default RepoHelper;
diff --git a/app/assets/javascripts/repo/index.js b/app/assets/javascripts/repo/index.js
index 475d53e5765..8ca5bb45d05 100644
--- a/app/assets/javascripts/repo/index.js
+++ b/app/assets/javascripts/repo/index.js
@@ -1,8 +1,6 @@
 import Vue from 'vue';
 import { mapActions } from 'vuex';
 import { convertPermissionToBoolean } from '../lib/utils/common_utils';
-import Service from './services/repo_service';
-import Store from './stores/repo_store';
 import Repo from './components/repo.vue';
 import RepoEditButton from './components/repo_edit_button.vue';
 import newBranchForm from './components/new_branch_form.vue';
@@ -10,24 +8,6 @@ import newDropdown from './components/new_dropdown/index.vue';
 import vStore from './stores';
 import Translate from '../vue_shared/translate';
 
-function setInitialStore(data) {
-  Store.service = Service;
-  Store.service.refsUrl = data.refsUrl;
-  Store.path = data.currentPath;
-  Store.projectId = data.projectId;
-  Store.projectName = data.projectName;
-  Store.projectUrl = data.projectUrl;
-  Store.canCommit = data.canCommit;
-  Store.onTopOfBranch = data.onTopOfBranch;
-  Store.newMrTemplateUrl = decodeURIComponent(data.newMrTemplateUrl);
-  Store.customBranchURL = decodeURIComponent(data.blobUrl);
-  Store.isRoot = convertPermissionToBoolean(data.root);
-  Store.isInitialRoot = convertPermissionToBoolean(data.root);
-  Store.currentBranch = $('button.dropdown-menu-toggle').attr('data-ref');
-  Store.checkIsCommitable();
-  Store.setBranchHash();
-}
-
 function initRepo(el) {
   return new Vue({
     el,
@@ -47,6 +27,7 @@ function initRepo(el) {
         project: {
           id: data.projectId,
           name: data.projectName,
+          url: data.projectUrl,
         },
         endpoints: {
           rootEndpoint: data.url,
@@ -56,6 +37,7 @@ function initRepo(el) {
         canCommit: convertPermissionToBoolean(data.canCommit),
         onTopOfBranch: convertPermissionToBoolean(data.onTopOfBranch),
         currentRef: data.ref,
+        path: data.currentPath,
         // TODO: get through data attribute
         currentBranch: document.querySelector('.js-project-refs-dropdown').dataset.ref,
         isRoot: convertPermissionToBoolean(data.root),
@@ -81,6 +63,7 @@ function initRepoEditButton(el) {
 function initNewDropdown(el) {
   return new Vue({
     el,
+    store: vStore,
     components: {
       newDropdown,
     },
@@ -110,7 +93,6 @@ function initNewBranchForm() {
 const repo = document.getElementById('repo');
 const editButton = document.querySelector('.editable-mode');
 const newDropdownHolder = document.querySelector('.js-new-dropdown');
-setInitialStore(repo.dataset);
 
 Vue.use(Translate);
 
diff --git a/app/assets/javascripts/repo/services/index.js b/app/assets/javascripts/repo/services/index.js
index 57c234cd4c9..49301fb47d5 100644
--- a/app/assets/javascripts/repo/services/index.js
+++ b/app/assets/javascripts/repo/services/index.js
@@ -11,8 +11,13 @@ export default {
   getFileData(endpoint) {
     return Vue.http.get(endpoint, { params: { format: 'json' } });
   },
-  getRawFileData(endpoint) {
-    return Vue.http.get(endpoint);
+  getRawFileData(file) {
+    if (file.tempFile) {
+      return Promise.resolve('');
+    }
+
+    return Vue.http.get(file.rawPath, { params: { format: 'json' } })
+      .then(res => res.text());
   },
   getBranchData(projectId, currentBranch) {
     return Api.branchSingle(projectId, currentBranch);
diff --git a/app/assets/javascripts/repo/services/repo_service.js b/app/assets/javascripts/repo/services/repo_service.js
deleted file mode 100644
index c9fa5cc8bf8..00000000000
--- a/app/assets/javascripts/repo/services/repo_service.js
+++ /dev/null
@@ -1,101 +0,0 @@
-import axios from 'axios';
-import csrf from '../../lib/utils/csrf';
-import Store from '../stores/repo_store';
-import Api from '../../api';
-import Helper from '../helpers/repo_helper';
-
-axios.defaults.headers.common[csrf.headerKey] = csrf.token;
-
-const RepoService = {
-  url: '',
-  options: {
-    params: {
-      format: 'json',
-    },
-  },
-  createBranchPath: '/api/:version/projects/:id/repository/branches',
-  richExtensionRegExp: /md/,
-
-  getRaw(file) {
-    if (file.tempFile) {
-      return Promise.resolve({
-        data: '',
-      });
-    }
-
-    return axios.get(file.raw_path, {
-      // Stop Axios from parsing a JSON file into a JS object
-      transformResponse: [res => res],
-    });
-  },
-
-  buildParams(url = this.url) {
-    // shallow clone object without reference
-    const params = Object.assign({}, this.options.params);
-
-    if (this.urlIsRichBlob(url)) params.viewer = 'rich';
-
-    return params;
-  },
-
-  urlIsRichBlob(url = this.url) {
-    const extension = Helper.getFileExtension(url);
-
-    return this.richExtensionRegExp.test(extension);
-  },
-
-  getContent(url = this.url) {
-    const params = this.buildParams(url);
-
-    return axios.get(url, {
-      params,
-    });
-  },
-
-  getBase64Content(url = this.url) {
-    const request = axios.get(url, {
-      responseType: 'arraybuffer',
-    });
-
-    return request.then(response => this.bufferToBase64(response.data));
-  },
-
-  bufferToBase64(data) {
-    return new Buffer(data, 'binary').toString('base64');
-  },
-
-  blobURLtoParentTree(url) {
-    const urlArray = url.split('/');
-    urlArray.pop();
-    const blobIndex = urlArray.lastIndexOf('blob');
-
-    if (blobIndex > -1) urlArray[blobIndex] = 'tree';
-
-    return urlArray.join('/');
-  },
-
-  getBranch() {
-    return Api.branchSingle(Store.projectId, Store.currentBranch);
-  },
-
-  commitFiles(payload) {
-    return Api.commitMultiple(Store.projectId, payload)
-      .then(this.commitFlash);
-  },
-
-  createBranch(payload) {
-    const url = Api.buildUrl(this.createBranchPath)
-      .replace(':id', Store.projectId);
-    return axios.post(url, payload);
-  },
-
-  commitFlash(data) {
-    if (data.short_id && data.stats) {
-      window.Flash(`Your changes have been committed. Commit ${data.short_id} with ${data.stats.additions} additions, ${data.stats.deletions} deletions.`, 'notice');
-    } else {
-      window.Flash(data.message);
-    }
-  },
-};
-
-export default RepoService;
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index c0b5ce47398..20aee8707b4 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -1,7 +1,6 @@
 import flash from '../../flash';
 import service from '../services';
 import * as types from './mutation_types';
-import * as getters from './getters';
 import { visitUrl } from '../../lib/utils/url_utility';
 
 export const redirectToUrl = url => visitUrl(url);
@@ -10,8 +9,8 @@ export const setInitialData = ({ commit }, data) => commit(types.SET_INITIAL_DAT
 
 export const closeDiscardPopup = ({ commit }) => commit(types.TOGGLE_DISCARD_POPUP, false);
 
-export const discardAllChanges = ({ commit, state }) => {
-  const changedFiles = getters.changedFiles(state);
+export const discardAllChanges = ({ commit, getters }) => {
+  const changedFiles = getters.changedFiles;
 
   changedFiles.forEach(file => commit(types.DISCARD_FILE_CHANGES, file));
 };
@@ -20,8 +19,8 @@ export const closeAllFiles = ({ state, dispatch }) => {
   state.openFiles.forEach(file => dispatch('closeFile', file));
 };
 
-export const toggleEditMode = ({ commit, state, dispatch }, force = false) => {
-  const changedFiles = getters.changedFiles(state);
+export const toggleEditMode = ({ commit, getters, dispatch }, force = false) => {
+  const changedFiles = getters.changedFiles;
 
   if (changedFiles.length && !force) {
     commit(types.TOGGLE_DISCARD_POPUP, true);
@@ -78,8 +77,19 @@ export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =
   })
   .catch(() => flash('Error committing changes. Please try again.'));
 
-export const popHistoryState = ({ state, dispatch }) => {
-  const treeList = getters.treeList(state);
+export const createTempEntry = ({ state, dispatch }, { name, type }) => {
+  if (type === 'tree') {
+    dispatch('createTempTree', name);
+  } else if (type === 'blob') {
+    dispatch('createTempFile', {
+      tree: state,
+      name,
+    });
+  }
+};
+
+export const popHistoryState = ({ state, dispatch, getters }) => {
+  const treeList = getters.treeList;
   const tree = treeList.find(file => file.url === state.previousUrl);
 
   if (!tree) return;
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
index 887eecf83f8..60964f90d34 100644
--- a/app/assets/javascripts/repo/stores/actions/file.js
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -1,7 +1,7 @@
 import flash from '../../../flash';
 import service from '../../services';
 import * as types from '../mutation_types';
-import { activeFile } from '../getters';
+import { createTemp } from '../utils';
 
 export const closeFile = ({ commit }, file) => {
   if (file.changed || file.tempFile) return;
@@ -10,8 +10,8 @@ export const closeFile = ({ commit }, file) => {
   commit(types.SET_FILE_ACTIVE, { file, active: false });
 };
 
-export const setFileActive = ({ commit, state }, file) => {
-  const currentActiveFile = activeFile(state);
+export const setFileActive = ({ commit, state, getters }, file) => {
+  const currentActiveFile = getters.activeFile;
 
   if (currentActiveFile) {
     commit(types.SET_FILE_ACTIVE, { file: currentActiveFile, active: false });
@@ -38,8 +38,7 @@ export const getFileData = ({ commit, dispatch }, file) => {
     });
 };
 
-export const getRawFileData = ({ commit, dispatch }, file) => service.getRawFileData(file.rawPath)
-  .then(res => res.text())
+export const getRawFileData = ({ commit, dispatch }, file) => service.getRawFileData(file)
   .then((raw) => {
     commit(types.SET_FILE_RAW_DATA, { file, raw });
   })
@@ -48,3 +47,21 @@ export const getRawFileData = ({ commit, dispatch }, file) => service.getRawFile
 export const changeFileContent = ({ commit }, { file, content }) => {
   commit(types.UPDATE_FILE_CONTENT, { file, content });
 };
+
+export const createTempFile = ({ state, commit, dispatch }, { tree, name }) => {
+  const file = createTemp({
+    name: name.replace(`${state.path}/`, ''),
+    path: tree.path,
+    type: 'blob',
+    level: tree.level !== undefined ? tree.level + 1 : 0,
+    changed: true,
+  });
+
+  commit(types.CREATE_TMP_FILE, {
+    parent: tree,
+    file,
+  });
+  commit(types.TOGGLE_FILE_OPEN, file);
+  dispatch('setFileActive', file);
+  dispatch('toggleEditMode', true);
+};
diff --git a/app/assets/javascripts/repo/stores/actions/tree.js b/app/assets/javascripts/repo/stores/actions/tree.js
index 8869bb8da2a..a0be8d4c556 100644
--- a/app/assets/javascripts/repo/stores/actions/tree.js
+++ b/app/assets/javascripts/repo/stores/actions/tree.js
@@ -2,7 +2,12 @@ import { normalizeHeaders } from '../../../lib/utils/common_utils';
 import flash from '../../../flash';
 import service from '../../services';
 import * as types from '../mutation_types';
-import { pushState, setPageTitle } from '../utils';
+import {
+  pushState,
+  setPageTitle,
+  findEntry,
+  createTemp,
+} from '../utils';
 
 export const getTreeData = (
   { commit, state },
@@ -68,3 +73,35 @@ export const clickedTreeRow = ({ commit, dispatch }, row) => {
     dispatch('getFileData', row);
   }
 };
+
+export const createTempTree = ({ state, commit, dispatch }, name) => {
+  let tree = state;
+  const dirNames = name.replace(`${state.path}/`, '').split('/');
+
+  dirNames.forEach((dirName) => {
+    const foundEntry = findEntry(tree, 'tree', dirName);
+
+    if (!foundEntry) {
+      const tmpEntry = createTemp({
+        name: dirName,
+        path: tree.path,
+        type: 'tree',
+        level: tree.level !== undefined ? tree.level + 1 : 0,
+      });
+
+      commit(types.CREATE_TMP_TREE, {
+        parent: tree,
+        tmpEntry,
+      });
+
+      tree = tmpEntry;
+    } else {
+      tree = foundEntry;
+    }
+  });
+
+  dispatch('createTempFile', {
+    tree,
+    name: '.gitkeep',
+  });
+};
diff --git a/app/assets/javascripts/repo/stores/mutation_types.js b/app/assets/javascripts/repo/stores/mutation_types.js
index c6d0816080c..4722a7dd0df 100644
--- a/app/assets/javascripts/repo/stores/mutation_types.js
+++ b/app/assets/javascripts/repo/stores/mutation_types.js
@@ -8,6 +8,7 @@ export const SET_PREVIOUS_URL = 'SET_PREVIOUS_URL';
 // Tree mutation types
 export const SET_DIRECTORY_DATA = 'SET_DIRECTORY_DATA';
 export const TOGGLE_TREE_OPEN = 'TOGGLE_TREE_OPEN';
+export const CREATE_TMP_TREE = 'CREATE_TMP_TREE';
 
 // File mutation types
 export const SET_FILE_DATA = 'SET_FILE_DATA';
@@ -16,6 +17,7 @@ export const SET_FILE_ACTIVE = 'SET_FILE_ACTIVE';
 export const SET_FILE_RAW_DATA = 'SET_FILE_RAW_DATA';
 export const UPDATE_FILE_CONTENT = 'UPDATE_FILE_CONTENT';
 export const DISCARD_FILE_CHANGES = 'DISCARD_FILE_CHANGES';
+export const CREATE_TMP_FILE = 'CREATE_TMP_FILE';
 
 // Viewer mutation types
 export const SET_PREVIEW_MODE = 'SET_PREVIEW_MODE';
diff --git a/app/assets/javascripts/repo/stores/mutations/file.js b/app/assets/javascripts/repo/stores/mutations/file.js
index 50d8a51d9b7..4d10fa8169d 100644
--- a/app/assets/javascripts/repo/stores/mutations/file.js
+++ b/app/assets/javascripts/repo/stores/mutations/file.js
@@ -47,4 +47,7 @@ export default {
       changed: false,
     });
   },
+  [types.CREATE_TMP_FILE](state, { file, parent }) {
+    parent.tree.push(file);
+  },
 };
diff --git a/app/assets/javascripts/repo/stores/mutations/tree.js b/app/assets/javascripts/repo/stores/mutations/tree.js
index 700aff46827..52be2673107 100644
--- a/app/assets/javascripts/repo/stores/mutations/tree.js
+++ b/app/assets/javascripts/repo/stores/mutations/tree.js
@@ -13,9 +13,24 @@ export default {
 
     Object.assign(tree, {
       tree: [
-        ...data.trees.map(t => utils.decorateData(t, 'tree', parentTreeUrl, level)),
-        ...data.submodules.map(m => utils.decorateData(m, 'submodule', parentTreeUrl, level)),
-        ...data.blobs.map(b => utils.decorateData(b, 'blob', parentTreeUrl, level)),
+        ...data.trees.map(t => utils.decorateData({
+          ...t,
+          type: 'tree',
+          parentTreeUrl,
+          level,
+        }, state.project.url)),
+        ...data.submodules.map(m => utils.decorateData({
+          ...m,
+          type: 'submodule',
+          parentTreeUrl,
+          level,
+        }, state.project.url)),
+        ...data.blobs.map(b => utils.decorateData({
+          ...b,
+          type: 'blob',
+          parentTreeUrl,
+          level,
+        }, state.project.url)),
       ],
     });
   },
@@ -24,4 +39,7 @@ export default {
       parentTreeUrl: url,
     });
   },
+  [types.CREATE_TMP_TREE](state, { parent, tmpEntry }) {
+    parent.tree.push(tmpEntry);
+  },
 };
diff --git a/app/assets/javascripts/repo/stores/repo_store.js b/app/assets/javascripts/repo/stores/repo_store.js
deleted file mode 100644
index b68e2289319..00000000000
--- a/app/assets/javascripts/repo/stores/repo_store.js
+++ /dev/null
@@ -1,182 +0,0 @@
-import Helper from '../helpers/repo_helper';
-import Service from '../services/repo_service';
-
-const RepoStore = {
-  monacoLoading: false,
-  service: '',
-  canCommit: false,
-  onTopOfBranch: false,
-  editMode: false,
-  prevURL: '',
-  projectId: '',
-  projectName: '',
-  projectUrl: '',
-  branchUrl: '',
-  blobRaw: '',
-  openedFiles: [],
-  submitCommitsLoading: false,
-  dialog: {
-    open: false,
-    title: '',
-    status: false,
-  },
-  showNewBranchDialog: false,
-  activeFile: Helper.getDefaultActiveFile(),
-  activeFileIndex: 0,
-  activeLine: -1,
-  activeFileLabel: 'Raw',
-  files: [],
-  isCommitable: false,
-  binary: false,
-  currentBranch: '',
-  startNewMR: false,
-  currentHash: '',
-  currentShortHash: '',
-  customBranchURL: '',
-  newMrTemplateUrl: '',
-  branchChanged: false,
-  commitMessage: '',
-  path: '',
-
-  setBranchHash() {
-    return Service.getBranch()
-      .then((data) => {
-        if (RepoStore.currentHash !== '' && data.commit.id !== RepoStore.currentHash) {
-          RepoStore.branchChanged = true;
-        }
-        RepoStore.currentHash = data.commit.id;
-        RepoStore.currentShortHash = data.commit.short_id;
-      });
-  },
-
-  // mutations
-  checkIsCommitable() {
-    RepoStore.isCommitable = RepoStore.onTopOfBranch && RepoStore.canCommit;
-  },
-
-  toggleRawPreview() {
-    RepoStore.activeFile.raw = !RepoStore.activeFile.raw;
-    RepoStore.activeFileLabel = RepoStore.activeFile.raw ? 'Display rendered file' : 'Display source';
-  },
-
-  setActiveFiles(file) {
-    if (RepoStore.isActiveFile(file)) return;
-    RepoStore.openedFiles = RepoStore.openedFiles
-      .map((openedFile, i) => RepoStore.setFileActivity(file, openedFile, i));
-
-    RepoStore.setActiveToRaw();
-
-    if (file.binary) {
-      RepoStore.blobRaw = file.base64;
-    } else if (file.newContent || file.plain) {
-      RepoStore.blobRaw = file.newContent || file.plain;
-    } else {
-      Service.getRaw(file)
-        .then((rawResponse) => {
-          RepoStore.blobRaw = rawResponse.data;
-          Helper.findOpenedFileFromActive().plain = rawResponse.data;
-        }).catch(Helper.loadingError);
-    }
-
-    if (!file.loading && !file.tempFile) {
-      Helper.updateHistoryEntry(file.url, file.pageTitle || file.name);
-    }
-    RepoStore.binary = file.binary;
-    RepoStore.setActiveLine(-1);
-  },
-
-  setFileActivity(file, openedFile, i) {
-    const activeFile = openedFile;
-    activeFile.active = file.id === activeFile.id;
-
-    if (activeFile.active) RepoStore.setActiveFile(activeFile, i);
-
-    return activeFile;
-  },
-
-  setActiveFile(activeFile, i) {
-    RepoStore.activeFile = Object.assign({}, Helper.getDefaultActiveFile(), activeFile);
-    RepoStore.activeFileIndex = i;
-  },
-
-  setActiveLine(activeLine) {
-    if (!isNaN(activeLine)) RepoStore.activeLine = activeLine;
-  },
-
-  setActiveToRaw() {
-    RepoStore.activeFile.raw = false;
-    // can't get vue to listen to raw for some reason so RepoStore for now.
-    RepoStore.activeFileLabel = 'Display source';
-  },
-
-  removeFromOpenedFiles(file) {
-    if (file.type === 'tree') return;
-    let foundIndex;
-    RepoStore.openedFiles = RepoStore.openedFiles.filter((openedFile, i) => {
-      if (openedFile.path === file.path) foundIndex = i;
-      return openedFile.path !== file.path;
-    });
-
-    // remove the file from the sidebar if it is a tempFile
-    if (file.tempFile) {
-      RepoStore.files = RepoStore.files.filter(f => !(f.tempFile && f.path === file.path));
-    }
-
-    // now activate the right tab based on what you closed.
-    if (RepoStore.openedFiles.length === 0) {
-      RepoStore.activeFile = {};
-      return;
-    }
-
-    if (RepoStore.openedFiles.length === 1 || foundIndex === 0) {
-      RepoStore.setActiveFiles(RepoStore.openedFiles[0]);
-      return;
-    }
-
-    if (foundIndex && foundIndex > 0) {
-      RepoStore.setActiveFiles(RepoStore.openedFiles[foundIndex - 1]);
-    }
-  },
-
-  addToOpenedFiles(file) {
-    const openFile = file;
-
-    const openedFilesAlreadyExists = RepoStore.openedFiles
-      .some(openedFile => openedFile.path === openFile.path);
-
-    if (openedFilesAlreadyExists) return;
-
-    openFile.changed = false;
-    openFile.active = true;
-    RepoStore.openedFiles.push(openFile);
-  },
-
-  setActiveFileContents(contents) {
-    if (!RepoStore.editMode) return;
-    const currentFile = RepoStore.openedFiles[RepoStore.activeFileIndex];
-    RepoStore.activeFile.newContent = contents;
-    RepoStore.activeFile.changed = RepoStore.activeFile.plain !== RepoStore.activeFile.newContent;
-    currentFile.changed = RepoStore.activeFile.changed;
-    currentFile.newContent = contents;
-  },
-
-  toggleBlobView() {
-    RepoStore.currentBlobView = RepoStore.isPreviewView() ? 'repo-editor' : 'repo-preview';
-  },
-
-  setViewToPreview() {
-    RepoStore.currentBlobView = 'repo-preview';
-  },
-
-  // getters
-
-  isActiveFile(file) {
-    return file && file.id === RepoStore.activeFile.id;
-  },
-
-  isPreviewView() {
-    return RepoStore.currentBlobView === 'repo-preview';
-  },
-};
-
-export default RepoStore;
diff --git a/app/assets/javascripts/repo/stores/state.js b/app/assets/javascripts/repo/stores/state.js
index 6cf7565c955..0166490aac0 100644
--- a/app/assets/javascripts/repo/stores/state.js
+++ b/app/assets/javascripts/repo/stores/state.js
@@ -2,12 +2,14 @@ export default {
   project: {
     id: 0,
     name: '',
+    url: '',
   },
-  currentBranch: '',
   endpoints: {},
   isRoot: false,
   isInitialRoot: false,
+  currentBranch: '',
   currentRef: '',
+  path: '',
   canCommit: false,
   onTopOfBranch: false,
   editMode: false,
diff --git a/app/assets/javascripts/repo/stores/utils.js b/app/assets/javascripts/repo/stores/utils.js
index ec733200552..81638e46672 100644
--- a/app/assets/javascripts/repo/stores/utils.js
+++ b/app/assets/javascripts/repo/stores/utils.js
@@ -1,4 +1,4 @@
-export const dataStructure = ({
+export const dataStructure = () => ({
   id: '',
   type: '',
   name: '',
@@ -25,9 +25,10 @@ export const dataStructure = ({
   parentTreeUrl: '',
 });
 
-export const decorateData = (entity, type, parentTreeUrl = '', level = 0) => {
+export const decorateData = (entity, projectUrl = '') => {
   const {
     id,
+    type,
     url,
     name,
     icon,
@@ -37,10 +38,13 @@ export const decorateData = (entity, type, parentTreeUrl = '', level = 0) => {
     tempFile,
     active = false,
     opened = false,
+    changed = false,
+    parentTreeUrl = '',
+    level = 0,
   } = entity;
 
   return {
-    ...dataStructure,
+    ...dataStructure(),
     id,
     type,
     name,
@@ -53,15 +57,19 @@ export const decorateData = (entity, type, parentTreeUrl = '', level = 0) => {
     opened,
     active,
     parentTreeUrl,
+    changed,
     // eslint-disable-next-line camelcase
     lastCommit: last_commit ? {
-      // url: `${Store.projectUrl}/commit/${last_commit.id}`,
+      url: `${projectUrl}/commit/${last_commit.id}`,
       message: last_commit.message,
       updatedAt: last_commit.committed_date,
     } : {},
   };
 };
 
+export const findEntry = (state, type, name) => state.tree.find(
+  f => f.type === type && f.name === name,
+);
 export const findIndexOfFile = (state, file) => state.findIndex(f => f.path === file.path);
 
 export const setPageTitle = (title) => {
@@ -71,3 +79,20 @@ export const setPageTitle = (title) => {
 export const pushState = (url) => {
   history.pushState({ url }, '', url);
 };
+
+export const createTemp = ({ name, path, type, level, changed, content }) => {
+  const treePath = path ? `${path}/${name}` : name;
+
+  return decorateData({
+    id: new Date().getTime().toString(),
+    name,
+    type,
+    tempFile: true,
+    path: treePath,
+    icon: type === 'tree' ? 'folder' : 'file-text-o',
+    changed,
+    content,
+    parentTreeUrl: '',
+    level,
+  });
+};
-- 
cgit v1.2.1


From 1543679eafc284bbd1d90987958bda62076383ef Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Thu, 26 Oct 2017 15:40:41 +0100
Subject: correctly activate the next tab when closing a tab scroll to the
 active tab when opening/closing

[ci skip]
---
 app/assets/javascripts/repo/stores/actions.js      | 10 ++++++++++
 app/assets/javascripts/repo/stores/actions/file.js | 20 +++++++++++++++++---
 app/assets/stylesheets/pages/repo.scss             |  1 +
 3 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index 20aee8707b4..cccedf643f6 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -1,3 +1,4 @@
+import Vue from 'vue';
 import flash from '../../flash';
 import service from '../services';
 import * as types from './mutation_types';
@@ -99,6 +100,15 @@ export const popHistoryState = ({ state, dispatch, getters }) => {
   }
 };
 
+export const scrollToTab = () => {
+  Vue.nextTick(() => {
+    const tabs = document.getElementById('tabs');
+    const tabEl = tabs.querySelector('.active');
+
+    tabs.scrollLeft = tabEl.offsetLeft;
+  });
+};
+
 export * from './actions/tree';
 export * from './actions/file';
 export * from './actions/branch';
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
index 60964f90d34..7b384ad96f2 100644
--- a/app/assets/javascripts/repo/stores/actions/file.js
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -1,16 +1,29 @@
 import flash from '../../../flash';
 import service from '../../services';
 import * as types from '../mutation_types';
-import { createTemp } from '../utils';
+import {
+  createTemp,
+  findIndexOfFile,
+} from '../utils';
 
-export const closeFile = ({ commit }, file) => {
+export const closeFile = ({ commit, state, dispatch }, file) => {
   if (file.changed || file.tempFile) return;
 
+  const indexOfClosedFile = findIndexOfFile(state.openFiles, file);
+  const fileWasActive = file.active;
+
   commit(types.TOGGLE_FILE_OPEN, file);
   commit(types.SET_FILE_ACTIVE, { file, active: false });
+
+  if (state.openFiles.length > 0 && fileWasActive) {
+    const nextIndexToOpen = indexOfClosedFile === 0 ? 0 : indexOfClosedFile - 1;
+    const nextFileToOpen = state.openFiles[nextIndexToOpen];
+
+    dispatch('setFileActive', nextFileToOpen);
+  }
 };
 
-export const setFileActive = ({ commit, state, getters }, file) => {
+export const setFileActive = ({ commit, state, getters, dispatch }, file) => {
   const currentActiveFile = getters.activeFile;
 
   if (currentActiveFile) {
@@ -18,6 +31,7 @@ export const setFileActive = ({ commit, state, getters }, file) => {
   }
 
   commit(types.SET_FILE_ACTIVE, { file, active: true });
+  dispatch('scrollToTab');
 };
 
 export const getFileData = ({ commit, dispatch }, file) => {
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index 6a363b1710e..b082c3f4bb2 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -138,6 +138,7 @@
     }
 
     #tabs {
+      position: relative;
       flex-shrink: 0;
       display: flex;
       width: 100%;
-- 
cgit v1.2.1


From bdac5569b10b4dde32a7ac98973da2805f42e92d Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Thu, 26 Oct 2017 16:44:26 +0100
Subject: fixed some state bugs with the tabs

[ci skip]
---
 .../repo/components/new_dropdown/index.vue         |  7 -------
 .../repo/components/new_dropdown/modal.vue         | 21 ++++++++++++-------
 .../javascripts/repo/components/repo_editor.vue    |  4 +++-
 .../repo/components/repo_file_buttons.vue          |  8 --------
 .../javascripts/repo/components/repo_tab.vue       |  6 +++---
 app/assets/javascripts/repo/stores/actions.js      | 14 ++++++++++---
 app/assets/javascripts/repo/stores/actions/file.js | 24 +++++++++++++++++-----
 app/assets/javascripts/repo/stores/actions/tree.js |  1 +
 app/assets/javascripts/repo/stores/state.js        |  2 +-
 app/views/shared/repo/_repo.html.haml              |  4 +---
 10 files changed, 53 insertions(+), 38 deletions(-)

diff --git a/app/assets/javascripts/repo/components/new_dropdown/index.vue b/app/assets/javascripts/repo/components/new_dropdown/index.vue
index 96b2087e1b9..53baa02c344 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/index.vue
@@ -1,5 +1,4 @@
 <script>
-  import { mapState } from 'vuex';
   import newModal from './modal.vue';
 
   export default {
@@ -12,11 +11,6 @@
         modalType: '',
       };
     },
-    computed: {
-      ...mapState({
-        currentPath: 'path',
-      }),
-    },
     methods: {
       createNewItem(type) {
         this.modalType = type;
@@ -70,7 +64,6 @@
     <new-modal
       v-if="openModal"
       :type="modalType"
-      :current-path="currentPath"
       @toggle="toggleModalOpen"
     />
   </div>
diff --git a/app/assets/javascripts/repo/components/new_dropdown/modal.vue b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
index e3496f26b8b..bb22dc4caa9 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/modal.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
@@ -1,14 +1,10 @@
 <script>
-  import { mapActions } from 'vuex';
+  import { mapActions, mapState } from 'vuex';
   import { __ } from '../../../locale';
   import popupDialog from '../../../vue_shared/components/popup_dialog.vue';
 
   export default {
     props: {
-      currentPath: {
-        type: String,
-        required: true,
-      },
       type: {
         type: String,
         required: true,
@@ -16,7 +12,7 @@
     },
     data() {
       return {
-        entryName: this.currentPath !== '' ? `${this.currentPath}/` : '',
+        entryName: '',
       };
     },
     components: {
@@ -39,6 +35,17 @@
       },
     },
     computed: {
+      ...mapState([
+        'path',
+      ]),
+      name: {
+        get() {
+          return this.path !== '' ? `${this.path}/${this.entryName}` : this.entryName;
+        },
+        set(newVal) {
+          this.entryName = newVal.replace(`${this.path}/`, '');
+        },
+      },
       modalTitle() {
         if (this.type === 'tree') {
           return __('Create new directory');
@@ -88,7 +95,7 @@
           <input
             type="text"
             class="form-control"
-            v-model="entryName"
+            v-model="name"
             ref="fieldName"
           />
         </div>
diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue
index 0714ba90b6f..8b717e2330b 100644
--- a/app/assets/javascripts/repo/components/repo_editor.vue
+++ b/app/assets/javascripts/repo/components/repo_editor.vue
@@ -51,6 +51,8 @@ export default {
         .catch(() => flash('Error setting up monaco. Please try again.'));
     },
     setupEditor() {
+      if (!this.activeFile) return;
+
       const foundLang = this.languages.find(lang =>
         lang.extensions && lang.extensions.indexOf(this.activeFileExtension) === 0,
       );
@@ -71,7 +73,7 @@ export default {
   },
   watch: {
     activeFile(oldVal, newVal) {
-      if (newVal.active) {
+      if (!newVal.active) {
         this.initMonaco();
       }
     },
diff --git a/app/assets/javascripts/repo/components/repo_file_buttons.vue b/app/assets/javascripts/repo/components/repo_file_buttons.vue
index 3d72a635035..dd948ee84fb 100644
--- a/app/assets/javascripts/repo/components/repo_file_buttons.vue
+++ b/app/assets/javascripts/repo/components/repo_file_buttons.vue
@@ -52,13 +52,5 @@ export default {
         Permalink
       </a>
     </div>
-
-    <!-- <a
-      v-if="canPreview"
-      href="#"
-      @click.prevent="rawPreviewToggle"
-      class="btn btn-default preview">
-      {{activeFileLabel}}
-    </a> -->
   </div>
 </template>
diff --git a/app/assets/javascripts/repo/components/repo_tab.vue b/app/assets/javascripts/repo/components/repo_tab.vue
index 4c418aba103..da0714c368c 100644
--- a/app/assets/javascripts/repo/components/repo_tab.vue
+++ b/app/assets/javascripts/repo/components/repo_tab.vue
@@ -11,7 +11,7 @@ export default {
 
   computed: {
     closeLabel() {
-      if (this.tab.changed) {
+      if (this.tab.changed || this.tab.tempFile) {
         return `${this.tab.name} changed`;
       }
       return `Close ${this.tab.name}`;
@@ -42,7 +42,7 @@ export default {
     <button
       type="button"
       class="close-btn"
-      @click.stop.prevent="closeFile(tab)"
+      @click.stop.prevent="closeFile({ file: tab })"
       :aria-label="closeLabel">
       <i
         class="fa"
@@ -55,7 +55,7 @@ export default {
       href="#"
       class="repo-tab"
       :title="tab.url"
-      @click.prevent="setFileActive(tab)">
+      @click.prevent.stop="setFileActive(tab)">
       {{tab.name}}
     </a>
   </li>
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index cccedf643f6..191fc9635fb 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -10,14 +10,22 @@ export const setInitialData = ({ commit }, data) => commit(types.SET_INITIAL_DAT
 
 export const closeDiscardPopup = ({ commit }) => commit(types.TOGGLE_DISCARD_POPUP, false);
 
-export const discardAllChanges = ({ commit, getters }) => {
+export const discardAllChanges = ({ state, commit, getters, dispatch }) => {
+  if (state.editMode) return;
+
   const changedFiles = getters.changedFiles;
 
-  changedFiles.forEach(file => commit(types.DISCARD_FILE_CHANGES, file));
+  changedFiles.forEach((file) => {
+    commit(types.DISCARD_FILE_CHANGES, file);
+
+    if (file.tempFile) {
+      dispatch('closeFile', { file, force: true });
+    }
+  });
 };
 
 export const closeAllFiles = ({ state, dispatch }) => {
-  state.openFiles.forEach(file => dispatch('closeFile', file));
+  state.openFiles.forEach(file => dispatch('closeFile', { file }));
 };
 
 export const toggleEditMode = ({ commit, getters, dispatch }, force = false) => {
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
index 7b384ad96f2..eb0aa506d6c 100644
--- a/app/assets/javascripts/repo/stores/actions/file.js
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -1,13 +1,16 @@
+import { normalizeHeaders } from '../../../lib/utils/common_utils';
 import flash from '../../../flash';
 import service from '../../services';
 import * as types from '../mutation_types';
 import {
+  pushState,
+  setPageTitle,
   createTemp,
   findIndexOfFile,
 } from '../utils';
 
-export const closeFile = ({ commit, state, dispatch }, file) => {
-  if (file.changed || file.tempFile) return;
+export const closeFile = ({ commit, state, dispatch }, { file, force = false }) => {
+  if ((file.changed || file.tempFile) && !force) return;
 
   const indexOfClosedFile = findIndexOfFile(state.openFiles, file);
   const fileWasActive = file.active;
@@ -20,12 +23,16 @@ export const closeFile = ({ commit, state, dispatch }, file) => {
     const nextFileToOpen = state.openFiles[nextIndexToOpen];
 
     dispatch('setFileActive', nextFileToOpen);
+  } else if (!state.openFiles.length) {
+    pushState(file.parentTreeUrl);
   }
 };
 
 export const setFileActive = ({ commit, state, getters, dispatch }, file) => {
   const currentActiveFile = getters.activeFile;
 
+  if (file.active) return;
+
   if (currentActiveFile) {
     commit(types.SET_FILE_ACTIVE, { file: currentActiveFile, active: false });
   }
@@ -34,17 +41,24 @@ export const setFileActive = ({ commit, state, getters, dispatch }, file) => {
   dispatch('scrollToTab');
 };
 
-export const getFileData = ({ commit, dispatch }, file) => {
+export const getFileData = ({ state, commit, dispatch }, file) => {
   commit(types.TOGGLE_LOADING, file);
 
   service.getFileData(file.url)
-    .then(res => res.json())
+    .then((res) => {
+      const pageTitle = decodeURI(normalizeHeaders(res.headers)['PAGE-TITLE']);
+
+      setPageTitle(pageTitle);
+
+      return res.json();
+    })
     .then((data) => {
       commit(types.SET_FILE_DATA, { data, file });
-      commit(types.SET_PREVIEW_MODE);
       commit(types.TOGGLE_FILE_OPEN, file);
       dispatch('setFileActive', file);
       commit(types.TOGGLE_LOADING, file);
+
+      pushState(file.url);
     })
     .catch(() => {
       commit(types.TOGGLE_LOADING, file);
diff --git a/app/assets/javascripts/repo/stores/actions/tree.js b/app/assets/javascripts/repo/stores/actions/tree.js
index a0be8d4c556..9d084a952a2 100644
--- a/app/assets/javascripts/repo/stores/actions/tree.js
+++ b/app/assets/javascripts/repo/stores/actions/tree.js
@@ -93,6 +93,7 @@ export const createTempTree = ({ state, commit, dispatch }, name) => {
         parent: tree,
         tmpEntry,
       });
+      commit(types.TOGGLE_TREE_OPEN, tmpEntry);
 
       tree = tmpEntry;
     } else {
diff --git a/app/assets/javascripts/repo/stores/state.js b/app/assets/javascripts/repo/stores/state.js
index 0166490aac0..643239eee19 100644
--- a/app/assets/javascripts/repo/stores/state.js
+++ b/app/assets/javascripts/repo/stores/state.js
@@ -14,7 +14,7 @@ export default {
   onTopOfBranch: false,
   editMode: false,
   loading: false,
-  currentBlobView: '',
+  currentBlobView: 'repo-preview',
   discardPopupOpen: false,
   tree: [],
   openFiles: [],
diff --git a/app/views/shared/repo/_repo.html.haml b/app/views/shared/repo/_repo.html.haml
index 8057d5295b9..c1ba1cfefba 100644
--- a/app/views/shared/repo/_repo.html.haml
+++ b/app/views/shared/repo/_repo.html.haml
@@ -1,12 +1,10 @@
 #repo{ data: { root: @path.empty?.to_s,
-               root_url: project_tree_path(@project),
+               root_url: project_tree_path(project),
                url: content_url,
                ref: @commit.id,
                project_name: project.name,
-               refs_url: refs_project_path(project, format: :json),
                project_url: project_path(project),
                project_id: project.id,
-               blob_url: namespace_project_blob_path(project.namespace, project, '{{branch}}'),
                new_merge_request_url: namespace_project_new_merge_request_path(project.namespace, project, merge_request: { source_branch: '' }),
                can_commit: (!!can_push_branch?(project, @ref)).to_s,
                on_top_of_branch: (!!on_top_of_branch?(project, @ref)).to_s,
-- 
cgit v1.2.1


From 4d18e2001102fc2269da0509861770cc5bf8de11 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Thu, 26 Oct 2017 16:54:44 +0100
Subject: fixed render_error not being hooked up correctly

[ci skip]
---
 .../javascripts/repo/components/repo_preview.vue   |  8 +++---
 app/assets/javascripts/repo/stores/getters.js      |  2 +-
 .../javascripts/repo/stores/mutations/file.js      |  1 +
 app/assets/javascripts/repo/stores/utils.js        |  3 +++
 app/assets/stylesheets/pages/repo.scss             | 29 ----------------------
 5 files changed, 9 insertions(+), 34 deletions(-)

diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index 23b71b03a14..647c9079d0f 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -33,21 +33,21 @@ export default {
 <template>
 <div>
   <div
-    v-if="!activeFile.render_error"
+    v-if="!activeFile.renderError"
     v-html="activeFile.html">
   </div>
   <div
-    v-else-if="activeFile.tooLarge"
+    v-else-if="activeFile.renderError == 'too_large'"
     class="vertical-center render-error">
     <p class="text-center">
-      The source could not be displayed because it is too large. You can <a :href="activeFile.raw_path">download</a> it instead.
+      The source could not be displayed because it is too large. You can <a :href="activeFile.rawPath" download>download</a> it instead.
     </p>
   </div>
   <div
     v-else
     class="vertical-center render-error">
     <p class="text-center">
-      The source could not be displayed because a rendering error occurred. You can <a :href="activeFile.raw_path">download</a> it instead.
+      The source could not be displayed because a rendering error occurred. You can <a :href="activeFile.rawPath" download>download</a> it instead.
     </p>
   </div>
 </div>
diff --git a/app/assets/javascripts/repo/stores/getters.js b/app/assets/javascripts/repo/stores/getters.js
index 9fa593a82da..1c83c943ef7 100644
--- a/app/assets/javascripts/repo/stores/getters.js
+++ b/app/assets/javascripts/repo/stores/getters.js
@@ -35,5 +35,5 @@ export const canEditFile = (state) => {
   return state.canCommit &&
     state.onTopOfBranch &&
     openedFiles.length &&
-    (currentActiveFile && !currentActiveFile.render_error && !currentActiveFile.binary);
+    (currentActiveFile && !currentActiveFile.renderError && !currentActiveFile.binary);
 };
diff --git a/app/assets/javascripts/repo/stores/mutations/file.js b/app/assets/javascripts/repo/stores/mutations/file.js
index 4d10fa8169d..f9ba80b9dc2 100644
--- a/app/assets/javascripts/repo/stores/mutations/file.js
+++ b/app/assets/javascripts/repo/stores/mutations/file.js
@@ -26,6 +26,7 @@ export default {
       rawPath: data.raw_path,
       binary: data.binary,
       html: data.html,
+      renderError: data.render_error,
     });
   },
   [types.SET_FILE_RAW_DATA](state, { file, raw }) {
diff --git a/app/assets/javascripts/repo/stores/utils.js b/app/assets/javascripts/repo/stores/utils.js
index 81638e46672..feafcebcfe2 100644
--- a/app/assets/javascripts/repo/stores/utils.js
+++ b/app/assets/javascripts/repo/stores/utils.js
@@ -23,6 +23,7 @@ export const dataStructure = () => ({
   raw: '',
   content: '',
   parentTreeUrl: '',
+  renderError: false,
 });
 
 export const decorateData = (entity, projectUrl = '') => {
@@ -36,6 +37,7 @@ export const decorateData = (entity, projectUrl = '') => {
     tree_url,
     path,
     tempFile,
+    renderError,
     active = false,
     opened = false,
     changed = false,
@@ -58,6 +60,7 @@ export const decorateData = (entity, projectUrl = '') => {
     active,
     parentTreeUrl,
     changed,
+    renderError,
     // eslint-disable-next-line camelcase
     lastCommit: last_commit ? {
       url: `${projectUrl}/commit/${last_commit.id}`,
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index b082c3f4bb2..b360fb7de1a 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -1,12 +1,3 @@
-.monaco-loader {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: $black-transparent;
-}
-
 .modal.popup-dialog {
   display: block;
   background-color: $black-transparent;
@@ -313,23 +304,3 @@
     width: 100%;
   }
 }
-
-@keyframes swipeRightAppear {
-  0% {
-    transform: scaleX(0.00);
-  }
-
-  100% {
-    transform: scaleX(1.00);
-  }
-}
-
-@keyframes swipeRightDissapear {
-  0% {
-    transform: scaleX(1.00);
-  }
-
-  100% {
-    transform: scaleX(0.00);
-  }
-}
-- 
cgit v1.2.1


From 5c0c345a3a8a022b0bfdbab2efd125c42b297373 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Thu, 26 Oct 2017 17:36:27 +0100
Subject: various different performance improvements

[ci skip]
---
 app/assets/javascripts/repo/components/repo.vue        | 10 +++++-----
 .../javascripts/repo/components/repo_edit_button.vue   |  2 +-
 app/assets/javascripts/repo/components/repo_editor.vue |  5 +++--
 app/assets/javascripts/repo/components/repo_file.vue   |  1 -
 .../javascripts/repo/components/repo_preview.vue       |  2 +-
 app/assets/javascripts/repo/index.js                   | 13 ++++++++-----
 app/assets/javascripts/repo/stores/actions.js          |  6 +++---
 app/assets/stylesheets/pages/repo.scss                 | 18 ++----------------
 app/views/projects/tree/_tree_header.html.haml         |  2 +-
 app/views/shared/repo/_editable_mode.html.haml         |  2 --
 10 files changed, 24 insertions(+), 37 deletions(-)
 delete mode 100644 app/views/shared/repo/_editable_mode.html.haml

diff --git a/app/assets/javascripts/repo/components/repo.vue b/app/assets/javascripts/repo/components/repo.vue
index e072af5c151..31a88b297c0 100644
--- a/app/assets/javascripts/repo/components/repo.vue
+++ b/app/assets/javascripts/repo/components/repo.vue
@@ -11,7 +11,6 @@ export default {
   computed: {
     ...mapState([
       'currentBlobView',
-      'editMode',
     ]),
     ...mapGetters([
       'isMini',
@@ -45,13 +44,14 @@ export default {
   <div class="repository-view">
     <div class="tree-content-holder" :class="{'tree-content-holder-mini' : isMini}">
       <repo-sidebar/>
-      <div v-if="isMini"
-      class="panel-right"
-      :class="{'edit-mode': editMode}">
+      <div
+        v-if="isMini"
+        class="panel-right"
+      >
         <repo-tabs/>
         <component
           :is="currentBlobView"
-          class="blob-viewer-container"/>
+        />
         <repo-file-buttons/>
       </div>
     </div>
diff --git a/app/assets/javascripts/repo/components/repo_edit_button.vue b/app/assets/javascripts/repo/components/repo_edit_button.vue
index 59c1ed6e4be..6c1bb4b8566 100644
--- a/app/assets/javascripts/repo/components/repo_edit_button.vue
+++ b/app/assets/javascripts/repo/components/repo_edit_button.vue
@@ -28,7 +28,7 @@ export default {
 </script>
 
 <template>
-  <div>
+  <div class="editable-mode">
     <button
       v-if="canEditFile"
       class="btn btn-default"
diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue
index 8b717e2330b..9114b3a1acd 100644
--- a/app/assets/javascripts/repo/components/repo_editor.vue
+++ b/app/assets/javascripts/repo/components/repo_editor.vue
@@ -52,12 +52,13 @@ export default {
     },
     setupEditor() {
       if (!this.activeFile) return;
+      const content = this.activeFile.content !== '' ? this.activeFile.content : this.activeFile.raw;
 
       const foundLang = this.languages.find(lang =>
         lang.extensions && lang.extensions.indexOf(this.activeFileExtension) === 0,
       );
       const newModel = this.monaco.editor.createModel(
-        this.activeFile.raw, foundLang ? foundLang.id : 'plaintext',
+        content, foundLang ? foundLang.id : 'plaintext',
       );
 
       this.monacoInstance.setModel(newModel);
@@ -91,5 +92,5 @@ export default {
 </script>
 
 <template>
-<div id="ide" v-if='!shouldHideEditor'></div>
+  <div id="ide" v-if='!shouldHideEditor' class="blob-viewer-container blob-editor-container"></div>
 </template>
diff --git a/app/assets/javascripts/repo/components/repo_file.vue b/app/assets/javascripts/repo/components/repo_file.vue
index f78c9591da4..77895174f15 100644
--- a/app/assets/javascripts/repo/components/repo_file.vue
+++ b/app/assets/javascripts/repo/components/repo_file.vue
@@ -34,7 +34,6 @@
     },
     methods: {
       ...mapActions([
-        'getTreeData',
         'clickedTreeRow',
       ]),
     },
diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index 647c9079d0f..40c7811523e 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -31,7 +31,7 @@ export default {
 </script>
 
 <template>
-<div>
+<div class="blob-viewer-container">
   <div
     v-if="!activeFile.renderError"
     v-html="activeFile.html">
diff --git a/app/assets/javascripts/repo/index.js b/app/assets/javascripts/repo/index.js
index 8ca5bb45d05..480d46eab81 100644
--- a/app/assets/javascripts/repo/index.js
+++ b/app/assets/javascripts/repo/index.js
@@ -5,13 +5,13 @@ import Repo from './components/repo.vue';
 import RepoEditButton from './components/repo_edit_button.vue';
 import newBranchForm from './components/new_branch_form.vue';
 import newDropdown from './components/new_dropdown/index.vue';
-import vStore from './stores';
+import store from './stores';
 import Translate from '../vue_shared/translate';
 
 function initRepo(el) {
   return new Vue({
     el,
-    store: vStore,
+    store,
     components: {
       repo: Repo,
     },
@@ -53,17 +53,20 @@ function initRepo(el) {
 function initRepoEditButton(el) {
   return new Vue({
     el,
-    store: vStore,
+    store,
     components: {
       repoEditButton: RepoEditButton,
     },
+    render(createElement) {
+      return createElement('repo-edit-button');
+    },
   });
 }
 
 function initNewDropdown(el) {
   return new Vue({
     el,
-    store: vStore,
+    store,
     components: {
       newDropdown,
     },
@@ -83,7 +86,7 @@ function initNewBranchForm() {
     components: {
       newBranchForm,
     },
-    store: vStore,
+    store,
     render(createElement) {
       return createElement('new-branch-form');
     },
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index 191fc9635fb..c8be50116eb 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -10,9 +10,7 @@ export const setInitialData = ({ commit }, data) => commit(types.SET_INITIAL_DAT
 
 export const closeDiscardPopup = ({ commit }) => commit(types.TOGGLE_DISCARD_POPUP, false);
 
-export const discardAllChanges = ({ state, commit, getters, dispatch }) => {
-  if (state.editMode) return;
-
+export const discardAllChanges = ({ commit, getters, dispatch }) => {
   const changedFiles = getters.changedFiles;
 
   changedFiles.forEach((file) => {
@@ -82,6 +80,8 @@ export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =
       dispatch('discardAllChanges');
       dispatch('closeAllFiles');
       dispatch('toggleEditMode');
+
+      window.scrollTo(0, 0);
     }
   })
   .catch(() => flash('Error committing changes. Please try again.'));
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index b360fb7de1a..7c5f3f1126a 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -72,10 +72,6 @@
           text-decoration: underline;
         }
       }
-
-      .cursor {
-        display: none !important;
-      }
     }
 
     .blob-no-preview {
@@ -85,18 +81,8 @@
       }
     }
 
-    &.edit-mode {
-      .blob-viewer-container {
-        overflow: hidden;
-      }
-
-      .monaco-editor.vs {
-        .cursor {
-          background: $black;
-          border-color: $black;
-          display: block !important;
-        }
-      }
+    &.blob-editor-container {
+      overflow: hidden;
     }
 
     .blob-viewer-container {
diff --git a/app/views/projects/tree/_tree_header.html.haml b/app/views/projects/tree/_tree_header.html.haml
index 7ea19e6c828..40266047bad 100644
--- a/app/views/projects/tree/_tree_header.html.haml
+++ b/app/views/projects/tree/_tree_header.html.haml
@@ -9,7 +9,7 @@
 
 .tree-controls
   - if show_new_repo?
-    = render 'shared/repo/editable_mode'
+    .editable-mode
   - else
     = link_to s_('Commits|History'), project_commits_path(@project, @id), class: 'btn'
 
diff --git a/app/views/shared/repo/_editable_mode.html.haml b/app/views/shared/repo/_editable_mode.html.haml
deleted file mode 100644
index 73fdb8b523f..00000000000
--- a/app/views/shared/repo/_editable_mode.html.haml
+++ /dev/null
@@ -1,2 +0,0 @@
-.editable-mode
-  %repo-edit-button
-- 
cgit v1.2.1


From 3811fbff7a5837bf8c7e2667c1fc1a10ed544e20 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Thu, 26 Oct 2017 17:58:33 +0100
Subject: reset hash when changing files

[ci skip]
---
 app/assets/javascripts/repo/components/repo_preview.vue | 2 --
 app/assets/javascripts/repo/stores/actions/file.js      | 3 +++
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index 40c7811523e..bbe5c667254 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -15,8 +15,6 @@ export default {
   },
   mounted() {
     this.highlightFile();
-
-    // TODO: get this to work across different files
     this.lineHighlighter = new LineHighlighter({
       fileHolderSelector: '.blob-viewer-container',
       scrollFileHolder: true,
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
index eb0aa506d6c..5759ff07aef 100644
--- a/app/assets/javascripts/repo/stores/actions/file.js
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -39,6 +39,9 @@ export const setFileActive = ({ commit, state, getters, dispatch }, file) => {
 
   commit(types.SET_FILE_ACTIVE, { file, active: true });
   dispatch('scrollToTab');
+
+  // reset hash for line highlighting
+  location.hash = '';
 };
 
 export const getFileData = ({ state, commit, dispatch }, file) => {
-- 
cgit v1.2.1


From 8df62a3a6481ca04fa2debc57d41b36f0b8f3945 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Thu, 26 Oct 2017 21:03:48 +0300
Subject: Remove old code

---
 app/assets/javascripts/dispatcher.js               |   4 +-
 app/assets/javascripts/importer_status.js          | 144 ++++++++-------
 .../javascripts/issuable_bulk_update_actions.js    |   1 -
 app/assets/javascripts/issuable_index.js           | 202 ++++-----------------
 app/assets/javascripts/main.js                     |   3 +-
 5 files changed, 112 insertions(+), 242 deletions(-)

diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index f20162c48e9..d5749f650b6 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -1,6 +1,6 @@
 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-arrow-callback, wrap-iife, no-shadow, consistent-return, one-var, one-var-declaration-per-line, camelcase, default-case, no-new, quotes, no-duplicate-case, no-case-declarations, no-fallthrough, max-len */
 /* global ProjectSelect */
-/* global IssuableIndex */
+import IssuableIndex from './issuable_index';
 /* global Milestone */
 /* global IssuableForm */
 /* global LabelsSelect */
@@ -173,7 +173,7 @@ import Diff from './diff';
             filteredSearchManager.setup();
           }
           const pagePrefix = page === 'projects:merge_requests:index' ? 'merge_request_' : 'issue_';
-          IssuableIndex.init(pagePrefix);
+          new IssuableIndex(pagePrefix);
 
           shortcut_handler = new ShortcutsNavigation();
           new UsersSelect();
diff --git a/app/assets/javascripts/importer_status.js b/app/assets/javascripts/importer_status.js
index 5b4ca94ed30..99f229cc047 100644
--- a/app/assets/javascripts/importer_status.js
+++ b/app/assets/javascripts/importer_status.js
@@ -1,83 +1,81 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, camelcase, no-var, one-var, one-var-declaration-per-line, prefer-template, quotes, object-shorthand, comma-dangle, no-unused-vars, prefer-arrow-callback, no-else-return, vars-on-top, no-new, max-len */
+class ImporterStatus {
+  constructor(jobsUrl, importUrl) {
+    this.jobsUrl = jobsUrl;
+    this.importUrl = importUrl;
+    this.initStatusPage();
+    this.setAutoUpdate();
+  }
 
-(function() {
-  window.ImporterStatus = (function() {
-    function ImporterStatus(jobs_url, import_url) {
-      this.jobs_url = jobs_url;
-      this.import_url = import_url;
-      this.initStatusPage();
-      this.setAutoUpdate();
-    }
+  initStatusPage() {
+    $('.js-add-to-import')
+      .off('click')
+      .on('click', (event) => {
+        const $btn = $(event.currentTarget);
+        const $tr = $btn.closest('tr');
+        const $targetField = $tr.find('.import-target');
+        const $namespaceInput = $targetField.find('.js-select-namespace option:selected');
+        const id = $tr.attr('id').replace('repo_', '');
+        let targetNamespace;
+        let newName;
+        if ($namespaceInput.length > 0) {
+          targetNamespace = $namespaceInput[0].innerHTML;
+          newName = $targetField.find('#path').prop('value');
+          $targetField.empty().append(`${targetNamespace}/${newName}`);
+        }
+        $btn.disable().addClass('is-loading');
 
-    ImporterStatus.prototype.initStatusPage = function() {
-      $('.js-add-to-import').off('click').on('click', (function(_this) {
-        return function(e) {
-          var $btn, $namespace_input, $target_field, $tr, id, target_namespace, newName;
-          $btn = $(e.currentTarget);
-          $tr = $btn.closest('tr');
-          $target_field = $tr.find('.import-target');
-          $namespace_input = $target_field.find('.js-select-namespace option:selected');
-          id = $tr.attr('id').replace('repo_', '');
-          target_namespace = null;
-          newName = null;
-          if ($namespace_input.length > 0) {
-            target_namespace = $namespace_input[0].innerHTML;
-            newName = $target_field.find('#path').prop('value');
-            $target_field.empty().append(target_namespace + "/" + newName);
-          }
-          $btn.disable().addClass('is-loading');
-          return $.post(_this.import_url, {
-            repo_id: id,
-            target_namespace: target_namespace,
-            new_name: newName
-          }, {
-            dataType: 'script'
-          });
-        };
-      })(this));
-      return $('.js-import-all').off('click').on('click', function(e) {
-        var $btn;
-        $btn = $(this);
+        return $.post(this.importUrl, {
+          repo_id: id,
+          target_namespace: targetNamespace,
+          new_name: newName,
+        }, {
+          dataType: 'script',
+        });
+      });
+
+    $('.js-import-all')
+      .off('click')
+      .on('click', function onClickImportAll() {
+        const $btn = $(this);
         $btn.disable().addClass('is-loading');
-        return $('.js-add-to-import').each(function() {
+        return $('.js-add-to-import').each(function triggerAddImport() {
           return $(this).trigger('click');
         });
       });
-    };
+  }
+
+  setAutoUpdate() {
+    return setInterval(() => $.get(this.jobsUrl, data => $.each(data, (i, job) => {
+      const jobItem = $(`#project_${job.id}`);
+      const statusField = jobItem.find('.job-status');
 
-    ImporterStatus.prototype.setAutoUpdate = function() {
-      return setInterval(((function(_this) {
-        return function() {
-          return $.get(_this.jobs_url, function(data) {
-            return $.each(data, function(i, job) {
-              var job_item, status_field;
-              job_item = $("#project_" + job.id);
-              status_field = job_item.find(".job-status");
-              if (job.import_status === 'finished') {
-                job_item.removeClass("active").addClass("success");
-                return status_field.html('<span><i class="fa fa-check"></i> done</span>');
-              } else if (job.import_status === 'scheduled') {
-                return status_field.html("<i class='fa fa-spinner fa-spin'></i> scheduled");
-              } else if (job.import_status === 'started') {
-                return status_field.html("<i class='fa fa-spinner fa-spin'></i> started");
-              } else {
-                return status_field.html(job.import_status);
-              }
-            });
-          });
-        };
-      })(this)), 4000);
-    };
+      const spinner = '<i class="fa fa-spinner fa-spin"></i>';
 
-    return ImporterStatus;
-  })();
+      switch (job.import_status) {
+        case 'finished':
+          jobItem.removeClass('active').addClass('success');
+          statusField.html('<span><i class="fa fa-check"></i> done</span>');
+          break;
+        case 'scheduled':
+          statusField.html(`${spinner} scheduled`);
+          break;
+        case 'started':
+          statusField.html(`${spinner} started`);
+          break;
+        default:
+          statusField.html(job.import_status);
+          break;
+      }
+    })), 4000);
+  }
+}
 
-  $(function() {
-    if ($('.js-importer-status').length) {
-      var jobsImportPath = $('.js-importer-status').data('jobs-import-path');
-      var importPath = $('.js-importer-status').data('import-path');
+// eslint-disable-next-line consistent-return
+export default function initImporterStatus() {
+  const importerStatus = $('.js-importer-status');
+  const data = importerStatus.dataset;
 
-      new window.ImporterStatus(jobsImportPath, importPath);
-    }
-  });
-}).call(window);
+  if (importerStatus.length) {
+    return new ImporterStatus(data.jobsImportPath, data.importPath);
+  }
+}
diff --git a/app/assets/javascripts/issuable_bulk_update_actions.js b/app/assets/javascripts/issuable_bulk_update_actions.js
index eb15949603f..b124fafec70 100644
--- a/app/assets/javascripts/issuable_bulk_update_actions.js
+++ b/app/assets/javascripts/issuable_bulk_update_actions.js
@@ -1,5 +1,4 @@
 /* eslint-disable comma-dangle, quotes, consistent-return, func-names, array-callback-return, space-before-function-paren, prefer-arrow-callback, max-len, no-unused-expressions, no-sequences, no-underscore-dangle, no-unused-vars, no-param-reassign */
-/* global IssuableIndex */
 import _ from 'underscore';
 import Flash from './flash';
 
diff --git a/app/assets/javascripts/issuable_index.js b/app/assets/javascripts/issuable_index.js
index ece0220c927..e5c1dd50c11 100644
--- a/app/assets/javascripts/issuable_index.js
+++ b/app/assets/javascripts/issuable_index.js
@@ -1,171 +1,43 @@
-/* eslint-disable no-param-reassign, func-names, no-var, camelcase, no-unused-vars, object-shorthand, space-before-function-paren, no-return-assign, comma-dangle, consistent-return, one-var, one-var-declaration-per-line, quotes, prefer-template, prefer-arrow-callback, wrap-iife, max-len */
-/* global IssuableIndex */
-import _ from 'underscore';
 import IssuableBulkUpdateSidebar from './issuable_bulk_update_sidebar';
 import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
 
-((global) => {
-  var issuable_created;
-
-  issuable_created = false;
-
-  global.IssuableIndex = {
-    init: function(pagePrefix) {
-      IssuableIndex.initTemplates();
-      IssuableIndex.initSearch();
-      IssuableIndex.initBulkUpdate(pagePrefix);
-      IssuableIndex.initResetFilters();
-      IssuableIndex.resetIncomingEmailToken();
-      IssuableIndex.initLabelFilterRemove();
-    },
-    initTemplates: function() {
-      return IssuableIndex.labelRow = _.template('<% _.each(labels, function(label){ %> <span class="label-row btn-group" role="group" aria-label="<%- label.title %>" style="color: <%- label.text_color %>;"> <a href="#" class="btn btn-transparent has-tooltip" style="background-color: <%- label.color %>;" title="<%- label.description %>" data-container="body"> <%- label.title %> </a> <button type="button" class="btn btn-transparent label-remove js-label-filter-remove" style="background-color: <%- label.color %>;" data-label="<%- label.title %>"> <i class="fa fa-times"></i> </button> </span> <% }); %>');
-    },
-    initSearch: function() {
-      const $searchInput = $('#issuable_search');
-
-      IssuableIndex.initSearchState($searchInput);
-
-      // `immediate` param set to false debounces on the `trailing` edge, lets user finish typing
-      const debouncedExecSearch = _.debounce(IssuableIndex.executeSearch, 1000, false);
-
-      $searchInput.off('keyup').on('keyup', debouncedExecSearch);
-
-      // ensures existing filters are preserved when manually submitted
-      $('#issuable_search_form').on('submit', (e) => {
-        e.preventDefault();
-        debouncedExecSearch(e);
-      });
-    },
-    initSearchState: function($searchInput) {
-      const currentSearchVal = $searchInput.val();
-
-      IssuableIndex.searchState = {
-        elem: $searchInput,
-        current: currentSearchVal
-      };
-
-      IssuableIndex.maybeFocusOnSearch();
-    },
-    accessSearchPristine: function(set) {
-      // store reference to previous value to prevent search on non-mutating keyup
-      const state = IssuableIndex.searchState;
-      const currentSearchVal = state.elem.val();
-
-      if (set) {
-        state.current = currentSearchVal;
-      } else {
-        return state.current === currentSearchVal;
-      }
-    },
-    maybeFocusOnSearch: function() {
-      const currentSearchVal = IssuableIndex.searchState.current;
-      if (currentSearchVal && currentSearchVal !== '') {
-        const queryLength = currentSearchVal.length;
-        const $searchInput = IssuableIndex.searchState.elem;
-
-      /* The following ensures that the cursor is initially placed at
-        * the end of search input when focus is applied. It accounts
-        * for differences in browser implementations of `setSelectionRange`
-        * and cursor placement for elements in focus.
-      */
-        $searchInput.focus();
-        if ($searchInput.setSelectionRange) {
-          $searchInput.setSelectionRange(queryLength, queryLength);
-        } else {
-          $searchInput.val(currentSearchVal);
-        }
-      }
-    },
-    executeSearch: function(e) {
-      const $search = $('#issuable_search');
-      const $searchName = $search.attr('name');
-      const $searchValue = $search.val();
-      const $filtersForm = $('.js-filter-form');
-      const $input = $(`input[name='${$searchName}']`, $filtersForm);
-      const isPristine = IssuableIndex.accessSearchPristine();
-
-      if (isPristine) {
-        return;
-      }
-
-      if (!$input.length) {
-        $filtersForm.append(`<input type='hidden' name='${$searchName}' value='${_.escape($searchValue)}'/>`);
-      } else {
-        $input.val($searchValue);
-      }
-
-      IssuableIndex.filterResults($filtersForm);
-    },
-    initLabelFilterRemove: function() {
-      return $(document).off('click', '.js-label-filter-remove').on('click', '.js-label-filter-remove', function(e) {
-        var $button;
-        $button = $(this);
-        // Remove the label input box
-        $('input[name="label_name[]"]').filter(function() {
-          return this.value === $button.data('label');
-        }).remove();
-        // Submit the form to get new data
-        IssuableIndex.filterResults($('.filter-form'));
-      });
-    },
-    filterResults: (function(_this) {
-      return function(form) {
-        var formAction, formData, issuesUrl;
-        formData = form.serializeArray();
-        formData = formData.filter(function(data) {
-          return data.value !== '';
-        });
-        formData = $.param(formData);
-        formAction = form.attr('action');
-        issuesUrl = formAction;
-        issuesUrl += "" + (formAction.indexOf('?') === -1 ? '?' : '&');
-        issuesUrl += formData;
-        return gl.utils.visitUrl(issuesUrl);
-      };
-    })(this),
-    initResetFilters: function() {
-      $('.reset-filters').on('click', function(e) {
-        e.preventDefault();
-        const target = e.target;
-        const $form = $(target).parents('.js-filter-form');
-        const baseIssuesUrl = target.href;
-
-        $form.attr('action', baseIssuesUrl);
-        gl.utils.visitUrl(baseIssuesUrl);
+export default class IssuableIndex {
+  constructor(pagePrefix) {
+    this.initBulkUpdate(pagePrefix);
+    IssuableIndex.resetIncomingEmailToken();
+    this.initLabelFilterRemove();
+  }
+  initBulkUpdate(pagePrefix) {
+    const userCanBulkUpdate = $('.issues-bulk-update').length > 0;
+    const alreadyInitialized = !!this.bulkUpdateSidebar;
+
+    if (userCanBulkUpdate && !alreadyInitialized) {
+      IssuableBulkUpdateActions.init({
+        prefixId: pagePrefix,
       });
-    },
-    initBulkUpdate: function(pagePrefix) {
-      const userCanBulkUpdate = $('.issues-bulk-update').length > 0;
-      const alreadyInitialized = !!this.bulkUpdateSidebar;
-
-      if (userCanBulkUpdate && !alreadyInitialized) {
-        IssuableBulkUpdateActions.init({
-          prefixId: pagePrefix,
-        });
-
-        this.bulkUpdateSidebar = new IssuableBulkUpdateSidebar();
-      }
-    },
-    resetIncomingEmailToken: function() {
-      $('.incoming-email-token-reset').on('click', function(e) {
-        e.preventDefault();
 
-        $.ajax({
-          type: 'PUT',
-          url: $('.incoming-email-token-reset').attr('href'),
-          dataType: 'json',
-          success: function(response) {
-            $('#issue_email').val(response.new_issue_address).focus();
-          },
-          beforeSend: function() {
-            $('.incoming-email-token-reset').text('resetting...');
-          },
-          complete: function() {
-            $('.incoming-email-token-reset').text('reset it');
-          }
-        });
-      });
+      this.bulkUpdateSidebar = new IssuableBulkUpdateSidebar();
     }
-  };
-})(window);
+  }
+
+  static resetIncomingEmailToken() {
+    $('.incoming-email-token-reset').on('click', (e) => {
+      e.preventDefault();
+
+      $.ajax({
+        type: 'PUT',
+        url: $('.incoming-email-token-reset').attr('href'),
+        dataType: 'json',
+        success(response) {
+          $('#issue_email').val(response.new_issue_address).focus();
+        },
+        beforeSend() {
+          $('.incoming-email-token-reset').text('resetting...');
+        },
+        complete() {
+          $('.incoming-email-token-reset').text('reset it');
+        },
+      });
+    });
+  }
+}
diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 52715fba43f..00a94c45b47 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -57,7 +57,7 @@ import './gl_field_errors';
 import './gl_form';
 import './groups_select';
 import './header';
-import './importer_status';
+import initImporterStatus from './importer_status';
 import './issuable_index';
 import './issuable_context';
 import './issuable_form';
@@ -140,6 +140,7 @@ $(function () {
   var fitSidebarForSize;
 
   initBreadcrumbs();
+  initImporterStatus();
 
   // Set the default path for all cookies to GitLab's root directory
   Cookies.defaults.path = gon.relative_url_root || '/';
-- 
cgit v1.2.1


From cf542f9ed0ff54e9072eca250244662808b80eab Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Thu, 26 Oct 2017 23:02:57 +0300
Subject: Improves issuable tests Fixes missing dependencies

---
 .../javascripts/issuable_bulk_update_sidebar.js    |   4 +
 app/assets/javascripts/issuable_index.js           |   1 -
 spec/javascripts/issuable_spec.js                  | 102 +++++++--------------
 3 files changed, 37 insertions(+), 70 deletions(-)

diff --git a/app/assets/javascripts/issuable_bulk_update_sidebar.js b/app/assets/javascripts/issuable_bulk_update_sidebar.js
index 0e8a0519928..bb509089b1d 100644
--- a/app/assets/javascripts/issuable_bulk_update_sidebar.js
+++ b/app/assets/javascripts/issuable_bulk_update_sidebar.js
@@ -5,6 +5,10 @@
 /* global SubscriptionSelect */
 
 import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
+import './milestone_select';
+import './issue_status_select';
+import './subscription_select';
+import './labels_select';
 
 const HIDDEN_CLASS = 'hidden';
 const DISABLED_CONTENT_CLASS = 'disabled-content';
diff --git a/app/assets/javascripts/issuable_index.js b/app/assets/javascripts/issuable_index.js
index e5c1dd50c11..0b123a11a3b 100644
--- a/app/assets/javascripts/issuable_index.js
+++ b/app/assets/javascripts/issuable_index.js
@@ -5,7 +5,6 @@ export default class IssuableIndex {
   constructor(pagePrefix) {
     this.initBulkUpdate(pagePrefix);
     IssuableIndex.resetIncomingEmailToken();
-    this.initLabelFilterRemove();
   }
   initBulkUpdate(pagePrefix) {
     const userCanBulkUpdate = $('.issues-bulk-update').length > 0;
diff --git a/spec/javascripts/issuable_spec.js b/spec/javascripts/issuable_spec.js
index 45f55395d3a..ceee08d47c5 100644
--- a/spec/javascripts/issuable_spec.js
+++ b/spec/javascripts/issuable_spec.js
@@ -1,80 +1,44 @@
-/* global IssuableIndex */
-
-import '~/lib/utils/url_utility';
-import '~/issuable_index';
-
-(() => {
-  const BASE_URL = '/user/project/issues?scope=all&state=closed';
-  const DEFAULT_PARAMS = '&utf8=%E2%9C%93';
-
-  function updateForm(formValues, form) {
-    $.each(formValues, (id, value) => {
-      $(`#${id}`, form).val(value);
-    });
-  }
-
-  function resetForm(form) {
-    $('input[name!="utf8"]', form).each((index, input) => {
-      input.setAttribute('value', '');
+import IssuableIndex from '~/issuable_index';
+
+describe('Issuable', () => {
+  let Issuable;
+  describe('initBulkUpdate', () => {
+    it('should not set bulkUpdateSidebar', () => {
+      Issuable = new IssuableIndex('issue_');
+      expect(Issuable.bulkUpdateSidebar).not.toBeDefined();
     });
-  }
 
-  describe('Issuable', () => {
-    preloadFixtures('static/issuable_filter.html.raw');
+    it('should set bulkUpdateSidebar', () => {
+      const element = document.createElement('div');
+      element.classList.add('issues-bulk-update');
+      document.body.appendChild(element);
 
-    beforeEach(() => {
-      loadFixtures('static/issuable_filter.html.raw');
-      IssuableIndex.init();
-    });
-
-    it('should be defined', () => {
-      expect(window.IssuableIndex).toBeDefined();
+      Issuable = new IssuableIndex('issue_');
+      expect(Issuable.bulkUpdateSidebar).toBeDefined();
     });
+  });
 
-    describe('filtering', () => {
-      let $filtersForm;
-
-      beforeEach(() => {
-        $filtersForm = $('.js-filter-form');
-        loadFixtures('static/issuable_filter.html.raw');
-        resetForm($filtersForm);
-      });
-
-      it('should contain only the default parameters', () => {
-        spyOn(gl.utils, 'visitUrl');
-
-        IssuableIndex.filterResults($filtersForm);
-
-        expect(gl.utils.visitUrl).toHaveBeenCalledWith(BASE_URL + DEFAULT_PARAMS);
-      });
-
-      it('should filter for the phrase "broken"', () => {
-        spyOn(gl.utils, 'visitUrl');
-
-        updateForm({ search: 'broken' }, $filtersForm);
-        IssuableIndex.filterResults($filtersForm);
-        const params = `${DEFAULT_PARAMS}&search=broken`;
-
-        expect(gl.utils.visitUrl).toHaveBeenCalledWith(BASE_URL + params);
-      });
-
-      it('should keep query parameters after modifying filter', () => {
-        spyOn(gl.utils, 'visitUrl');
+  describe('resetIncomingEmailToken', () => {
+    beforeEach(() => {
+      const element = document.createElement('a');
+      element.classList.add('incoming-email-token-reset');
+      element.setAttribute('href', 'foo');
+      document.body.appendChild(element);
 
-        // initial filter
-        updateForm({ milestone_title: 'v1.0' }, $filtersForm);
+      const input = document.createElement('input');
+      input.setAttribute('id', 'issue_email');
+      document.body.appendChild(input);
 
-        IssuableIndex.filterResults($filtersForm);
-        let params = `${DEFAULT_PARAMS}&milestone_title=v1.0`;
-        expect(gl.utils.visitUrl).toHaveBeenCalledWith(BASE_URL + params);
+      Issuable = new IssuableIndex('issue_');
+    });
 
-        // update filter
-        updateForm({ label_name: 'Frontend' }, $filtersForm);
+    it('should send request to reset email token', () => {
+      spyOn(jQuery, 'ajax').and.callThrough();
+      document.querySelector('.incoming-email-token-reset').click();
 
-        IssuableIndex.filterResults($filtersForm);
-        params = `${DEFAULT_PARAMS}&milestone_title=v1.0&label_name=Frontend`;
-        expect(gl.utils.visitUrl).toHaveBeenCalledWith(BASE_URL + params);
-      });
+      expect(jQuery.ajax).toHaveBeenCalled();
+      expect(jQuery.ajax.calls.argsFor(0)[0].url).toEqual('foo');
     });
   });
-})();
+});
+
-- 
cgit v1.2.1


From a665a35438fe1ddf96228918fd99f790de9b6517 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Thu, 26 Oct 2017 23:14:18 +0300
Subject: Remove issuableContext from global namespace

---
 .../javascripts/boards/components/board_sidebar.js |   2 +-
 app/assets/javascripts/init_issuable_sidebar.js    |   2 +-
 app/assets/javascripts/issuable_context.js         | 113 ++++++++++-----------
 app/assets/javascripts/main.js                     |   2 -
 spec/javascripts/issuable_context_spec.js          |   3 +-
 spec/javascripts/labels_issue_sidebar_spec.js      |   2 +-
 6 files changed, 60 insertions(+), 64 deletions(-)

diff --git a/app/assets/javascripts/boards/components/board_sidebar.js b/app/assets/javascripts/boards/components/board_sidebar.js
index c1f902a785a..6fa41dbd0dd 100644
--- a/app/assets/javascripts/boards/components/board_sidebar.js
+++ b/app/assets/javascripts/boards/components/board_sidebar.js
@@ -1,5 +1,5 @@
 /* eslint-disable comma-dangle, space-before-function-paren, no-new */
-/* global IssuableContext */
+import IssuableContext from '../../issuable_context';
 /* global MilestoneSelect */
 /* global LabelsSelect */
 /* global Sidebar */
diff --git a/app/assets/javascripts/init_issuable_sidebar.js b/app/assets/javascripts/init_issuable_sidebar.js
index 32a1a269f9a..6f476f96f72 100644
--- a/app/assets/javascripts/init_issuable_sidebar.js
+++ b/app/assets/javascripts/init_issuable_sidebar.js
@@ -1,7 +1,7 @@
 /* eslint-disable no-new */
 /* global MilestoneSelect */
 /* global LabelsSelect */
-/* global IssuableContext */
+import IssuableContext from './issuable_context';
 /* global Sidebar */
 
 import DueDateSelectors from './due_date_select';
diff --git a/app/assets/javascripts/issuable_context.js b/app/assets/javascripts/issuable_context.js
index 73791edaebb..5bc7f8d9cb9 100644
--- a/app/assets/javascripts/issuable_context.js
+++ b/app/assets/javascripts/issuable_context.js
@@ -1,33 +1,35 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-new, comma-dangle, quotes, prefer-arrow-callback, consistent-return, one-var, no-var, one-var-declaration-per-line, no-underscore-dangle, max-len */
 import Cookies from 'js-cookie';
 import bp from './breakpoints';
 import UsersSelect from './users_select';
 
 const PARTICIPANTS_ROW_COUNT = 7;
 
-(function() {
-  this.IssuableContext = (function() {
-    function IssuableContext(currentUser) {
-      this.initParticipants();
-      new UsersSelect(currentUser);
-      $('select.select2').select2({
-        width: 'resolve',
-        dropdownAutoWidth: true
-      });
-      $(".issuable-sidebar .inline-update").on("change", "select", function() {
-        return $(this).submit();
-      });
-      $(".issuable-sidebar .inline-update").on("change", ".js-assignee", function() {
-        return $(this).submit();
-      });
-      $(document).off('click', '.issuable-sidebar .dropdown-content a').on('click', '.issuable-sidebar .dropdown-content a', function(e) {
-        return e.preventDefault();
-      });
-      $(document).off('click', '.edit-link').on('click', '.edit-link', function(e) {
-        var $block, $selectbox;
+export default class IssuableContext {
+  constructor(currentUser) {
+    this.initParticipants();
+    this.userSelect = new UsersSelect(currentUser);
+
+    $('select.select2').select2({
+      width: 'resolve',
+      dropdownAutoWidth: true,
+    });
+
+    $('.issuable-sidebar .inline-update').on('change', 'select', function onClickSelect() {
+      return $(this).submit();
+    });
+    $('.issuable-sidebar .inline-update').on('change', '.js-assignee', function onClickAssignee() {
+      return $(this).submit();
+    });
+    $(document)
+      .off('click', '.issuable-sidebar .dropdown-content a')
+      .on('click', '.issuable-sidebar .dropdown-content a', e => e.preventDefault());
+
+    $(document)
+      .off('click', '.edit-link')
+      .on('click', '.edit-link', function onClickEdit(e) {
         e.preventDefault();
-        $block = $(this).parents('.block');
-        $selectbox = $block.find('.selectbox');
+        const $block = $(this).parents('.block');
+        const $selectbox = $block.find('.selectbox');
         if ($selectbox.is(':visible')) {
           $selectbox.hide();
           $block.find('.value').show();
@@ -35,46 +37,43 @@ const PARTICIPANTS_ROW_COUNT = 7;
           $selectbox.show();
           $block.find('.value').hide();
         }
+
         if ($selectbox.is(':visible')) {
-          return setTimeout(function() {
-            return $block.find('.dropdown-menu-toggle').trigger('click');
-          }, 0);
+          setTimeout(() => $block.find('.dropdown-menu-toggle').trigger('click'), 0);
         }
       });
-      window.addEventListener('beforeunload', function() {
-        // collapsed_gutter cookie hides the sidebar
-        var bpBreakpoint = bp.getBreakpointSize();
-        if (bpBreakpoint === 'xs' || bpBreakpoint === 'sm') {
-          Cookies.set('collapsed_gutter', true);
-        }
-      });
-    }
 
-    IssuableContext.prototype.initParticipants = function() {
-      $(document).on('click', '.js-participants-more', this.toggleHiddenParticipants);
-      return $('.js-participants-author').each(function(i) {
-        if (i >= PARTICIPANTS_ROW_COUNT) {
-          return $(this).addClass('js-participants-hidden').hide();
-        }
-      });
-    };
+    window.addEventListener('beforeunload', () => {
+      // collapsed_gutter cookie hides the sidebar
+      const bpBreakpoint = bp.getBreakpointSize();
+      if (bpBreakpoint === 'xs' || bpBreakpoint === 'sm') {
+        Cookies.set('collapsed_gutter', true);
+      }
+    });
+  }
 
-    IssuableContext.prototype.toggleHiddenParticipants = function() {
-      const currentText = $(this).text().trim();
-      const lessText = $(this).data('less-text');
-      const originalText = $(this).data('original-text');
+  initParticipants() {
+    $(document).on('click', '.js-participants-more', this.toggleHiddenParticipants);
+    return $('.js-participants-author').each(function forEachAuthor(i) {
+      if (i >= PARTICIPANTS_ROW_COUNT) {
+        $(this).addClass('js-participants-hidden').hide();
+      }
+    });
+  }
 
-      if (currentText === originalText) {
-        $(this).text(lessText);
+  toggleHiddenParticipants() {
+    const currentText = $(this).text().trim();
+    const lessText = $(this).data('less-text');
+    const originalText = $(this).data('original-text');
 
-        if (gl.lazyLoader) gl.lazyLoader.loadCheck();
-      } else {
-        $(this).text(originalText);
-      }
+    if (currentText === originalText) {
+      $(this).text(lessText);
 
-      $('.js-participants-hidden').toggle();
-    };
+      if (gl.lazyLoader) gl.lazyLoader.loadCheck();
+    } else {
+      $(this).text(originalText);
+    }
 
-    return IssuableContext;
-  })();
-}).call(window);
+    $('.js-participants-hidden').toggle();
+  }
+}
diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 00a94c45b47..94951cfbdfe 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -58,8 +58,6 @@ import './gl_form';
 import './groups_select';
 import './header';
 import initImporterStatus from './importer_status';
-import './issuable_index';
-import './issuable_context';
 import './issuable_form';
 import './issue';
 import './issue_status_select';
diff --git a/spec/javascripts/issuable_context_spec.js b/spec/javascripts/issuable_context_spec.js
index bcb2b7b24a0..f266209027a 100644
--- a/spec/javascripts/issuable_context_spec.js
+++ b/spec/javascripts/issuable_context_spec.js
@@ -1,6 +1,5 @@
-/* global IssuableContext */
-import '~/issuable_context';
 import $ from 'jquery';
+import IssuableContext from '~/issuable_context';
 
 describe('IssuableContext', () => {
   describe('toggleHiddenParticipants', () => {
diff --git a/spec/javascripts/labels_issue_sidebar_spec.js b/spec/javascripts/labels_issue_sidebar_spec.js
index e47adc49224..775a81d3d78 100644
--- a/spec/javascripts/labels_issue_sidebar_spec.js
+++ b/spec/javascripts/labels_issue_sidebar_spec.js
@@ -1,5 +1,5 @@
 /* eslint-disable no-new */
-/* global IssuableContext */
+import IssuableContext from '~/issuable_context';
 /* global LabelsSelect */
 
 import '~/gl_dropdown';
-- 
cgit v1.2.1


From 94743e0e8fa80f9dc2f2200f33c7047e859ee12d Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Thu, 26 Oct 2017 23:21:55 +0300
Subject: Remove issuable form from global namespace

---
 .../javascripts/boards/components/board_sidebar.js |   2 +-
 app/assets/javascripts/dispatcher.js               |   2 +-
 app/assets/javascripts/issuable_form.js            | 195 ++++++++++-----------
 spec/javascripts/labels_issue_sidebar_spec.js      |   1 -
 4 files changed, 98 insertions(+), 102 deletions(-)

diff --git a/app/assets/javascripts/boards/components/board_sidebar.js b/app/assets/javascripts/boards/components/board_sidebar.js
index 6fa41dbd0dd..5d27518ac85 100644
--- a/app/assets/javascripts/boards/components/board_sidebar.js
+++ b/app/assets/javascripts/boards/components/board_sidebar.js
@@ -1,5 +1,4 @@
 /* eslint-disable comma-dangle, space-before-function-paren, no-new */
-import IssuableContext from '../../issuable_context';
 /* global MilestoneSelect */
 /* global LabelsSelect */
 /* global Sidebar */
@@ -11,6 +10,7 @@ import AssigneeTitle from '../../sidebar/components/assignees/assignee_title';
 import Assignees from '../../sidebar/components/assignees/assignees';
 import DueDateSelectors from '../../due_date_select';
 import './sidebar/remove_issue';
+import IssuableContext from '../../issuable_context';
 
 const Store = gl.issueBoards.BoardsStore;
 
diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index d5749f650b6..4ae23f0da55 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -2,7 +2,7 @@
 /* global ProjectSelect */
 import IssuableIndex from './issuable_index';
 /* global Milestone */
-/* global IssuableForm */
+import IssuableForm from './issuable_form';
 /* global LabelsSelect */
 /* global MilestoneSelect */
 /* global NewBranchForm */
diff --git a/app/assets/javascripts/issuable_form.js b/app/assets/javascripts/issuable_form.js
index cd2562bc6a9..765c84f673a 100644
--- a/app/assets/javascripts/issuable_form.js
+++ b/app/assets/javascripts/issuable_form.js
@@ -1,4 +1,4 @@
-/* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, no-use-before-define, no-useless-escape, no-new, quotes, object-shorthand, no-unused-vars, comma-dangle, no-alert, consistent-return, no-else-return, prefer-template, one-var, one-var-declaration-per-line, curly, max-len */
+/* eslint-disable func-names, prefer-rest-params, wrap-iife, no-use-before-define, no-useless-escape, no-new, object-shorthand, no-unused-vars, comma-dangle, no-alert, consistent-return, no-else-return, prefer-template, one-var, one-var-declaration-per-line, curly, max-len */
 /* global GitLab */
 /* global Autosave */
 
@@ -8,103 +8,100 @@ import GfmAutoComplete from './gfm_auto_complete';
 import ZenMode from './zen_mode';
 import { parsePikadayDate, pikadayToString } from './lib/utils/datefix';
 
-(function() {
-  this.IssuableForm = (function() {
-    IssuableForm.prototype.wipRegex = /^\s*(\[WIP\]\s*|WIP:\s*|WIP\s+)+\s*/i;
-
-    function IssuableForm(form) {
-      var $issuableDueDate, calendar;
-      this.form = form;
-      this.toggleWip = this.toggleWip.bind(this);
-      this.renderWipExplanation = this.renderWipExplanation.bind(this);
-      this.resetAutosave = this.resetAutosave.bind(this);
-      this.handleSubmit = this.handleSubmit.bind(this);
-      new GfmAutoComplete(gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources).setup();
-      new UsersSelect();
-      new ZenMode();
-      this.titleField = this.form.find("input[name*='[title]']");
-      this.descriptionField = this.form.find("textarea[name*='[description]']");
-      if (!(this.titleField.length && this.descriptionField.length)) {
-        return;
-      }
-      this.initAutosave();
-      this.form.on("submit", this.handleSubmit);
-      this.form.on("click", ".btn-cancel", this.resetAutosave);
-      this.initWip();
-      $issuableDueDate = $('#issuable-due-date');
-      if ($issuableDueDate.length) {
-        calendar = new Pikaday({
-          field: $issuableDueDate.get(0),
-          theme: 'gitlab-theme animate-picker',
-          format: 'yyyy-mm-dd',
-          container: $issuableDueDate.parent().get(0),
-          parse: dateString => parsePikadayDate(dateString),
-          toString: date => pikadayToString(date),
-          onSelect: function(dateText) {
-            $issuableDueDate.val(calendar.toString(dateText));
-          }
-        });
-        calendar.setDate(parsePikadayDate($issuableDueDate.val()));
-      }
+export default class IssuableForm {
+  constructor(form) {
+    this.form = form;
+    this.toggleWip = this.toggleWip.bind(this);
+    this.renderWipExplanation = this.renderWipExplanation.bind(this);
+    this.resetAutosave = this.resetAutosave.bind(this);
+    this.handleSubmit = this.handleSubmit.bind(this);
+    this.wipRegex = /^\s*(\[WIP\]\s*|WIP:\s*|WIP\s+)+\s*/i;
+
+    new GfmAutoComplete(gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources).setup();
+    new UsersSelect();
+    new ZenMode();
+
+    this.titleField = this.form.find('input[name*="[title]"]');
+    this.descriptionField = this.form.find('textarea[name*="[description]"]');
+    if (!(this.titleField.length && this.descriptionField.length)) {
+      return;
     }
 
-    IssuableForm.prototype.initAutosave = function() {
-      new Autosave(this.titleField, [document.location.pathname, document.location.search, "title"]);
-      return new Autosave(this.descriptionField, [document.location.pathname, document.location.search, "description"]);
-    };
-
-    IssuableForm.prototype.handleSubmit = function() {
-      return this.resetAutosave();
-    };
-
-    IssuableForm.prototype.resetAutosave = function() {
-      this.titleField.data("autosave").reset();
-      return this.descriptionField.data("autosave").reset();
-    };
-
-    IssuableForm.prototype.initWip = function() {
-      this.$wipExplanation = this.form.find(".js-wip-explanation");
-      this.$noWipExplanation = this.form.find(".js-no-wip-explanation");
-      if (!(this.$wipExplanation.length && this.$noWipExplanation.length)) {
-        return;
-      }
-      this.form.on("click", ".js-toggle-wip", this.toggleWip);
-      this.titleField.on("keyup blur", this.renderWipExplanation);
-      return this.renderWipExplanation();
-    };
-
-    IssuableForm.prototype.workInProgress = function() {
-      return this.wipRegex.test(this.titleField.val());
-    };
-
-    IssuableForm.prototype.renderWipExplanation = function() {
-      if (this.workInProgress()) {
-        this.$wipExplanation.show();
-        return this.$noWipExplanation.hide();
-      } else {
-        this.$wipExplanation.hide();
-        return this.$noWipExplanation.show();
-      }
-    };
-
-    IssuableForm.prototype.toggleWip = function(event) {
-      event.preventDefault();
-      if (this.workInProgress()) {
-        this.removeWip();
-      } else {
-        this.addWip();
-      }
-      return this.renderWipExplanation();
-    };
-
-    IssuableForm.prototype.removeWip = function() {
-      return this.titleField.val(this.titleField.val().replace(this.wipRegex, ""));
-    };
-
-    IssuableForm.prototype.addWip = function() {
-      return this.titleField.val("WIP: " + (this.titleField.val()));
-    };
-
-    return IssuableForm;
-  })();
-}).call(window);
+    this.initAutosave();
+    this.form.on('submit', this.handleSubmit);
+    this.form.on('click', '.btn-cancel', this.resetAutosave);
+    this.initWip();
+
+    const $issuableDueDate = $('#issuable-due-date');
+
+    if ($issuableDueDate.length) {
+      const calendar = new Pikaday({
+        field: $issuableDueDate.get(0),
+        theme: 'gitlab-theme animate-picker',
+        format: 'yyyy-mm-dd',
+        container: $issuableDueDate.parent().get(0),
+        parse: dateString => parsePikadayDate(dateString),
+        toString: date => pikadayToString(date),
+        onSelect: dateText => $issuableDueDate.val(calendar.toString(dateText)),
+      });
+      calendar.setDate(parsePikadayDate($issuableDueDate.val()));
+    }
+  }
+
+  initAutosave() {
+    new Autosave(this.titleField, [document.location.pathname, document.location.search, 'title']);
+    return new Autosave(this.descriptionField, [document.location.pathname, document.location.search, 'description']);
+  }
+
+  handleSubmit() {
+    return this.resetAutosave();
+  }
+
+  resetAutosave() {
+    this.titleField.data('autosave').reset();
+    return this.descriptionField.data('autosave').reset();
+  }
+
+  initWip() {
+    this.$wipExplanation = this.form.find('.js-wip-explanation');
+    this.$noWipExplanation = this.form.find('.js-no-wip-explanation');
+    if (!(this.$wipExplanation.length && this.$noWipExplanation.length)) {
+      return;
+    }
+    this.form.on('click', '.js-toggle-wip', this.toggleWip);
+    this.titleField.on('keyup blur', this.renderWipExplanation);
+    return this.renderWipExplanation();
+  }
+
+  workInProgress() {
+    return this.wipRegex.test(this.titleField.val());
+  }
+
+  renderWipExplanation() {
+    if (this.workInProgress()) {
+      this.$wipExplanation.show();
+      return this.$noWipExplanation.hide();
+    } else {
+      this.$wipExplanation.hide();
+      return this.$noWipExplanation.show();
+    }
+  }
+
+  toggleWip(event) {
+    event.preventDefault();
+    if (this.workInProgress()) {
+      this.removeWip();
+    } else {
+      this.addWip();
+    }
+    return this.renderWipExplanation();
+  }
+
+  removeWip() {
+    return this.titleField.val(this.titleField.val().replace(this.wipRegex, ''));
+  }
+
+  addWip() {
+    this.titleField.val(`WIP: ${(this.titleField.val())}`);
+  }
+}
diff --git a/spec/javascripts/labels_issue_sidebar_spec.js b/spec/javascripts/labels_issue_sidebar_spec.js
index 775a81d3d78..4e66304e0ad 100644
--- a/spec/javascripts/labels_issue_sidebar_spec.js
+++ b/spec/javascripts/labels_issue_sidebar_spec.js
@@ -6,7 +6,6 @@ import '~/gl_dropdown';
 import 'select2';
 import '~/api';
 import '~/create_label';
-import '~/issuable_context';
 import '~/users_select';
 import '~/labels_select';
 
-- 
cgit v1.2.1


From 9ced16d914861933293402cde33b079536e49325 Mon Sep 17 00:00:00 2001
From: Bob Van Landuyt <bob@vanlanduyt.co>
Date: Fri, 27 Oct 2017 13:12:47 +0200
Subject: Add missing circuitbreaker metrics to prometheus documentation

---
 doc/administration/monitoring/prometheus/gitlab_metrics.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/doc/administration/monitoring/prometheus/gitlab_metrics.md b/doc/administration/monitoring/prometheus/gitlab_metrics.md
index 6baae20d16a..11d5e077a36 100644
--- a/doc/administration/monitoring/prometheus/gitlab_metrics.md
+++ b/doc/administration/monitoring/prometheus/gitlab_metrics.md
@@ -20,7 +20,7 @@ it, the client IP needs to be [included in a whitelist][whitelist].
 Currently the embedded Prometheus server is not automatically configured to
 collect metrics from this endpoint. We recommend setting up another Prometheus
 server, because the embedded server configuration is overwritten once every
-[reconfigure of GitLab][reconfigure]. In the future this will not be required. 
+[reconfigure of GitLab][reconfigure]. In the future this will not be required.
 
 ## Metrics available
 
@@ -45,6 +45,8 @@ In this experimental phase, only a few metrics are available:
 | redis_ping_success                | Gauge     | 9.4   | Whether or not the last redis ping succeeded |
 | redis_ping_latency_seconds        | Gauge     | 9.4   | Round trip time of the redis ping |
 | user_session_logins_total         | Counter   | 9.4   | Counter of how many users have logged in |
+| filesystem_circuitbreaker_latency_seconds | Histogram | 9.5 | Latency of the stat check the circuitbreaker uses to probe a shard |
+| filesystem_circuitbreaker         | Gauge     | 9.5   | Wether or not the circuit for a certain shard is broken or not |
 
 ## Metrics shared directory
 
-- 
cgit v1.2.1


From 48851ff308032105234b781c61bfae8f312aced7 Mon Sep 17 00:00:00 2001
From: Brett Walker <bwalker@gitlab.com>
Date: Fri, 27 Oct 2017 15:20:46 +0200
Subject: add changelog entry

---
 changelogs/unreleased/39366-email-confirmation-fails.yml | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 changelogs/unreleased/39366-email-confirmation-fails.yml

diff --git a/changelogs/unreleased/39366-email-confirmation-fails.yml b/changelogs/unreleased/39366-email-confirmation-fails.yml
new file mode 100644
index 00000000000..7f6a753f8c8
--- /dev/null
+++ b/changelogs/unreleased/39366-email-confirmation-fails.yml
@@ -0,0 +1,5 @@
+---
+title: 'Fix #39366 : E-mail confirmation fails: NoMethodError: undefined method "username"'
+merge_request: 15010
+author:
+type: fixed
-- 
cgit v1.2.1


From ba9b4c4de86aa816e5ddc7a9cde9193c43835223 Mon Sep 17 00:00:00 2001
From: Sean McGivern <sean@gitlab.com>
Date: Fri, 27 Oct 2017 14:20:55 +0100
Subject: Avoid hitting statement timeout finding MR pipelines

For MRs with many thousands of commits, `SELECT DISTINCT(sha)` will be very
slow.

What we can't do to fix this:

1. Add an index. Postgres won't use it for DISTINCT without a lot of ceremony.
2. Do the `uniq` in Ruby. That can still be very slow with hundreds of
   thousands of commits.
3. Use a subquery. We haven't removed the `st_commits` column yet, but we will
   soon.

Until 3 is available to us, we can just do 2, but also add a limit clause. There
is no ordering, so this may return different results, but our goal with these
MRs is just to get them to load, so it's not a huge deal.
---
 app/models/merge_request.rb                                          | 2 +-
 ...rycanceled-error-canceling-statement-due-to-statement-timeout.yml | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)
 create mode 100644 changelogs/unreleased/39054-activerecord-statementinvalid-pg-querycanceled-error-canceling-statement-due-to-statement-timeout.yml

diff --git a/app/models/merge_request.rb b/app/models/merge_request.rb
index c3fae16d109..b0a0c753c09 100644
--- a/app/models/merge_request.rb
+++ b/app/models/merge_request.rb
@@ -874,7 +874,7 @@ class MergeRequest < ActiveRecord::Base
   #
   def all_commit_shas
     if persisted?
-      column_shas = MergeRequestDiffCommit.where(merge_request_diff: merge_request_diffs).pluck('DISTINCT(sha)')
+      column_shas = MergeRequestDiffCommit.where(merge_request_diff: merge_request_diffs).limit(10_000).pluck('sha')
       serialised_shas = merge_request_diffs.where.not(st_commits: nil).flat_map(&:commit_shas)
 
       (column_shas + serialised_shas).uniq
diff --git a/changelogs/unreleased/39054-activerecord-statementinvalid-pg-querycanceled-error-canceling-statement-due-to-statement-timeout.yml b/changelogs/unreleased/39054-activerecord-statementinvalid-pg-querycanceled-error-canceling-statement-due-to-statement-timeout.yml
new file mode 100644
index 00000000000..47bf30ecb5a
--- /dev/null
+++ b/changelogs/unreleased/39054-activerecord-statementinvalid-pg-querycanceled-error-canceling-statement-due-to-statement-timeout.yml
@@ -0,0 +1,5 @@
+---
+title: Stop merge requests with thousands of commits from timing out
+merge_request: 15063
+author:
+type: performance
-- 
cgit v1.2.1


From a2894b7ad2b26ff65d36b9c87b79c60ff4ddda59 Mon Sep 17 00:00:00 2001
From: Brett Walker <bwalker@gitlab.com>
Date: Fri, 27 Oct 2017 16:32:48 +0200
Subject: use a delegate for `username` to be more future friendly

---
 app/controllers/confirmations_controller.rb | 3 +--
 app/models/email.rb                         | 2 ++
 spec/models/email_spec.rb                   | 8 ++++++++
 3 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/app/controllers/confirmations_controller.rb b/app/controllers/confirmations_controller.rb
index 8ca01a6e2c6..bc0948cd3fb 100644
--- a/app/controllers/confirmations_controller.rb
+++ b/app/controllers/confirmations_controller.rb
@@ -15,8 +15,7 @@ class ConfirmationsController < Devise::ConfirmationsController
     if signed_in?(:user)
       after_sign_in(resource)
     else
-      username = (resource_name == :email ? resource.user.username : resource.username)
-      Gitlab::AppLogger.info("Email Confirmed: username=#{username} email=#{resource.email} ip=#{request.remote_ip}")
+      Gitlab::AppLogger.info("Email Confirmed: username=#{resource.username} email=#{resource.email} ip=#{request.remote_ip}")
       flash[:notice] += " Please sign in."
       new_session_path(:user)
     end
diff --git a/app/models/email.rb b/app/models/email.rb
index 384f38f2db7..2da8b050149 100644
--- a/app/models/email.rb
+++ b/app/models/email.rb
@@ -14,6 +14,8 @@ class Email < ActiveRecord::Base
   devise :confirmable
   self.reconfirmable = false  # currently email can't be changed, no need to reconfirm
 
+  delegate :username, to: :user
+
   def email=(value)
     write_attribute(:email, value.downcase.strip)
   end
diff --git a/spec/models/email_spec.rb b/spec/models/email_spec.rb
index b32dd31ae6d..4676612ad52 100644
--- a/spec/models/email_spec.rb
+++ b/spec/models/email_spec.rb
@@ -40,4 +40,12 @@ describe Email do
       expect(user.emails.confirmed.count).to eq 1
     end
   end
+  
+  describe 'delegation' do
+    let(:user) { create(:user) }
+    
+    it 'delegates to :user' do
+      expect(build(:email, user: user).username).to eq user.username
+    end
+  end
 end
-- 
cgit v1.2.1


From 34254e1d58991dadb461fea2b62d3d93b17fbb73 Mon Sep 17 00:00:00 2001
From: Brett Walker <bwalker@gitlab.com>
Date: Fri, 27 Oct 2017 17:35:40 +0200
Subject: remove extra whitespace

---
 spec/models/email_spec.rb | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/spec/models/email_spec.rb b/spec/models/email_spec.rb
index 4676612ad52..47eb0717c0c 100644
--- a/spec/models/email_spec.rb
+++ b/spec/models/email_spec.rb
@@ -40,10 +40,10 @@ describe Email do
       expect(user.emails.confirmed.count).to eq 1
     end
   end
-  
+
   describe 'delegation' do
     let(:user) { create(:user) }
-    
+
     it 'delegates to :user' do
       expect(build(:email, user: user).username).to eq user.username
     end
-- 
cgit v1.2.1


From 47c906eb57d95eacd336aa89541f8a7071b746bf Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Fri, 27 Oct 2017 18:16:28 +0100
Subject: updated karma specs

---
 .../javascripts/repo/components/repo_editor.vue    |   2 +-
 app/assets/javascripts/repo/stores/actions.js      |  17 +-
 app/assets/javascripts/repo/stores/actions/file.js |   8 +-
 app/assets/javascripts/repo/stores/actions/tree.js |  12 +-
 app/assets/javascripts/repo/stores/getters.js      |   6 +-
 app/assets/javascripts/repo/stores/index.js        |   2 +-
 app/assets/javascripts/repo/stores/state.js        |   4 +-
 app/assets/javascripts/repo/stores/utils.js        |   2 +-
 .../helpers/vue_mount_component_helper.js          |   5 +
 .../repo/components/new_branch_form_spec.js        |  76 ++++----
 .../repo/components/new_dropdown/index_spec.js     | 134 +------------
 .../repo/components/new_dropdown/modal_spec.js     | 176 +++++++++++++++---
 .../repo/components/repo_commit_section_spec.js    | 207 ++++++---------------
 .../repo/components/repo_edit_button_spec.js       |  81 +++++---
 .../repo/components/repo_editor_spec.js            |  48 +++--
 .../repo/components/repo_file_buttons_spec.js      |  83 +++------
 spec/javascripts/repo/components/repo_file_spec.js |  57 ++----
 .../repo/components/repo_loading_file_spec.js      |  42 ++---
 .../repo/components/repo_prev_directory_spec.js    |  56 +++---
 .../repo/components/repo_preview_spec.js           |  32 +++-
 .../repo/components/repo_sidebar_spec.js           | 168 ++++-------------
 spec/javascripts/repo/components/repo_spec.js      |  87 ++-------
 spec/javascripts/repo/components/repo_tab_spec.js  |  94 ++++++----
 spec/javascripts/repo/components/repo_tabs_spec.js |  38 ++--
 spec/javascripts/repo/helpers.js                   |  20 ++
 spec/javascripts/repo/mock_data.js                 |  14 --
 .../javascripts/repo/services/repo_service_spec.js | 171 -----------------
 27 files changed, 612 insertions(+), 1030 deletions(-)
 create mode 100644 spec/javascripts/repo/helpers.js
 delete mode 100644 spec/javascripts/repo/mock_data.js
 delete mode 100644 spec/javascripts/repo/services/repo_service_spec.js

diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue
index 9114b3a1acd..6e9669403f2 100644
--- a/app/assets/javascripts/repo/components/repo_editor.vue
+++ b/app/assets/javascripts/repo/components/repo_editor.vue
@@ -74,7 +74,7 @@ export default {
   },
   watch: {
     activeFile(oldVal, newVal) {
-      if (!newVal.active) {
+      if (newVal && !newVal.active) {
         this.initMonaco();
       }
     },
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index c8be50116eb..d5dc57e331b 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -2,9 +2,8 @@ import Vue from 'vue';
 import flash from '../../flash';
 import service from '../services';
 import * as types from './mutation_types';
-import { visitUrl } from '../../lib/utils/url_utility';
 
-export const redirectToUrl = url => visitUrl(url);
+export const redirectToUrl = url => gl.utils.visitUrl(url);
 
 export const setInitialData = ({ commit }, data) => commit(types.SET_INITIAL_DATA, data);
 
@@ -26,7 +25,7 @@ export const closeAllFiles = ({ state, dispatch }) => {
   state.openFiles.forEach(file => dispatch('closeFile', { file }));
 };
 
-export const toggleEditMode = ({ commit, getters, dispatch }, force = false) => {
+export const toggleEditMode = ({ state, commit, getters, dispatch }, force = false) => {
   const changedFiles = getters.changedFiles;
 
   if (changedFiles.length && !force) {
@@ -35,7 +34,10 @@ export const toggleEditMode = ({ commit, getters, dispatch }, force = false) =>
     commit(types.TOGGLE_EDIT_MODE);
     commit(types.TOGGLE_DISCARD_POPUP, false);
     dispatch('toggleBlobView');
-    dispatch('discardAllChanges');
+
+    if (!state.editMode) {
+      dispatch('discardAllChanges');
+    }
   }
 };
 
@@ -111,9 +113,12 @@ export const popHistoryState = ({ state, dispatch, getters }) => {
 export const scrollToTab = () => {
   Vue.nextTick(() => {
     const tabs = document.getElementById('tabs');
-    const tabEl = tabs.querySelector('.active');
 
-    tabs.scrollLeft = tabEl.offsetLeft;
+    if (tabs) {
+      const tabEl = tabs.querySelector('.active');
+
+      tabs.scrollLeft = tabEl.offsetLeft;
+    }
   });
 };
 
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
index 5759ff07aef..013a0b3f4da 100644
--- a/app/assets/javascripts/repo/stores/actions/file.js
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -3,6 +3,7 @@ import flash from '../../../flash';
 import service from '../../services';
 import * as types from '../mutation_types';
 import {
+  findEntry,
   pushState,
   setPageTitle,
   createTemp,
@@ -88,11 +89,16 @@ export const createTempFile = ({ state, commit, dispatch }, { tree, name }) => {
     changed: true,
   });
 
+  if (findEntry(tree, 'blob', file.name)) return;
+
   commit(types.CREATE_TMP_FILE, {
     parent: tree,
     file,
   });
   commit(types.TOGGLE_FILE_OPEN, file);
   dispatch('setFileActive', file);
-  dispatch('toggleEditMode', true);
+
+  if (!state.editMode) {
+    dispatch('toggleEditMode', true);
+  }
 };
diff --git a/app/assets/javascripts/repo/stores/actions/tree.js b/app/assets/javascripts/repo/stores/actions/tree.js
index 9d084a952a2..129743c66c2 100644
--- a/app/assets/javascripts/repo/stores/actions/tree.js
+++ b/app/assets/javascripts/repo/stores/actions/tree.js
@@ -76,7 +76,7 @@ export const clickedTreeRow = ({ commit, dispatch }, row) => {
 
 export const createTempTree = ({ state, commit, dispatch }, name) => {
   let tree = state;
-  const dirNames = name.replace(`${state.path}/`, '').split('/');
+  const dirNames = name.replace(new RegExp(`^${state.path}/`), '').split('/');
 
   dirNames.forEach((dirName) => {
     const foundEntry = findEntry(tree, 'tree', dirName);
@@ -101,8 +101,10 @@ export const createTempTree = ({ state, commit, dispatch }, name) => {
     }
   });
 
-  dispatch('createTempFile', {
-    tree,
-    name: '.gitkeep',
-  });
+  if (tree.tempFile) {
+    dispatch('createTempFile', {
+      tree,
+      name: '.gitkeep',
+    });
+  }
 };
diff --git a/app/assets/javascripts/repo/stores/getters.js b/app/assets/javascripts/repo/stores/getters.js
index 1c83c943ef7..9122578cc79 100644
--- a/app/assets/javascripts/repo/stores/getters.js
+++ b/app/assets/javascripts/repo/stores/getters.js
@@ -15,11 +15,7 @@ export const changedFiles = (state) => {
   return files.filter(file => file.changed);
 };
 
-export const activeFile = (state) => {
-  const openedFiles = state.openFiles;
-
-  return openedFiles.find(file => file.active);
-};
+export const activeFile = state => state.openFiles.find(file => file.active);
 
 export const activeFileExtension = (state) => {
   const file = activeFile(state);
diff --git a/app/assets/javascripts/repo/stores/index.js b/app/assets/javascripts/repo/stores/index.js
index f8565fb244c..6ac9bfd8189 100644
--- a/app/assets/javascripts/repo/stores/index.js
+++ b/app/assets/javascripts/repo/stores/index.js
@@ -8,7 +8,7 @@ import mutations from './mutations';
 Vue.use(Vuex);
 
 export default new Vuex.Store({
-  state,
+  state: state(),
   actions,
   mutations,
   getters,
diff --git a/app/assets/javascripts/repo/stores/state.js b/app/assets/javascripts/repo/stores/state.js
index 643239eee19..1301350c627 100644
--- a/app/assets/javascripts/repo/stores/state.js
+++ b/app/assets/javascripts/repo/stores/state.js
@@ -1,4 +1,4 @@
-export default {
+export default () => ({
   project: {
     id: 0,
     name: '',
@@ -20,4 +20,4 @@ export default {
   openFiles: [],
   parentTreeUrl: '',
   previousUrl: '',
-};
+});
diff --git a/app/assets/javascripts/repo/stores/utils.js b/app/assets/javascripts/repo/stores/utils.js
index feafcebcfe2..5d5ee99ed43 100644
--- a/app/assets/javascripts/repo/stores/utils.js
+++ b/app/assets/javascripts/repo/stores/utils.js
@@ -36,8 +36,8 @@ export const decorateData = (entity, projectUrl = '') => {
     last_commit,
     tree_url,
     path,
-    tempFile,
     renderError,
+    tempFile = false,
     active = false,
     opened = false,
     changed = false,
diff --git a/spec/javascripts/helpers/vue_mount_component_helper.js b/spec/javascripts/helpers/vue_mount_component_helper.js
index b71136c4114..34acdfbfba9 100644
--- a/spec/javascripts/helpers/vue_mount_component_helper.js
+++ b/spec/javascripts/helpers/vue_mount_component_helper.js
@@ -1,3 +1,8 @@
+export const createComponentWithStore = (Component, store, propsData = {}) => new Component({
+  store,
+  propsData,
+});
+
 export default (Component, props = {}, el = null) => new Component({
   propsData: props,
 }).$mount(el);
diff --git a/spec/javascripts/repo/components/new_branch_form_spec.js b/spec/javascripts/repo/components/new_branch_form_spec.js
index c9c5ce096fc..9a705a1f0ed 100644
--- a/spec/javascripts/repo/components/new_branch_form_spec.js
+++ b/spec/javascripts/repo/components/new_branch_form_spec.js
@@ -1,8 +1,8 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import newBranchForm from '~/repo/components/new_branch_form.vue';
-import eventHub from '~/repo/event_hub';
-import RepoStore from '~/repo/stores/repo_store';
-import createComponent from '../../helpers/vue_mount_component_helper';
+import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
+import { resetStore } from '../helpers';
 
 describe('Multi-file editor new branch form', () => {
   let vm;
@@ -10,17 +10,17 @@ describe('Multi-file editor new branch form', () => {
   beforeEach(() => {
     const Component = Vue.extend(newBranchForm);
 
-    RepoStore.currentBranch = 'master';
+    vm = createComponentWithStore(Component, store);
 
-    vm = createComponent(Component, {
-      currentBranch: RepoStore.currentBranch,
-    });
+    vm.$store.state.currentBranch = 'master';
+
+    vm.$mount();
   });
 
   afterEach(() => {
     vm.$destroy();
 
-    RepoStore.currentBranch = '';
+    resetStore(vm.$store);
   });
 
   describe('template', () => {
@@ -48,6 +48,10 @@ describe('Multi-file editor new branch form', () => {
   });
 
   describe('submitNewBranch', () => {
+    beforeEach(() => {
+      spyOn(vm, 'createNewBranch').and.returnValue(Promise.resolve());
+    });
+
     it('sets to loading', () => {
       vm.submitNewBranch();
 
@@ -66,57 +70,45 @@ describe('Multi-file editor new branch form', () => {
       });
     });
 
-    it('emits an event with branchName', () => {
-      spyOn(eventHub, '$emit');
-
+    it('calls createdNewBranch with branchName', () => {
       vm.branchName = 'testing';
 
       vm.submitNewBranch();
 
-      expect(eventHub.$emit).toHaveBeenCalledWith('createNewBranch', 'testing');
+      expect(vm.createNewBranch).toHaveBeenCalledWith('testing');
     });
   });
 
-  describe('showErrorMessage', () => {
-    it('sets loading to false', () => {
-      vm.loading = true;
-
-      vm.showErrorMessage();
-
-      expect(vm.loading).toBeFalsy();
-    });
-
-    it('creates flash element', () => {
-      vm.showErrorMessage('error message');
-
-      expect(vm.$el.querySelector('.flash-alert')).not.toBeNull();
-      expect(vm.$el.querySelector('.flash-alert').textContent.trim()).toBe('error message');
+  describe('submitNewBranch with error', () => {
+    beforeEach(() => {
+      spyOn(vm, 'createNewBranch').and.returnValue(Promise.reject({
+        json: () => Promise.resolve({
+          message: 'error message',
+        }),
+      }));
     });
-  });
 
-  describe('createdNewBranch', () => {
-    it('set loading to false', () => {
+    it('sets loading to false', (done) => {
       vm.loading = true;
 
-      vm.createdNewBranch();
-
-      expect(vm.loading).toBeFalsy();
-    });
-
-    it('resets branch name', () => {
-      vm.branchName = 'testing';
+      vm.submitNewBranch();
 
-      vm.createdNewBranch();
+      setTimeout(() => {
+        expect(vm.loading).toBeFalsy();
 
-      expect(vm.branchName).toBe('');
+        done();
+      });
     });
 
-    it('sets the dropdown toggle text', () => {
-      vm.dropdownText = document.createElement('span');
+    it('creates flash element', (done) => {
+      vm.submitNewBranch();
 
-      vm.createdNewBranch('branch name');
+      setTimeout(() => {
+        expect(vm.$el.querySelector('.flash-alert')).not.toBeNull();
+        expect(vm.$el.querySelector('.flash-alert').textContent.trim()).toBe('error message');
 
-      expect(vm.dropdownText.textContent).toBe('branch name');
+        done();
+      });
     });
   });
 });
diff --git a/spec/javascripts/repo/components/new_dropdown/index_spec.js b/spec/javascripts/repo/components/new_dropdown/index_spec.js
index ddbfdab582d..dd751f32333 100644
--- a/spec/javascripts/repo/components/new_dropdown/index_spec.js
+++ b/spec/javascripts/repo/components/new_dropdown/index_spec.js
@@ -1,9 +1,8 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import newDropdown from '~/repo/components/new_dropdown/index.vue';
-import RepoStore from '~/repo/stores/repo_store';
-import RepoHelper from '~/repo/helpers/repo_helper';
-import eventHub from '~/repo/event_hub';
-import createComponent from '../../../helpers/vue_mount_component_helper';
+import { createComponentWithStore } from '../../../helpers/vue_mount_component_helper';
+import { resetStore } from '../../helpers';
 
 describe('new dropdown component', () => {
   let vm;
@@ -11,15 +10,13 @@ describe('new dropdown component', () => {
   beforeEach(() => {
     const component = Vue.extend(newDropdown);
 
-    vm = createComponent(component);
+    vm = createComponentWithStore(component, store).$mount();
   });
 
   afterEach(() => {
     vm.$destroy();
 
-    RepoStore.files = [];
-    RepoStore.openedFiles = [];
-    RepoStore.setViewToPreview();
+    resetStore(vm.$store);
   });
 
   it('renders new file and new directory links', () => {
@@ -67,125 +64,4 @@ describe('new dropdown component', () => {
         .catch(done.fail);
     });
   });
-
-  describe('createEntryInStore', () => {
-    ['tree', 'blob'].forEach((type) => {
-      describe(type, () => {
-        it('closes modal after creating file', () => {
-          vm.openModal = true;
-
-          eventHub.$emit('createNewEntry', 'testing', type);
-
-          expect(vm.openModal).toBeFalsy();
-        });
-
-        it('sets editMode to true', () => {
-          eventHub.$emit('createNewEntry', 'testing', type);
-
-          expect(RepoStore.editMode).toBeTruthy();
-        });
-
-        it('toggles blob view', () => {
-          eventHub.$emit('createNewEntry', 'testing', type);
-
-          expect(RepoStore.isPreviewView()).toBeFalsy();
-        });
-
-        it('adds file into activeFiles', () => {
-          eventHub.$emit('createNewEntry', 'testing', type);
-
-          expect(RepoStore.openedFiles.length).toBe(1);
-        });
-
-        it(`creates ${type} in the current stores path`, () => {
-          RepoStore.path = 'testing';
-
-          eventHub.$emit('createNewEntry', 'testing/app', type);
-
-          expect(RepoStore.files[0].path).toBe('testing/app');
-          expect(RepoStore.files[0].name).toBe('app');
-
-          if (type === 'tree') {
-            expect(RepoStore.files[0].files.length).toBe(1);
-          }
-
-          RepoStore.path = '';
-        });
-      });
-    });
-
-    describe('file', () => {
-      it('creates new file', () => {
-        eventHub.$emit('createNewEntry', 'testing', 'blob');
-
-        expect(RepoStore.files.length).toBe(1);
-        expect(RepoStore.files[0].name).toBe('testing');
-        expect(RepoStore.files[0].type).toBe('blob');
-        expect(RepoStore.files[0].tempFile).toBeTruthy();
-      });
-
-      it('does not create temp file when file already exists', () => {
-        RepoStore.files.push(RepoHelper.serializeRepoEntity('blob', {
-          name: 'testing',
-        }));
-
-        eventHub.$emit('createNewEntry', 'testing', 'blob');
-
-        expect(RepoStore.files.length).toBe(1);
-        expect(RepoStore.files[0].name).toBe('testing');
-        expect(RepoStore.files[0].type).toBe('blob');
-        expect(RepoStore.files[0].tempFile).toBeUndefined();
-      });
-    });
-
-    describe('tree', () => {
-      it('creates new tree', () => {
-        eventHub.$emit('createNewEntry', 'testing', 'tree');
-
-        expect(RepoStore.files.length).toBe(1);
-        expect(RepoStore.files[0].name).toBe('testing');
-        expect(RepoStore.files[0].type).toBe('tree');
-        expect(RepoStore.files[0].tempFile).toBeTruthy();
-        expect(RepoStore.files[0].files.length).toBe(1);
-        expect(RepoStore.files[0].files[0].name).toBe('.gitkeep');
-      });
-
-      it('creates multiple trees when entryName has slashes', () => {
-        eventHub.$emit('createNewEntry', 'app/test', 'tree');
-
-        expect(RepoStore.files.length).toBe(1);
-        expect(RepoStore.files[0].name).toBe('app');
-        expect(RepoStore.files[0].files[0].name).toBe('test');
-        expect(RepoStore.files[0].files[0].files[0].name).toBe('.gitkeep');
-      });
-
-      it('creates tree in existing tree', () => {
-        RepoStore.files.push(RepoHelper.serializeRepoEntity('tree', {
-          name: 'app',
-        }));
-
-        eventHub.$emit('createNewEntry', 'app/test', 'tree');
-
-        expect(RepoStore.files.length).toBe(1);
-        expect(RepoStore.files[0].name).toBe('app');
-        expect(RepoStore.files[0].tempFile).toBeUndefined();
-        expect(RepoStore.files[0].files[0].tempFile).toBeTruthy();
-        expect(RepoStore.files[0].files[0].name).toBe('test');
-        expect(RepoStore.files[0].files[0].files[0].name).toBe('.gitkeep');
-      });
-
-      it('does not create new tree when already exists', () => {
-        RepoStore.files.push(RepoHelper.serializeRepoEntity('tree', {
-          name: 'app',
-        }));
-
-        eventHub.$emit('createNewEntry', 'app', 'tree');
-
-        expect(RepoStore.files.length).toBe(1);
-        expect(RepoStore.files[0].name).toBe('app');
-        expect(RepoStore.files[0].tempFile).toBeUndefined();
-        expect(RepoStore.files[0].files.length).toBe(0);
-      });
-    });
-  });
 });
diff --git a/spec/javascripts/repo/components/new_dropdown/modal_spec.js b/spec/javascripts/repo/components/new_dropdown/modal_spec.js
index 4c5cdc47c6e..ed0a443fded 100644
--- a/spec/javascripts/repo/components/new_dropdown/modal_spec.js
+++ b/spec/javascripts/repo/components/new_dropdown/modal_spec.js
@@ -1,8 +1,8 @@
 import Vue from 'vue';
-import RepoStore from '~/repo/stores/repo_store';
+import store from '~/repo/stores';
 import modal from '~/repo/components/new_dropdown/modal.vue';
-import eventHub from '~/repo/event_hub';
-import createComponent from '../../../helpers/vue_mount_component_helper';
+import { createComponentWithStore } from '../../../helpers/vue_mount_component_helper';
+import { file, resetStore } from '../../helpers';
 
 describe('new file modal component', () => {
   const Component = Vue.extend(modal);
@@ -11,18 +11,17 @@ describe('new file modal component', () => {
   afterEach(() => {
     vm.$destroy();
 
-    RepoStore.files = [];
-    RepoStore.openedFiles = [];
-    RepoStore.setViewToPreview();
+    resetStore(vm.$store);
   });
 
   ['tree', 'blob'].forEach((type) => {
     describe(type, () => {
       beforeEach(() => {
-        vm = createComponent(Component, {
+        vm = createComponentWithStore(Component, store, {
           type,
-          currentPath: RepoStore.path,
-        });
+        }).$mount();
+
+        vm.entryName = 'testing';
       });
 
       it(`sets modal title as ${type}`, () => {
@@ -42,35 +41,156 @@ describe('new file modal component', () => {
 
         expect(vm.$el.querySelector('.label-light').textContent.trim()).toBe(`${title} name`);
       });
+
+      describe('createEntryInStore', () => {
+        it('calls createTempEntry', () => {
+          spyOn(vm, 'createTempEntry');
+
+          vm.createEntryInStore();
+
+          expect(vm.createTempEntry).toHaveBeenCalledWith({
+            name: 'testing',
+            type,
+          });
+        });
+
+        it('sets editMode to true', (done) => {
+          vm.createEntryInStore();
+
+          setTimeout(() => {
+            expect(vm.$store.state.editMode).toBeTruthy();
+
+            done();
+          });
+        });
+
+        it('toggles blob view', (done) => {
+          vm.createEntryInStore();
+
+          setTimeout(() => {
+            expect(vm.$store.state.currentBlobView).toBe('repo-editor');
+
+            done();
+          });
+        });
+
+        it('opens newly created file', (done) => {
+          vm.createEntryInStore();
+
+          setTimeout(() => {
+            expect(vm.$store.state.openFiles.length).toBe(1);
+            expect(vm.$store.state.openFiles[0].name).toBe(type === 'blob' ? 'testing' : '.gitkeep');
+
+            done();
+          });
+        });
+
+        it(`creates ${type} in the current stores path`, (done) => {
+          vm.$store.state.path = 'app';
+
+          vm.createEntryInStore();
+
+          setTimeout(() => {
+            expect(vm.$store.state.tree[0].path).toBe('app/testing');
+            expect(vm.$store.state.tree[0].name).toBe('testing');
+
+            if (type === 'tree') {
+              expect(vm.$store.state.tree[0].tree.length).toBe(1);
+            }
+
+            done();
+          });
+        });
+
+        if (type === 'blob') {
+          it('creates new file', (done) => {
+            vm.createEntryInStore();
+
+            setTimeout(() => {
+              expect(vm.$store.state.tree.length).toBe(1);
+              expect(vm.$store.state.tree[0].name).toBe('testing');
+              expect(vm.$store.state.tree[0].type).toBe('blob');
+              expect(vm.$store.state.tree[0].tempFile).toBeTruthy();
+
+              done();
+            });
+          });
+
+          it('does not create temp file when file already exists', (done) => {
+            vm.$store.state.tree.push(file('testing', '1', type));
+
+            vm.createEntryInStore();
+
+            setTimeout(() => {
+              expect(vm.$store.state.tree.length).toBe(1);
+              expect(vm.$store.state.tree[0].name).toBe('testing');
+              expect(vm.$store.state.tree[0].type).toBe('blob');
+              expect(vm.$store.state.tree[0].tempFile).toBeFalsy();
+
+              done();
+            });
+          });
+        } else {
+          it('creates new tree', () => {
+            vm.createEntryInStore();
+
+            expect(vm.$store.state.tree.length).toBe(1);
+            expect(vm.$store.state.tree[0].name).toBe('testing');
+            expect(vm.$store.state.tree[0].type).toBe('tree');
+            expect(vm.$store.state.tree[0].tempFile).toBeTruthy();
+            expect(vm.$store.state.tree[0].tree.length).toBe(1);
+            expect(vm.$store.state.tree[0].tree[0].name).toBe('.gitkeep');
+          });
+
+          it('creates multiple trees when entryName has slashes', () => {
+            vm.entryName = 'app/test';
+            vm.createEntryInStore();
+
+            expect(vm.$store.state.tree.length).toBe(1);
+            expect(vm.$store.state.tree[0].name).toBe('app');
+            expect(vm.$store.state.tree[0].tree[0].name).toBe('test');
+            expect(vm.$store.state.tree[0].tree[0].tree[0].name).toBe('.gitkeep');
+          });
+
+          it('creates tree in existing tree', () => {
+            vm.$store.state.tree.push(file('app', '1', 'tree'));
+
+            vm.entryName = 'app/test';
+            vm.createEntryInStore();
+
+            expect(vm.$store.state.tree.length).toBe(1);
+            expect(vm.$store.state.tree[0].name).toBe('app');
+            expect(vm.$store.state.tree[0].tempFile).toBeFalsy();
+            expect(vm.$store.state.tree[0].tree[0].tempFile).toBeTruthy();
+            expect(vm.$store.state.tree[0].tree[0].name).toBe('test');
+            expect(vm.$store.state.tree[0].tree[0].tree[0].name).toBe('.gitkeep');
+          });
+
+          it('does not create new tree when already exists', () => {
+            vm.$store.state.tree.push(file('app', '1', 'tree'));
+
+            vm.entryName = 'app';
+            vm.createEntryInStore();
+
+            expect(vm.$store.state.tree.length).toBe(1);
+            expect(vm.$store.state.tree[0].name).toBe('app');
+            expect(vm.$store.state.tree[0].tempFile).toBeFalsy();
+            expect(vm.$store.state.tree[0].tree.length).toBe(0);
+          });
+        }
+      });
     });
   });
 
   it('focuses field on mount', () => {
     document.body.innerHTML += '<div class="js-test"></div>';
 
-    vm = createComponent(Component, {
+    vm = createComponentWithStore(Component, store, {
       type: 'tree',
-      currentPath: RepoStore.path,
-    }, '.js-test');
+    }).$mount('.js-test');
 
     expect(document.activeElement).toBe(vm.$refs.fieldName);
 
     vm.$el.remove();
   });
-
-  describe('createEntryInStore', () => {
-    it('emits createNewEntry event', () => {
-      spyOn(eventHub, '$emit');
-
-      vm = createComponent(Component, {
-        type: 'tree',
-        currentPath: RepoStore.path,
-      });
-      vm.entryName = 'testing';
-
-      vm.createEntryInStore();
-
-      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', 'testing', 'tree');
-    });
-  });
 });
diff --git a/spec/javascripts/repo/components/repo_commit_section_spec.js b/spec/javascripts/repo/components/repo_commit_section_spec.js
index e09d593f04c..0f991e1b727 100644
--- a/spec/javascripts/repo/components/repo_commit_section_spec.js
+++ b/spec/javascripts/repo/components/repo_commit_section_spec.js
@@ -1,56 +1,43 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
+import service from '~/repo/services';
 import repoCommitSection from '~/repo/components/repo_commit_section.vue';
-import RepoStore from '~/repo/stores/repo_store';
-import RepoService from '~/repo/services/repo_service';
 import getSetTimeoutPromise from '../../helpers/set_timeout_promise_helper';
+import { file, resetStore } from '../helpers';
 
 describe('RepoCommitSection', () => {
-  const branch = 'master';
-  const projectUrl = 'projectUrl';
-  let changedFiles;
-  let openedFiles;
+  let vm;
 
-  RepoStore.projectUrl = projectUrl;
-
-  function createComponent(el) {
+  function createComponent() {
     const RepoCommitSection = Vue.extend(repoCommitSection);
 
-    return new RepoCommitSection().$mount(el);
+    const comp = new RepoCommitSection({
+      store,
+    }).$mount();
+
+    comp.$store.state.currentBranch = 'master';
+    comp.$store.state.openFiles = [file(), file()];
+    comp.$store.state.openFiles.forEach(f => Object.assign(f, {
+      changed: true,
+      content: 'testing',
+    }));
+
+    return comp.$mount();
   }
 
   beforeEach(() => {
-    // Create a copy for each test because these can get modified directly
-    changedFiles = [{
-      id: 0,
-      changed: true,
-      url: `/namespace/${projectUrl}/blob/${branch}/dir/file0.ext`,
-      path: 'dir/file0.ext',
-      newContent: 'a',
-    }, {
-      id: 1,
-      changed: true,
-      url: `/namespace/${projectUrl}/blob/${branch}/dir/file1.ext`,
-      path: 'dir/file1.ext',
-      newContent: 'b',
-    }];
-    openedFiles = changedFiles.concat([{
-      id: 2,
-      url: `/namespace/${projectUrl}/blob/${branch}/dir/file2.ext`,
-      path: 'dir/file2.ext',
-      changed: false,
-    }]);
+    vm = createComponent();
   });
 
-  it('renders a commit section', () => {
-    RepoStore.isCommitable = true;
-    RepoStore.currentBranch = branch;
-    RepoStore.targetBranch = branch;
-    RepoStore.openedFiles = openedFiles;
+  afterEach(() => {
+    vm.$destroy();
+
+    resetStore(vm.$store);
+  });
 
-    const vm = createComponent();
+  it('renders a commit section', () => {
     const changedFileElements = [...vm.$el.querySelectorAll('.changed-files > li')];
-    const commitMessage = vm.$el.querySelector('#commit-message');
-    const submitCommit = vm.$refs.submitCommit;
+    const submitCommit = vm.$el.querySelector('.btn');
     const targetBranch = vm.$el.querySelector('.target-branch');
 
     expect(vm.$el.querySelector(':scope > form')).toBeTruthy();
@@ -58,160 +45,70 @@ describe('RepoCommitSection', () => {
     expect(changedFileElements.length).toEqual(2);
 
     changedFileElements.forEach((changedFile, i) => {
-      expect(changedFile.textContent.trim()).toEqual(changedFiles[i].path);
+      expect(changedFile.textContent.trim()).toEqual(vm.$store.getters.changedFiles[i].path);
     });
 
-    expect(commitMessage.tagName).toEqual('TEXTAREA');
-    expect(commitMessage.name).toEqual('commit-message');
-    expect(submitCommit.type).toEqual('submit');
     expect(submitCommit.disabled).toBeTruthy();
     expect(submitCommit.querySelector('.fa-spinner.fa-spin')).toBeFalsy();
     expect(vm.$el.querySelector('.commit-summary').textContent.trim()).toEqual('Commit 2 files');
     expect(targetBranch.querySelector(':scope > label').textContent.trim()).toEqual('Target branch');
-    expect(targetBranch.querySelector('.help-block').textContent.trim()).toEqual(branch);
-  });
-
-  it('does not render if not isCommitable', () => {
-    RepoStore.isCommitable = false;
-    RepoStore.openedFiles = [{
-      id: 0,
-      changed: true,
-    }];
-
-    const vm = createComponent();
-
-    expect(vm.$el.innerHTML).toBeFalsy();
-  });
-
-  it('does not render if no changedFiles', () => {
-    RepoStore.isCommitable = true;
-    RepoStore.openedFiles = [];
-
-    const vm = createComponent();
-
-    expect(vm.$el.innerHTML).toBeFalsy();
+    expect(targetBranch.querySelector('.help-block').textContent.trim()).toEqual('master');
   });
 
   describe('when submitting', () => {
-    let el;
-    let vm;
-    const projectId = 'projectId';
-    const commitMessage = 'commitMessage';
-
-    beforeEach((done) => {
-      RepoStore.isCommitable = true;
-      RepoStore.currentBranch = branch;
-      RepoStore.targetBranch = branch;
-      RepoStore.openedFiles = openedFiles;
-      RepoStore.projectId = projectId;
-
-      // We need to append to body to get form `submit` events working
-      // Otherwise we run into, "Form submission canceled because the form is not connected"
-      // See https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#form-submission-algorithm
-      el = document.createElement('div');
-      document.body.appendChild(el);
-
-      vm = createComponent(el);
-      vm.commitMessage = commitMessage;
-
-      spyOn(vm, 'tryCommit').and.callThrough();
-      spyOn(vm, 'redirectToNewMr').and.stub();
-      spyOn(vm, 'redirectToBranch').and.stub();
-      spyOn(RepoService, 'commitFiles').and.returnValue(Promise.resolve());
-      spyOn(RepoService, 'getBranch').and.returnValue(Promise.resolve({
-        commit: {
-          id: 1,
-          short_id: 1,
-        },
-      }));
-
-      // Wait for the vm data to be in place
-      Vue.nextTick(() => {
-        done();
-      });
-    });
+    let changedFiles;
 
-    afterEach(() => {
-      vm.$destroy();
-      el.remove();
-      RepoStore.openedFiles = [];
-    });
+    beforeEach(() => {
+      vm.commitMessage = 'testing';
+      changedFiles = JSON.parse(JSON.stringify(vm.$store.getters.changedFiles));
 
-    it('shows commit message', () => {
-      const commitMessageEl = vm.$el.querySelector('#commit-message');
-      expect(commitMessageEl.value).toBe(commitMessage);
+      spyOn(service, 'commit').and.returnValue(Promise.resolve({
+        short_id: '1',
+        stats: {},
+      }));
     });
 
     it('allows you to submit', () => {
-      const submitCommit = vm.$refs.submitCommit;
-      expect(submitCommit.disabled).toBeFalsy();
+      expect(vm.$el.querySelector('.btn').disabled).toBeTruthy();
     });
 
-    it('shows commit submit and summary if commitMessage and spinner if submitCommitsLoading', (done) => {
-      const submitCommit = vm.$refs.submitCommit;
-      submitCommit.click();
+    it('submits commit', (done) => {
+      vm.makeCommit();
 
       // Wait for the branch check to finish
       getSetTimeoutPromise()
         .then(() => Vue.nextTick())
         .then(() => {
-          expect(vm.tryCommit).toHaveBeenCalled();
-          expect(submitCommit.querySelector('.js-commit-loading-icon')).toBeTruthy();
-          expect(vm.redirectToBranch).toHaveBeenCalled();
-
-          const args = RepoService.commitFiles.calls.allArgs()[0];
-          const { commit_message, actions, branch: payloadBranch } = args[0];
+          const args = service.commit.calls.allArgs()[0];
+          const { commit_message, actions, branch: payloadBranch } = args[1];
 
-          expect(commit_message).toBe(commitMessage);
+          expect(commit_message).toBe('testing');
           expect(actions.length).toEqual(2);
-          expect(payloadBranch).toEqual(branch);
+          expect(payloadBranch).toEqual('master');
           expect(actions[0].action).toEqual('update');
           expect(actions[1].action).toEqual('update');
-          expect(actions[0].content).toEqual(openedFiles[0].newContent);
-          expect(actions[1].content).toEqual(openedFiles[1].newContent);
-          expect(actions[0].file_path).toEqual(openedFiles[0].path);
-          expect(actions[1].file_path).toEqual(openedFiles[1].path);
+          expect(actions[0].content).toEqual(changedFiles[0].content);
+          expect(actions[1].content).toEqual(changedFiles[1].content);
+          expect(actions[0].file_path).toEqual(changedFiles[0].path);
+          expect(actions[1].file_path).toEqual(changedFiles[1].path);
         })
         .then(done)
         .catch(done.fail);
     });
 
     it('redirects to MR creation page if start new MR checkbox checked', (done) => {
+      spyOn(gl.utils, 'visitUrl');
       vm.startNewMR = true;
 
-      Vue.nextTick()
-        .then(() => {
-          const submitCommit = vm.$refs.submitCommit;
-          submitCommit.click();
-        })
-        // Wait for the branch check to finish
-        .then(() => getSetTimeoutPromise())
+      vm.makeCommit();
+
+      getSetTimeoutPromise()
+        .then(() => Vue.nextTick())
         .then(() => {
-          expect(vm.redirectToNewMr).toHaveBeenCalled();
+          expect(gl.utils.visitUrl).toHaveBeenCalled();
         })
         .then(done)
         .catch(done.fail);
     });
   });
-
-  describe('methods', () => {
-    describe('resetCommitState', () => {
-      it('should reset store vars and scroll to top', () => {
-        const vm = {
-          submitCommitsLoading: true,
-          changedFiles: new Array(10),
-          openedFiles: new Array(3),
-          commitMessage: 'commitMessage',
-          editMode: true,
-        };
-
-        repoCommitSection.methods.resetCommitState.call(vm);
-
-        expect(vm.submitCommitsLoading).toEqual(false);
-        expect(vm.changedFiles).toEqual([]);
-        expect(vm.commitMessage).toEqual('');
-        expect(vm.editMode).toEqual(false);
-      });
-    });
-  });
 });
diff --git a/spec/javascripts/repo/components/repo_edit_button_spec.js b/spec/javascripts/repo/components/repo_edit_button_spec.js
index dff2fac191d..aee2dd6ad55 100644
--- a/spec/javascripts/repo/components/repo_edit_button_spec.js
+++ b/spec/javascripts/repo/components/repo_edit_button_spec.js
@@ -1,45 +1,78 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoEditButton from '~/repo/components/repo_edit_button.vue';
-import RepoStore from '~/repo/stores/repo_store';
+import { file, resetStore } from '../helpers';
 
 describe('RepoEditButton', () => {
-  function createComponent() {
+  let vm;
+
+  beforeEach(() => {
+    const f = file();
     const RepoEditButton = Vue.extend(repoEditButton);
 
-    return new RepoEditButton().$mount();
-  }
+    vm = new RepoEditButton({
+      store,
+    });
+
+    f.active = true;
+    f.changed = true;
+    vm.$store.dispatch('setInitialData', {
+      canCommit: true,
+      onTopOfBranch: true,
+    });
+    vm.$store.state.openFiles.push(f);
+  });
 
   afterEach(() => {
-    RepoStore.openedFiles = [];
+    vm.$destroy();
+
+    resetStore(vm.$store);
   });
 
-  it('renders an edit button that toggles the view state', (done) => {
-    RepoStore.isCommitable = true;
-    RepoStore.changedFiles = [];
-    RepoStore.binary = false;
-    RepoStore.openedFiles = [{}, {}];
+  it('renders an edit button', () => {
+    vm.$mount();
 
-    const vm = createComponent();
+    expect(vm.$el.querySelector('.btn')).not.toBeNull();
+    expect(vm.$el.querySelector('.btn').textContent.trim()).toBe('Edit');
+  });
 
-    expect(vm.$el.tagName).toEqual('BUTTON');
-    expect(vm.$el.textContent).toMatch('Edit');
+  it('renders edit button with cancel text', () => {
+    vm.$store.state.editMode = true;
 
-    spyOn(vm, 'editCancelClicked').and.callThrough();
+    vm.$mount();
 
-    vm.$el.click();
+    expect(vm.$el.querySelector('.btn')).not.toBeNull();
+    expect(vm.$el.querySelector('.btn').textContent.trim()).toBe('Cancel edit');
+  });
 
-    Vue.nextTick(() => {
-      expect(vm.editCancelClicked).toHaveBeenCalled();
-      expect(vm.$el.textContent).toMatch('Cancel edit');
-      done();
-    });
+  it('toggles edit mode on click', () => {
+    vm.$mount();
+
+    vm.$el.querySelector('.btn').click();
+
+    expect(vm.$el.querySelector('.btn').textContent.trim()).toBe('Cancel edit');
   });
 
-  it('does not render if not isCommitable', () => {
-    RepoStore.isCommitable = false;
+  describe('discardPopupOpen', () => {
+    beforeEach(() => {
+      vm.$store.state.discardPopupOpen = true;
+
+      vm.$mount();
+    });
+
+    it('renders popup', () => {
+      expect(vm.$el.querySelector('.modal')).not.toBeNull();
+    });
+
+    it('removes all changed files', (done) => {
+      vm.$el.querySelector('.btn-warning').click();
 
-    const vm = createComponent();
+      vm.$nextTick(() => {
+        expect(vm.$store.getters.changedFiles.length).toBe(0);
+        expect(vm.$el.querySelector('.modal')).toBeNull();
 
-    expect(vm.$el.innerHTML).toBeUndefined();
+        done();
+      });
+    });
   });
 });
diff --git a/spec/javascripts/repo/components/repo_editor_spec.js b/spec/javascripts/repo/components/repo_editor_spec.js
index a25a600b3be..82f914b7c9d 100644
--- a/spec/javascripts/repo/components/repo_editor_spec.js
+++ b/spec/javascripts/repo/components/repo_editor_spec.js
@@ -1,52 +1,46 @@
 import Vue from 'vue';
-import RepoStore from '~/repo/stores/repo_store';
+import store from '~/repo/stores';
 import repoEditor from '~/repo/components/repo_editor.vue';
+import { file, resetStore } from '../helpers';
 
 describe('RepoEditor', () => {
+  let vm;
+
   beforeEach(() => {
+    const f = file();
     const RepoEditor = Vue.extend(repoEditor);
 
-    this.vm = new RepoEditor().$mount();
+    vm = new RepoEditor({
+      store,
+    });
+
+    f.active = true;
+    f.tempFile = true;
+    vm.$store.state.openFiles.push(f);
+    vm.monaco = true;
+
+    vm.$mount();
   });
 
   afterEach(() => {
-    RepoStore.openedFiles = [];
+    vm.$destroy();
+
+    resetStore(vm.$store);
   });
 
   it('renders an ide container', (done) => {
-    this.vm.openedFiles = ['idiidid'];
-    this.vm.binary = false;
-
     Vue.nextTick(() => {
-      expect(this.vm.shouldHideEditor).toBe(false);
-      expect(this.vm.$el.id).toEqual('ide');
-      expect(this.vm.$el.tagName).toBe('DIV');
+      expect(vm.shouldHideEditor).toBeFalsy();
       done();
     });
   });
 
-  describe('when there are no open files', () => {
-    it('does not render the ide', (done) => {
-      this.vm.openedFiles = [];
-
-      Vue.nextTick(() => {
-        expect(this.vm.shouldHideEditor).toBe(true);
-        expect(this.vm.$el.tagName).not.toBeDefined();
-        done();
-      });
-    });
-  });
-
   describe('when open file is binary and not raw', () => {
     it('does not render the IDE', (done) => {
-      this.vm.binary = true;
-      this.vm.activeFile = {
-        raw: false,
-      };
+      vm.$store.getters.activeFile.binary = true;
 
       Vue.nextTick(() => {
-        expect(this.vm.shouldHideEditor).toBe(true);
-        expect(this.vm.$el.tagName).not.toBeDefined();
+        expect(vm.shouldHideEditor).toBeTruthy();
         done();
       });
     });
diff --git a/spec/javascripts/repo/components/repo_file_buttons_spec.js b/spec/javascripts/repo/components/repo_file_buttons_spec.js
index 111c83ee50d..d6e255e4810 100644
--- a/spec/javascripts/repo/components/repo_file_buttons_spec.js
+++ b/spec/javascripts/repo/components/repo_file_buttons_spec.js
@@ -1,72 +1,49 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoFileButtons from '~/repo/components/repo_file_buttons.vue';
-import RepoStore from '~/repo/stores/repo_store';
+import { file, resetStore } from '../helpers';
 
 describe('RepoFileButtons', () => {
-  const activeFile = {
-    extension: 'md',
-    url: 'url',
-    raw_path: 'raw_path',
-    blame_path: 'blame_path',
-    commits_path: 'commits_path',
-    permalink: 'permalink',
-  };
+  const activeFile = file();
+  let vm;
 
   function createComponent() {
     const RepoFileButtons = Vue.extend(repoFileButtons);
 
-    return new RepoFileButtons().$mount();
+    activeFile.rawPath = 'test';
+    activeFile.blamePath = 'test';
+    activeFile.commitsPath = 'test';
+    activeFile.active = true;
+    store.state.openFiles.push(activeFile);
+
+    return new RepoFileButtons({
+      store,
+    }).$mount();
   }
 
   afterEach(() => {
-    RepoStore.openedFiles = [];
-  });
-
-  it('renders Raw, Blame, History, Permalink and Preview toggle', () => {
-    const activeFileLabel = 'activeFileLabel';
-    RepoStore.openedFiles = new Array(1);
-    RepoStore.activeFile = activeFile;
-    RepoStore.activeFileLabel = activeFileLabel;
-    RepoStore.editMode = true;
-    RepoStore.binary = false;
+    vm.$destroy();
 
-    const vm = createComponent();
-    const raw = vm.$el.querySelector('.raw');
-    const blame = vm.$el.querySelector('.blame');
-    const history = vm.$el.querySelector('.history');
-
-    expect(raw.href).toMatch(`/${activeFile.raw_path}`);
-    expect(raw.textContent.trim()).toEqual('Raw');
-    expect(blame.href).toMatch(`/${activeFile.blame_path}`);
-    expect(blame.textContent.trim()).toEqual('Blame');
-    expect(history.href).toMatch(`/${activeFile.commits_path}`);
-    expect(history.textContent.trim()).toEqual('History');
-    expect(vm.$el.querySelector('.permalink').textContent.trim()).toEqual('Permalink');
-    expect(vm.$el.querySelector('.preview').textContent.trim()).toEqual(activeFileLabel);
+    resetStore(vm.$store);
   });
 
-  it('triggers rawPreviewToggle on preview click', () => {
-    RepoStore.openedFiles = new Array(1);
-    RepoStore.activeFile = activeFile;
-    RepoStore.editMode = true;
-
-    const vm = createComponent();
-    const preview = vm.$el.querySelector('.preview');
-
-    spyOn(vm, 'rawPreviewToggle');
-
-    preview.click();
-
-    expect(vm.rawPreviewToggle).toHaveBeenCalled();
-  });
+  it('renders Raw, Blame, History, Permalink and Preview toggle', (done) => {
+    vm = createComponent();
 
-  it('does not render preview toggle if not canPreview', () => {
-    activeFile.extension = 'js';
-    RepoStore.openedFiles = new Array(1);
-    RepoStore.activeFile = activeFile;
+    vm.$nextTick(() => {
+      const raw = vm.$el.querySelector('.raw');
+      const blame = vm.$el.querySelector('.blame');
+      const history = vm.$el.querySelector('.history');
 
-    const vm = createComponent();
+      expect(raw.href).toMatch(`/${activeFile.rawPath}`);
+      expect(raw.textContent.trim()).toEqual('Raw');
+      expect(blame.href).toMatch(`/${activeFile.blamePath}`);
+      expect(blame.textContent.trim()).toEqual('Blame');
+      expect(history.href).toMatch(`/${activeFile.commitsPath}`);
+      expect(history.textContent.trim()).toEqual('History');
+      expect(vm.$el.querySelector('.permalink').textContent.trim()).toEqual('Permalink');
 
-    expect(vm.$el.querySelector('.preview')).toBeFalsy();
+      done();
+    });
   });
 });
diff --git a/spec/javascripts/repo/components/repo_file_spec.js b/spec/javascripts/repo/components/repo_file_spec.js
index 8403df9be64..18ae461128e 100644
--- a/spec/javascripts/repo/components/repo_file_spec.js
+++ b/spec/javascripts/repo/components/repo_file_spec.js
@@ -1,32 +1,28 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoFile from '~/repo/components/repo_file.vue';
-import RepoStore from '~/repo/stores/repo_store';
-import eventHub from '~/repo/event_hub';
-import { file } from '../mock_data';
+import { file, resetStore } from '../helpers';
 
 describe('RepoFile', () => {
   const updated = 'updated';
-  const otherFile = {
-    id: 'test',
-    html: '<p class="file-content">html</p>',
-    pageTitle: 'otherpageTitle',
-  };
 
   function createComponent(propsData) {
     const RepoFile = Vue.extend(repoFile);
 
     return new RepoFile({
+      store,
       propsData,
     }).$mount();
   }
 
-  beforeEach(() => {
-    RepoStore.openedFiles = [];
+  afterEach(() => {
+    resetStore(vm.$store);
   });
 
   it('renders link, icon, name and last commit details', () => {
     const RepoFile = Vue.extend(repoFile);
     const vm = new RepoFile({
+      store,
       propsData: {
         file: file(),
       },
@@ -54,12 +50,6 @@ describe('RepoFile', () => {
     expect(vm.$el.querySelector('.fa-spin.fa-spinner')).toBeFalsy();
   });
 
-  it('sets the document title correctly', () => {
-    RepoStore.setActiveFiles(otherFile);
-
-    expect(document.title.trim()).toEqual(otherFile.pageTitle);
-  });
-
   it('renders a spinner if the file is loading', () => {
     const f = file();
     f.loading = true;
@@ -71,27 +61,30 @@ describe('RepoFile', () => {
     expect(vm.$el.querySelector('.fa-spin.fa-spinner').style.marginLeft).toEqual(`${vm.file.level * 16}px`);
   });
 
-  it('does not render commit message and datetime if mini', () => {
-    RepoStore.openedFiles.push(file());
-
+  it('does not render commit message and datetime if mini', (done) => {
     const vm = createComponent({
       file: file(),
     });
+    vm.$store.state.openFiles.push(vm.file);
 
-    expect(vm.$el.querySelector('.commit-message')).toBeFalsy();
-    expect(vm.$el.querySelector('.commit-update')).toBeFalsy();
+    vm.$nextTick(() => {
+      expect(vm.$el.querySelector('.commit-message')).toBeFalsy();
+      expect(vm.$el.querySelector('.commit-update')).toBeFalsy();
+
+      done();
+    });
   });
 
-  it('fires linkClicked when the link is clicked', () => {
+  it('fires clickedTreeRow when the link is clicked', () => {
     const vm = createComponent({
       file: file(),
     });
 
-    spyOn(vm, 'linkClicked');
+    spyOn(vm, 'clickedTreeRow');
 
     vm.$el.click();
 
-    expect(vm.linkClicked).toHaveBeenCalledWith(vm.file);
+    expect(vm.clickedTreeRow).toHaveBeenCalledWith(vm.file);
   });
 
   describe('submodule', () => {
@@ -119,20 +112,4 @@ describe('RepoFile', () => {
       expect(vm.$el.querySelector('td').textContent.replace(/\s+/g, ' ')).toContain('submodule name @ 12345678');
     });
   });
-
-  describe('methods', () => {
-    describe('linkClicked', () => {
-      it('$emits fileNameClicked with file obj', () => {
-        spyOn(eventHub, '$emit');
-
-        const vm = createComponent({
-          file: file(),
-        });
-
-        vm.linkClicked(vm.file);
-
-        expect(eventHub.$emit).toHaveBeenCalledWith('fileNameClicked', vm.file);
-      });
-    });
-  });
 });
diff --git a/spec/javascripts/repo/components/repo_loading_file_spec.js b/spec/javascripts/repo/components/repo_loading_file_spec.js
index e9f95a02028..031f2a9c0b2 100644
--- a/spec/javascripts/repo/components/repo_loading_file_spec.js
+++ b/spec/javascripts/repo/components/repo_loading_file_spec.js
@@ -1,13 +1,16 @@
 import Vue from 'vue';
-import RepoStore from '~/repo/stores/repo_store';
+import store from '~/repo/stores';
 import repoLoadingFile from '~/repo/components/repo_loading_file.vue';
+import { resetStore } from '../helpers';
 
 describe('RepoLoadingFile', () => {
-  function createComponent(propsData) {
+  let vm;
+
+  function createComponent() {
     const RepoLoadingFile = Vue.extend(repoLoadingFile);
 
     return new RepoLoadingFile({
-      propsData,
+      store,
     }).$mount();
   }
 
@@ -30,33 +33,30 @@ describe('RepoLoadingFile', () => {
   }
 
   afterEach(() => {
-    RepoStore.openedFiles = [];
+    vm.$destroy();
+
+    resetStore(vm.$store);
   });
 
   it('renders 3 columns of animated LoC', () => {
-    const vm = createComponent({
-      loading: {
-        tree: true,
-      },
-      hasFiles: false,
-    });
+    vm = createComponent();
     const columns = [...vm.$el.querySelectorAll('td')];
 
     expect(columns.length).toEqual(3);
     assertColumns(columns);
   });
 
-  it('renders 1 column of animated LoC if isMini', () => {
-    RepoStore.openedFiles = new Array(1);
-    const vm = createComponent({
-      loading: {
-        tree: true,
-      },
-      hasFiles: false,
-    });
-    const columns = [...vm.$el.querySelectorAll('td')];
+  it('renders 1 column of animated LoC if isMini', (done) => {
+    vm = createComponent();
+    vm.$store.state.openFiles.push('test');
 
-    expect(columns.length).toEqual(1);
-    assertColumns(columns);
+    vm.$nextTick(() => {
+      const columns = [...vm.$el.querySelectorAll('td')];
+
+      expect(columns.length).toEqual(1);
+      assertColumns(columns);
+
+      done();
+    });
   });
 });
diff --git a/spec/javascripts/repo/components/repo_prev_directory_spec.js b/spec/javascripts/repo/components/repo_prev_directory_spec.js
index 4c064f21084..7f82ae36a64 100644
--- a/spec/javascripts/repo/components/repo_prev_directory_spec.js
+++ b/spec/javascripts/repo/components/repo_prev_directory_spec.js
@@ -1,47 +1,45 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoPrevDirectory from '~/repo/components/repo_prev_directory.vue';
-import eventHub from '~/repo/event_hub';
+import { resetStore } from '../helpers';
 
 describe('RepoPrevDirectory', () => {
-  function createComponent(propsData) {
+  let vm;
+  const parentLink = 'parent';
+  function createComponent() {
     const RepoPrevDirectory = Vue.extend(repoPrevDirectory);
 
-    return new RepoPrevDirectory({
-      propsData,
-    }).$mount();
-  }
-
-  it('renders a prev dir link', () => {
-    const prevUrl = 'prevUrl';
-    const vm = createComponent({
-      prevUrl,
+    const comp = new RepoPrevDirectory({
+      store,
     });
-    const link = vm.$el.querySelector('a');
 
-    spyOn(vm, 'linkClicked');
+    comp.$store.state.parentTreeUrl = parentLink;
 
-    expect(link.href).toMatch(`/${prevUrl}`);
-    expect(link.textContent).toEqual('...');
+    return comp.$mount();
+  }
+
+  beforeEach(() => {
+    vm = createComponent();
+  });
 
-    link.click();
+  afterEach(() => {
+    vm.$destroy();
 
-    expect(vm.linkClicked).toHaveBeenCalledWith(prevUrl);
+    resetStore(vm.$store);
   });
 
-  describe('methods', () => {
-    describe('linkClicked', () => {
-      it('$emits linkclicked with prevUrl', () => {
-        const prevUrl = 'prevUrl';
-        const vm = createComponent({
-          prevUrl,
-        });
+  it('renders a prev dir link', () => {
+    const link = vm.$el.querySelector('a');
 
-        spyOn(eventHub, '$emit');
+    expect(link.href).toMatch(`/${parentLink}`);
+    expect(link.textContent).toEqual('...');
+  });
 
-        vm.linkClicked(prevUrl);
+  it('clicking row triggers getTreeData', () => {
+    spyOn(vm, 'getTreeData');
 
-        expect(eventHub.$emit).toHaveBeenCalledWith('goToPreviousDirectoryClicked', prevUrl);
-      });
-    });
+    vm.$el.querySelector('td').click();
+
+    expect(vm.getTreeData).toHaveBeenCalledWith({ endpoint: parentLink });
   });
 });
diff --git a/spec/javascripts/repo/components/repo_preview_spec.js b/spec/javascripts/repo/components/repo_preview_spec.js
index 4920cf02083..8d1a87494cf 100644
--- a/spec/javascripts/repo/components/repo_preview_spec.js
+++ b/spec/javascripts/repo/components/repo_preview_spec.js
@@ -1,23 +1,37 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoPreview from '~/repo/components/repo_preview.vue';
-import RepoStore from '~/repo/stores/repo_store';
+import { file, resetStore } from '../helpers';
 
 describe('RepoPreview', () => {
+  let vm;
+
   function createComponent() {
+    const f = file();
     const RepoPreview = Vue.extend(repoPreview);
 
-    return new RepoPreview().$mount();
+    const comp = new RepoPreview({
+      store,
+    });
+
+    f.active = true;
+    f.html = 'test';
+
+    comp.$store.state.openFiles.push(f);
+
+    return comp.$mount();
   }
 
-  it('renders a div with the activeFile html', () => {
-    const activeFile = {
-      html: '<p class="file-content">html</p>',
-    };
-    RepoStore.activeFile = activeFile;
+  afterEach(() => {
+    vm.$destroy();
+
+    resetStore(vm.$store);
+  });
 
-    const vm = createComponent();
+  it('renders a div with the activeFile html', () => {
+    vm = createComponent();
 
     expect(vm.$el.tagName).toEqual('DIV');
-    expect(vm.$el.innerHTML).toContain(activeFile.html);
+    expect(vm.$el.innerHTML).toContain('test');
   });
 });
diff --git a/spec/javascripts/repo/components/repo_sidebar_spec.js b/spec/javascripts/repo/components/repo_sidebar_spec.js
index 148f275e03d..7cb4dace491 100644
--- a/spec/javascripts/repo/components/repo_sidebar_spec.js
+++ b/spec/javascripts/repo/components/repo_sidebar_spec.js
@@ -1,32 +1,31 @@
 import Vue from 'vue';
-import Helper from '~/repo/helpers/repo_helper';
-import RepoService from '~/repo/services/repo_service';
-import RepoStore from '~/repo/stores/repo_store';
+import store from '~/repo/stores';
 import repoSidebar from '~/repo/components/repo_sidebar.vue';
-import { file } from '../mock_data';
+import { file, resetStore } from '../helpers';
 
 describe('RepoSidebar', () => {
   let vm;
 
-  function createComponent() {
+  beforeEach(() => {
     const RepoSidebar = Vue.extend(repoSidebar);
 
-    return new RepoSidebar().$mount();
-  }
+    vm = new RepoSidebar({
+      store,
+    });
+
+    vm.$store.state.isRoot = true;
+    vm.$store.state.tree.push(file());
+
+    vm.$mount();
+  });
 
   afterEach(() => {
     vm.$destroy();
 
-    RepoStore.files = [];
-    RepoStore.openedFiles = [];
+    resetStore(vm.$store);
   });
 
   it('renders a sidebar', () => {
-    RepoStore.files = [file()];
-    RepoStore.openedFiles = [];
-    RepoStore.isRoot = true;
-
-    vm = createComponent();
     const thead = vm.$el.querySelector('thead');
     const tbody = vm.$el.querySelector('tbody');
 
@@ -41,139 +40,36 @@ describe('RepoSidebar', () => {
     expect(tbody.querySelector('.file')).toBeTruthy();
   });
 
-  it('does not render a thead, renders repo-file-options and sets sidebar-mini class if isMini', () => {
-    RepoStore.openedFiles = [{
-      id: 0,
-    }];
-    vm = createComponent();
-
-    expect(vm.$el.classList.contains('sidebar-mini')).toBeTruthy();
-    expect(vm.$el.querySelector('thead')).toBeTruthy();
-    expect(vm.$el.querySelector('thead .repo-file-options')).toBeTruthy();
-  });
-
-  it('renders 5 loading files if tree is loading and not hasFiles', () => {
-    RepoStore.loading.tree = true;
-    RepoStore.files = [];
-    vm = createComponent();
+  it('does not render a thead, renders repo-file-options and sets sidebar-mini class if isMini', (done) => {
+    vm.$store.state.openFiles.push(vm.$store.state.tree[0]);
 
-    expect(vm.$el.querySelectorAll('tbody .loading-file').length).toEqual(5);
-  });
-
-  it('renders a prev directory if is not root', () => {
-    RepoStore.files = [file()];
-    RepoStore.isRoot = false;
-    RepoStore.loading.tree = false;
-    vm = createComponent();
-
-    expect(vm.$el.querySelector('tbody .prev-directory')).toBeTruthy();
-  });
+    Vue.nextTick(() => {
+      expect(vm.$el.classList.contains('sidebar-mini')).toBeTruthy();
+      expect(vm.$el.querySelector('thead')).toBeTruthy();
+      expect(vm.$el.querySelector('thead .repo-file-options')).toBeTruthy();
 
-  describe('flattendFiles', () => {
-    it('returns a flattend array of files', () => {
-      const f = file();
-      f.files.push(file('testing 123'));
-      const files = [f, file()];
-      vm = createComponent();
-      vm.files = files;
-
-      expect(vm.flattendFiles.length).toBe(3);
-      expect(vm.flattendFiles[1].name).toBe('testing 123');
+      done();
     });
   });
 
-  describe('methods', () => {
-    describe('fileClicked', () => {
-      it('should fetch data for new file', () => {
-        spyOn(Helper, 'getContent').and.callThrough();
-        RepoStore.files = [file()];
-        RepoStore.isRoot = true;
-        vm = createComponent();
-
-        vm.fileClicked(RepoStore.files[0]);
-
-        expect(Helper.getContent).toHaveBeenCalledWith(RepoStore.files[0]);
-      });
-
-      it('should not fetch data for already opened files', () => {
-        const f = file();
-        spyOn(Helper, 'getFileFromPath').and.returnValue(f);
-        spyOn(RepoStore, 'setActiveFiles');
-        vm = createComponent();
-        vm.fileClicked(f);
+  it('renders 5 loading files if tree is loading', (done) => {
+    vm.$store.state.tree = [];
+    vm.$store.state.loading = true;
 
-        expect(RepoStore.setActiveFiles).toHaveBeenCalledWith(f);
-      });
+    Vue.nextTick(() => {
+      expect(vm.$el.querySelectorAll('tbody .loading-file').length).toEqual(5);
 
-      it('should hide files in directory if already open', () => {
-        spyOn(Helper, 'setDirectoryToClosed').and.callThrough();
-        const f = file();
-        f.opened = true;
-        f.type = 'tree';
-        RepoStore.files = [f];
-        vm = createComponent();
-
-        vm.fileClicked(RepoStore.files[0]);
-
-        expect(Helper.setDirectoryToClosed).toHaveBeenCalledWith(RepoStore.files[0]);
-      });
-
-      describe('submodule', () => {
-        it('opens submodule project URL', () => {
-          spyOn(gl.utils, 'visitUrl');
-
-          const f = file();
-          f.type = 'submodule';
-
-          vm = createComponent();
-
-          vm.fileClicked(f);
-
-          expect(gl.utils.visitUrl).toHaveBeenCalledWith('url');
-        });
-      });
-    });
-
-    describe('goToPreviousDirectoryClicked', () => {
-      it('should hide files in directory if already open', () => {
-        const prevUrl = 'foo/bar';
-        vm = createComponent();
-
-        vm.goToPreviousDirectoryClicked(prevUrl);
-
-        expect(RepoService.url).toEqual(prevUrl);
-      });
+      done();
     });
+  });
 
-    describe('back button', () => {
-      beforeEach(() => {
-        const f = file();
-        const file2 = Object.assign({}, file());
-        file2.url = 'test';
-        RepoStore.files = [f, file2];
-        RepoStore.openedFiles = [];
-        RepoStore.isRoot = true;
-
-        vm = createComponent();
-      });
-
-      it('render previous file when using back button', () => {
-        spyOn(Helper, 'getContent').and.callThrough();
-
-        vm.fileClicked(RepoStore.files[1]);
-        expect(Helper.getContent).toHaveBeenCalledWith(RepoStore.files[1]);
-
-        history.pushState({
-          key: Math.random(),
-        }, '', RepoStore.files[1].url);
-        const popEvent = document.createEvent('Event');
-        popEvent.initEvent('popstate', true, true);
-        window.dispatchEvent(popEvent);
+  it('renders a prev directory if is not root', (done) => {
+    vm.$store.state.isRoot = false;
 
-        expect(Helper.getContent.calls.mostRecent().args[0].url).toContain(RepoStore.files[1].url);
+    Vue.nextTick(() => {
+      expect(vm.$el.querySelector('tbody .prev-directory')).toBeTruthy();
 
-        window.history.pushState({}, null, '/');
-      });
+      done();
     });
   });
 });
diff --git a/spec/javascripts/repo/components/repo_spec.js b/spec/javascripts/repo/components/repo_spec.js
index 3558a155728..b32d2c13af8 100644
--- a/spec/javascripts/repo/components/repo_spec.js
+++ b/spec/javascripts/repo/components/repo_spec.js
@@ -1,9 +1,8 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repo from '~/repo/components/repo.vue';
-import RepoStore from '~/repo/stores/repo_store';
-import Service from '~/repo/services/repo_service';
-import eventHub from '~/repo/event_hub';
-import createComponent from '../../helpers/vue_mount_component_helper';
+import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
+import { file, resetStore } from '../helpers';
 
 describe('repo component', () => {
   let vm;
@@ -11,86 +10,26 @@ describe('repo component', () => {
   beforeEach(() => {
     const Component = Vue.extend(repo);
 
-    RepoStore.currentBranch = 'master';
-
-    vm = createComponent(Component);
+    vm = createComponentWithStore(Component, store).$mount();
   });
 
   afterEach(() => {
     vm.$destroy();
 
-    RepoStore.currentBranch = '';
+    resetStore(vm.$store);
   });
 
-  describe('createNewBranch', () => {
-    beforeEach(() => {
-      spyOn(history, 'pushState');
-    });
-
-    describe('success', () => {
-      beforeEach(() => {
-        spyOn(Service, 'createBranch').and.returnValue(Promise.resolve({
-          data: {
-            name: 'test',
-          },
-        }));
-      });
-
-      it('calls createBranch with branchName', () => {
-        eventHub.$emit('createNewBranch', 'test');
-
-        expect(Service.createBranch).toHaveBeenCalledWith({
-          branch: 'test',
-          ref: RepoStore.currentBranch,
-        });
-      });
-
-      it('pushes new history state', (done) => {
-        RepoStore.currentBranch = 'master';
-
-        spyOn(vm, 'getCurrentLocation').and.returnValue('http://test.com/master');
-
-        eventHub.$emit('createNewBranch', 'test');
-
-        setTimeout(() => {
-          expect(history.pushState).toHaveBeenCalledWith(jasmine.anything(), '', 'http://test.com/test');
-          done();
-        });
-      });
-
-      it('updates stores currentBranch', (done) => {
-        eventHub.$emit('createNewBranch', 'test');
-
-        setTimeout(() => {
-          expect(RepoStore.currentBranch).toBe('test');
-
-          done();
-        });
-      });
-    });
-
-    describe('failure', () => {
-      beforeEach(() => {
-        spyOn(Service, 'createBranch').and.returnValue(Promise.reject({
-          response: {
-            data: {
-              message: 'test',
-            },
-          },
-        }));
-      });
-
-      it('emits createNewBranchError event', (done) => {
-        spyOn(eventHub, '$emit').and.callThrough();
+  it('does not render panel right when no files open', () => {
+    expect(vm.$el.querySelector('.panel-right')).toBeNull();
+  });
 
-        eventHub.$emit('createNewBranch', 'test');
+  it('renders panel right when files are open', (done) => {
+    vm.$store.state.tree.push(file());
 
-        setTimeout(() => {
-          expect(eventHub.$emit).toHaveBeenCalledWith('createNewBranchError', 'test');
+    Vue.nextTick(() => {
+      expect(vm.$el.querySelector('.panel-right')).toBeNull();
 
-          done();
-        });
-      });
+      done();
     });
   });
 });
diff --git a/spec/javascripts/repo/components/repo_tab_spec.js b/spec/javascripts/repo/components/repo_tab_spec.js
index 37e297437f0..0d1c22a2f89 100644
--- a/spec/javascripts/repo/components/repo_tab_spec.js
+++ b/spec/javascripts/repo/components/repo_tab_spec.js
@@ -1,46 +1,61 @@
 import Vue from 'vue';
+import store from '~/repo/stores';
 import repoTab from '~/repo/components/repo_tab.vue';
-import RepoStore from '~/repo/stores/repo_store';
+import { file, resetStore } from '../helpers';
 
 describe('RepoTab', () => {
   function createComponent(propsData) {
     const RepoTab = Vue.extend(repoTab);
 
     return new RepoTab({
+      store,
       propsData,
     }).$mount();
   }
 
+  afterEach(() => {
+    resetStore(vm.$store);
+  });
+
   it('renders a close link and a name link', () => {
-    const tab = {
-      url: 'url',
-      name: 'name',
-    };
     const vm = createComponent({
-      tab,
+      tab: file(),
     });
+    vm.$store.state.openFiles.push(vm.tab);
     const close = vm.$el.querySelector('.close-btn');
-    const name = vm.$el.querySelector(`a[title="${tab.url}"]`);
-
-    spyOn(vm, 'closeTab');
-    spyOn(vm, 'tabClicked');
+    const name = vm.$el.querySelector(`a[title="${vm.tab.url}"]`);
 
     expect(close.querySelector('.fa-times')).toBeTruthy();
-    expect(name.textContent.trim()).toEqual(tab.name);
+    expect(name.textContent.trim()).toEqual(vm.tab.name);
+  });
+
+  it('calls setFileActive when clicking tab', () => {
+    const vm = createComponent({
+      tab: file(),
+    });
+
+    spyOn(vm, 'setFileActive');
+
+    vm.$el.click();
+
+    expect(vm.setFileActive).toHaveBeenCalledWith(vm.tab);
+  });
+
+  it('calls closeFile when clicking close button', () => {
+    const vm = createComponent({
+      tab: file(),
+    });
+
+    spyOn(vm, 'closeFile');
 
-    close.click();
-    name.click();
+    vm.$el.querySelector('.close-btn').click();
 
-    expect(vm.closeTab).toHaveBeenCalledWith(tab);
-    expect(vm.tabClicked).toHaveBeenCalledWith(tab);
+    expect(vm.closeFile).toHaveBeenCalledWith({ file: vm.tab });
   });
 
   it('renders an fa-circle icon if tab is changed', () => {
-    const tab = {
-      url: 'url',
-      name: 'name',
-      changed: true,
-    };
+    const tab = file();
+    tab.changed = true;
     const vm = createComponent({
       tab,
     });
@@ -50,38 +65,41 @@ describe('RepoTab', () => {
 
   describe('methods', () => {
     describe('closeTab', () => {
-      it('returns undefined and does not $emit if file is changed', () => {
-        const tab = {
-          url: 'url',
-          name: 'name',
-          changed: true,
-        };
+      it('does not close tab if is changed', (done) => {
+        const tab = file();
+        tab.changed = true;
+        tab.opened = true;
         const vm = createComponent({
           tab,
         });
-
-        spyOn(RepoStore, 'removeFromOpenedFiles');
+        vm.$store.state.openFiles.push(tab);
+        vm.$store.dispatch('setFileActive', tab);
 
         vm.$el.querySelector('.close-btn').click();
 
-        expect(RepoStore.removeFromOpenedFiles).not.toHaveBeenCalled();
+        vm.$nextTick(() => {
+          expect(tab.opened).toBeTruthy();
+
+          done();
+        });
       });
 
-      it('$emits tabclosed event with file obj', () => {
-        const tab = {
-          url: 'url',
-          name: 'name',
-          changed: false,
-        };
+      it('closes tab when clicking close btn', (done) => {
+        const tab = file('lose');
+        tab.opened = true;
         const vm = createComponent({
           tab,
         });
-
-        spyOn(RepoStore, 'removeFromOpenedFiles');
+        vm.$store.state.openFiles.push(tab);
+        vm.$store.dispatch('setFileActive', tab);
 
         vm.$el.querySelector('.close-btn').click();
 
-        expect(RepoStore.removeFromOpenedFiles).toHaveBeenCalledWith(tab);
+        vm.$nextTick(() => {
+          expect(tab.opened).toBeFalsy();
+
+          done();
+        });
       });
     });
   });
diff --git a/spec/javascripts/repo/components/repo_tabs_spec.js b/spec/javascripts/repo/components/repo_tabs_spec.js
index 431129bc866..73ecdab6967 100644
--- a/spec/javascripts/repo/components/repo_tabs_spec.js
+++ b/spec/javascripts/repo/components/repo_tabs_spec.js
@@ -1,35 +1,37 @@
 import Vue from 'vue';
-import RepoStore from '~/repo/stores/repo_store';
+import store from '~/repo/stores';
 import repoTabs from '~/repo/components/repo_tabs.vue';
+import { file, resetStore } from '../helpers';
 
 describe('RepoTabs', () => {
-  const openedFiles = [{
-    id: 0,
-    active: true,
-  }, {
-    id: 1,
-  }];
+  const openedFiles = [file(), file()];
 
   function createComponent() {
     const RepoTabs = Vue.extend(repoTabs);
 
-    return new RepoTabs().$mount();
+    return new RepoTabs({
+      store,
+    }).$mount();
   }
 
   afterEach(() => {
-    RepoStore.openedFiles = [];
+    resetStore(vm.$store);
   });
 
-  it('renders a list of tabs', () => {
-    RepoStore.openedFiles = openedFiles;
-
+  it('renders a list of tabs', (done) => {
     const vm = createComponent();
-    const tabs = [...vm.$el.querySelectorAll(':scope > li')];
+    openedFiles[0].active = true;
+    vm.$store.state.openFiles = openedFiles;
+
+    vm.$nextTick(() => {
+      const tabs = [...vm.$el.querySelectorAll(':scope > li')];
+
+      expect(tabs.length).toEqual(3);
+      expect(tabs[0].classList.contains('active')).toBeTruthy();
+      expect(tabs[1].classList.contains('active')).toBeFalsy();
+      expect(tabs[2].classList.contains('tabs-divider')).toBeTruthy();
 
-    expect(vm.$el.id).toEqual('tabs');
-    expect(tabs.length).toEqual(3);
-    expect(tabs[0].classList.contains('active')).toBeTruthy();
-    expect(tabs[1].classList.contains('active')).toBeFalsy();
-    expect(tabs[2].classList.contains('tabs-divider')).toBeTruthy();
+      done();
+    });
   });
 });
diff --git a/spec/javascripts/repo/helpers.js b/spec/javascripts/repo/helpers.js
new file mode 100644
index 00000000000..376c291c64b
--- /dev/null
+++ b/spec/javascripts/repo/helpers.js
@@ -0,0 +1,20 @@
+import { decorateData } from '~/repo/stores/utils';
+import state from '~/repo/stores/state';
+
+export const resetStore = (store) => {
+  store.replaceState(state());
+};
+
+export const file = (name = 'name', id = name, type = '') => decorateData({
+  id,
+  type,
+  icon: 'icon',
+  url: 'url',
+  name,
+  path: name,
+  last_commit: {
+    id: '123',
+    message: 'test',
+    committed_date: new Date().toISOString(),
+  },
+});
diff --git a/spec/javascripts/repo/mock_data.js b/spec/javascripts/repo/mock_data.js
deleted file mode 100644
index 71e275caf09..00000000000
--- a/spec/javascripts/repo/mock_data.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import RepoHelper from '~/repo/helpers/repo_helper';
-
-// eslint-disable-next-line import/prefer-default-export
-export const file = (name = 'name', id = name) => RepoHelper.serializeRepoEntity('blob', {
-  id,
-  icon: 'icon',
-  url: 'url',
-  name,
-  last_commit: {
-    id: '123',
-    message: 'test',
-    committed_date: new Date().toISOString(),
-  },
-});
diff --git a/spec/javascripts/repo/services/repo_service_spec.js b/spec/javascripts/repo/services/repo_service_spec.js
deleted file mode 100644
index 6f530770525..00000000000
--- a/spec/javascripts/repo/services/repo_service_spec.js
+++ /dev/null
@@ -1,171 +0,0 @@
-import axios from 'axios';
-import RepoService from '~/repo/services/repo_service';
-import RepoStore from '~/repo/stores/repo_store';
-import Api from '~/api';
-
-describe('RepoService', () => {
-  it('has default json format param', () => {
-    expect(RepoService.options.params.format).toBe('json');
-  });
-
-  describe('buildParams', () => {
-    let newParams;
-    const url = 'url';
-
-    beforeEach(() => {
-      newParams = {};
-
-      spyOn(Object, 'assign').and.returnValue(newParams);
-    });
-
-    it('clones params', () => {
-      const params = RepoService.buildParams(url);
-
-      expect(Object.assign).toHaveBeenCalledWith({}, RepoService.options.params);
-
-      expect(params).toBe(newParams);
-    });
-
-    it('sets and returns viewer params to richif urlIsRichBlob is true', () => {
-      spyOn(RepoService, 'urlIsRichBlob').and.returnValue(true);
-
-      const params = RepoService.buildParams(url);
-
-      expect(params.viewer).toEqual('rich');
-    });
-
-    it('returns params urlIsRichBlob is false', () => {
-      spyOn(RepoService, 'urlIsRichBlob').and.returnValue(false);
-
-      const params = RepoService.buildParams(url);
-
-      expect(params.viewer).toBeUndefined();
-    });
-
-    it('calls urlIsRichBlob with the objects url prop if no url arg is provided', () => {
-      spyOn(RepoService, 'urlIsRichBlob');
-      RepoService.url = url;
-
-      RepoService.buildParams();
-
-      expect(RepoService.urlIsRichBlob).toHaveBeenCalledWith(url);
-    });
-  });
-
-  describe('urlIsRichBlob', () => {
-    it('returns true for md extension', () => {
-      const isRichBlob = RepoService.urlIsRichBlob('url.md');
-
-      expect(isRichBlob).toBeTruthy();
-    });
-
-    it('returns false for js extension', () => {
-      const isRichBlob = RepoService.urlIsRichBlob('url.js');
-
-      expect(isRichBlob).toBeFalsy();
-    });
-  });
-
-  describe('getContent', () => {
-    const params = {};
-    const url = 'url';
-    const requestPromise = Promise.resolve();
-
-    beforeEach(() => {
-      spyOn(RepoService, 'buildParams').and.returnValue(params);
-      spyOn(axios, 'get').and.returnValue(requestPromise);
-    });
-
-    it('calls buildParams and axios.get', () => {
-      const request = RepoService.getContent(url);
-
-      expect(RepoService.buildParams).toHaveBeenCalledWith(url);
-      expect(axios.get).toHaveBeenCalledWith(url, {
-        params,
-      });
-      expect(request).toBe(requestPromise);
-    });
-
-    it('uses object url prop if no url arg is provided', () => {
-      RepoService.url = url;
-
-      RepoService.getContent();
-
-      expect(axios.get).toHaveBeenCalledWith(url, {
-        params,
-      });
-    });
-  });
-
-  describe('getBase64Content', () => {
-    const url = 'url';
-    const response = { data: 'data' };
-
-    beforeEach(() => {
-      spyOn(RepoService, 'bufferToBase64');
-      spyOn(axios, 'get').and.returnValue(Promise.resolve(response));
-    });
-
-    it('calls axios.get and bufferToBase64 on completion', (done) => {
-      const request = RepoService.getBase64Content(url);
-
-      expect(axios.get).toHaveBeenCalledWith(url, {
-        responseType: 'arraybuffer',
-      });
-      expect(request).toEqual(jasmine.any(Promise));
-
-      request.then(() => {
-        expect(RepoService.bufferToBase64).toHaveBeenCalledWith(response.data);
-        done();
-      }).catch(done.fail);
-    });
-  });
-
-  describe('commitFiles', () => {
-    it('calls commitMultiple and .then commitFlash', (done) => {
-      const projectId = 'projectId';
-      const payload = {};
-      RepoStore.projectId = projectId;
-
-      spyOn(Api, 'commitMultiple').and.returnValue(Promise.resolve());
-      spyOn(RepoService, 'commitFlash');
-
-      const apiPromise = RepoService.commitFiles(payload);
-
-      expect(Api.commitMultiple).toHaveBeenCalledWith(projectId, payload);
-
-      apiPromise.then(() => {
-        expect(RepoService.commitFlash).toHaveBeenCalled();
-        done();
-      }).catch(done.fail);
-    });
-  });
-
-  describe('commitFlash', () => {
-    it('calls Flash with data.message', () => {
-      const data = {
-        message: 'message',
-      };
-      spyOn(window, 'Flash');
-
-      RepoService.commitFlash(data);
-
-      expect(window.Flash).toHaveBeenCalledWith(data.message);
-    });
-
-    it('calls Flash with success string if short_id and stats', () => {
-      const data = {
-        short_id: 'short_id',
-        stats: {
-          additions: '4',
-          deletions: '5',
-        },
-      };
-      spyOn(window, 'Flash');
-
-      RepoService.commitFlash(data);
-
-      expect(window.Flash).toHaveBeenCalledWith(`Your changes have been committed. Commit ${data.short_id} with ${data.stats.additions} additions, ${data.stats.deletions} deletions.`, 'notice');
-    });
-  });
-});
-- 
cgit v1.2.1


From b19076948de9d637ab5a74ea59249cdb680c8495 Mon Sep 17 00:00:00 2001
From: Gabriel Mazetto <brodock@gmail.com>
Date: Fri, 27 Oct 2017 21:27:17 +0200
Subject: Moved renaming operations to storage layer abstraction

When project storage_version is `2` means attachments are using
hashed storage.
---
 app/models/project.rb                | 14 ++++-----
 app/models/storage/hashed_project.rb | 13 +++++++++
 app/models/storage/legacy_project.rb |  7 +++++
 spec/models/project_spec.rb          | 55 +++++++++++++++++++++++++++++++++---
 4 files changed, 76 insertions(+), 13 deletions(-)

diff --git a/app/models/project.rb b/app/models/project.rb
index 7185b4d44fc..d9bd6362e70 100644
--- a/app/models/project.rb
+++ b/app/models/project.rb
@@ -26,7 +26,10 @@ class Project < ActiveRecord::Base
 
   NUMBER_OF_PERMITTED_BOARDS = 1
   UNKNOWN_IMPORT_URL = 'http://unknown.git'.freeze
-  LATEST_STORAGE_VERSION = 1
+  # Hashed Storage versions handle rolling out new storage to project and dependents models
+  # 1: repository
+  # 2: attachments
+  LATEST_STORAGE_VERSION = 2
 
   cache_markdown_field :description, pipeline: :description
 
@@ -1384,7 +1387,7 @@ class Project < ActiveRecord::Base
     if storage.rename_repo
       Gitlab::AppLogger.info "Project was renamed: #{full_path_was} -> #{new_full_path}"
       rename_repo_notify!
-      after_rename_repo
+      storage.after_rename_repo
     else
       Rails.logger.error "Repository could not be renamed: #{full_path_was} -> #{new_full_path}"
 
@@ -1404,13 +1407,6 @@ class Project < ActiveRecord::Base
     reload_repository!
   end
 
-  def after_rename_repo
-    path_before_change = previous_changes['path'].first
-
-    Gitlab::UploadsTransfer.new.rename_project(path_before_change, self.path, namespace.full_path)
-    Gitlab::PagesTransfer.new.rename_project(path_before_change, self.path, namespace.full_path)
-  end
-
   def running_or_pending_build_count(force: false)
     Rails.cache.fetch(['projects', id, 'running_or_pending_build_count'], force: force) do
       builds.running_or_pending.count(:all)
diff --git a/app/models/storage/hashed_project.rb b/app/models/storage/hashed_project.rb
index f025f40994e..6be365166c4 100644
--- a/app/models/storage/hashed_project.rb
+++ b/app/models/storage/hashed_project.rb
@@ -32,6 +32,19 @@ module Storage
       true
     end
 
+    def after_rename_repo
+      path_before_change = project.previous_changes['path'].first
+
+      # We need to check if project had been rolled out to move resource to hashed storage or not and decide
+      # if we need execute any take action or no-op.
+
+      unless project.storage_version >= 2
+        Gitlab::UploadsTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
+      end
+
+      Gitlab::PagesTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
+    end
+
     private
 
     # Generates the hash for the project path and name on disk
diff --git a/app/models/storage/legacy_project.rb b/app/models/storage/legacy_project.rb
index 9d9e5e1d352..6e7dce8d25a 100644
--- a/app/models/storage/legacy_project.rb
+++ b/app/models/storage/legacy_project.rb
@@ -47,5 +47,12 @@ module Storage
 
       false
     end
+
+    def after_rename_repo
+      path_before_change = project.previous_changes['path'].first
+
+      Gitlab::UploadsTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
+      Gitlab::PagesTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
+    end
   end
 end
diff --git a/spec/models/project_spec.rb b/spec/models/project_spec.rb
index 74eba7e33f6..d80af378140 100644
--- a/spec/models/project_spec.rb
+++ b/spec/models/project_spec.rb
@@ -2452,6 +2452,7 @@ describe Project do
   context 'legacy storage' do
     let(:project) { create(:project, :repository) }
     let(:gitlab_shell) { Gitlab::Shell.new }
+    let(:project_storage) { project.send(:storage) }
 
     before do
       allow(project).to receive(:gitlab_shell).and_return(gitlab_shell)
@@ -2546,6 +2547,30 @@ describe Project do
 
         it { expect { subject }.to raise_error(StandardError) }
       end
+
+      context 'gitlab pages' do
+        before do
+          expect(project_storage).to receive(:rename_repo) { true }
+        end
+
+        it 'moves pages folder to new location' do
+          expect_any_instance_of(Gitlab::PagesTransfer).to receive(:rename_project)
+
+          project.rename_repo
+        end
+      end
+
+      context 'attachments' do
+        before do
+          expect(project_storage).to receive(:rename_repo) { true }
+        end
+
+        it 'moves uploads folder to new location' do
+          expect_any_instance_of(Gitlab::UploadsTransfer).to receive(:rename_project)
+
+          project.rename_repo
+        end
+      end
     end
 
     describe '#pages_path' do
@@ -2649,10 +2674,6 @@ describe Project do
           .to receive(:execute_hooks_for)
             .with(project, :rename)
 
-        expect_any_instance_of(Gitlab::UploadsTransfer)
-          .to receive(:rename_project)
-            .with('foo', project.path, project.namespace.full_path)
-
         expect(project).to receive(:expire_caches_before_rename)
 
         expect(project).to receive(:expires_full_path_cache)
@@ -2673,6 +2694,32 @@ describe Project do
 
         it { expect { subject }.to raise_error(StandardError) }
       end
+
+      context 'gitlab pages' do
+        it 'moves pages folder to new location' do
+          expect_any_instance_of(Gitlab::PagesTransfer).to receive(:rename_project)
+
+          project.rename_repo
+        end
+      end
+
+      context 'attachments' do
+        it 'keeps uploads folder location unchanged' do
+          expect_any_instance_of(Gitlab::UploadsTransfer).not_to receive(:rename_project)
+
+          project.rename_repo
+        end
+
+        context 'when not rolled out' do
+          let(:project) { create(:project, :repository, storage_version: 1) }
+
+          it 'moves pages folder to new location' do
+            expect_any_instance_of(Gitlab::UploadsTransfer).to receive(:rename_project)
+
+            project.rename_repo
+          end
+        end
+      end
     end
 
     describe '#pages_path' do
-- 
cgit v1.2.1


From a6c52c4e593850eb270e5bfbd021cdfb56e6eed6 Mon Sep 17 00:00:00 2001
From: Oswaldo Ferreira <oswaldo@gitlab.com>
Date: Fri, 27 Oct 2017 22:11:21 +0200
Subject: Make merge_jid handling less stateful in MergeService

---
 app/models/merge_request.rb                        |  4 +-
 app/services/merge_requests/merge_service.rb       |  9 +---
 app/workers/stuck_merge_jobs_worker.rb             |  2 +-
 spec/models/merge_request_spec.rb                  |  6 +++
 spec/services/merge_requests/merge_service_spec.rb | 49 ----------------------
 spec/workers/stuck_merge_jobs_worker_spec.rb       |  9 +++-
 6 files changed, 18 insertions(+), 61 deletions(-)

diff --git a/app/models/merge_request.rb b/app/models/merge_request.rb
index c3fae16d109..c952ab862d7 100644
--- a/app/models/merge_request.rb
+++ b/app/models/merge_request.rb
@@ -396,7 +396,9 @@ class MergeRequest < ActiveRecord::Base
   end
 
   def merge_ongoing?
-    !!merge_jid && !merged? && Gitlab::SidekiqStatus.running?(merge_jid)
+    # While the MergeRequest is locked, it should present itself as 'merge ongoing'.
+    # The unlocking process is handled by StuckMergeJobsWorker scheduled in Cron.
+    locked? || !!merge_jid && !merged? && Gitlab::SidekiqStatus.running?(merge_jid)
   end
 
   def closed_without_fork?
diff --git a/app/services/merge_requests/merge_service.rb b/app/services/merge_requests/merge_service.rb
index 8c5821aa870..156e7b2f078 100644
--- a/app/services/merge_requests/merge_service.rb
+++ b/app/services/merge_requests/merge_service.rb
@@ -82,16 +82,9 @@ module MergeRequests
         @merge_request.can_remove_source_branch?(branch_deletion_user)
     end
 
-    # Logs merge error message and cleans `MergeRequest#merge_jid`.
-    #
     def handle_merge_error(log_message:, save_message_on_model: false)
       Rails.logger.error("MergeService ERROR: #{merge_request_info} - #{log_message}")
-
-      if save_message_on_model
-        @merge_request.update(merge_error: log_message, merge_jid: nil)
-      else
-        clean_merge_jid
-      end
+      @merge_request.update(merge_error: log_message) if save_message_on_model
     end
 
     def merge_request_info
diff --git a/app/workers/stuck_merge_jobs_worker.rb b/app/workers/stuck_merge_jobs_worker.rb
index 7843179d77c..a396c0f27b2 100644
--- a/app/workers/stuck_merge_jobs_worker.rb
+++ b/app/workers/stuck_merge_jobs_worker.rb
@@ -23,7 +23,7 @@ class StuckMergeJobsWorker
     merge_requests = MergeRequest.where(id: completed_ids)
 
     merge_requests.where.not(merge_commit_sha: nil).update_all(state: :merged)
-    merge_requests.where(merge_commit_sha: nil).update_all(state: :opened)
+    merge_requests.where(merge_commit_sha: nil).update_all(state: :opened, merge_jid: nil)
 
     Rails.logger.info("Updated state of locked merge jobs. JIDs: #{completed_jids.join(', ')}")
   end
diff --git a/spec/models/merge_request_spec.rb b/spec/models/merge_request_spec.rb
index 2b8aa7cf9c3..476a2697605 100644
--- a/spec/models/merge_request_spec.rb
+++ b/spec/models/merge_request_spec.rb
@@ -1460,6 +1460,12 @@ describe MergeRequest do
   end
 
   describe '#merge_ongoing?' do
+    it 'returns true when the merge request is locked' do
+      merge_request = build_stubbed(:merge_request, state: :locked)
+
+      expect(merge_request.merge_ongoing?).to be(true)
+    end
+
     it 'returns true when merge_id, MR is not merged and it has no running job' do
       merge_request = build_stubbed(:merge_request, state: :open, merge_jid: 'foo')
       allow(Gitlab::SidekiqStatus).to receive(:running?).with('foo') { true }
diff --git a/spec/services/merge_requests/merge_service_spec.rb b/spec/services/merge_requests/merge_service_spec.rb
index d1043f99b5a..ac196e92601 100644
--- a/spec/services/merge_requests/merge_service_spec.rb
+++ b/spec/services/merge_requests/merge_service_spec.rb
@@ -12,55 +12,6 @@ describe MergeRequests::MergeService do
   end
 
   describe '#execute' do
-    context 'MergeRequest#merge_jid' do
-      let(:service) do
-        described_class.new(project, user, commit_message: 'Awesome message')
-      end
-
-      before do
-        merge_request.update_column(:merge_jid, 'hash-123')
-      end
-
-      it 'is cleaned when no error is raised' do
-        service.execute(merge_request)
-
-        expect(merge_request.reload.merge_jid).to be_nil
-      end
-
-      it 'is cleaned when expected error is raised' do
-        allow(service).to receive(:commit).and_raise(described_class::MergeError)
-
-        service.execute(merge_request)
-
-        expect(merge_request.reload.merge_jid).to be_nil
-      end
-
-      it 'is cleaned when merge request is not mergeable' do
-        allow(merge_request).to receive(:mergeable?).and_return(false)
-
-        service.execute(merge_request)
-
-        expect(merge_request.reload.merge_jid).to be_nil
-      end
-
-      it 'is cleaned when no source is found' do
-        allow(merge_request).to receive(:diff_head_sha).and_return(nil)
-
-        service.execute(merge_request)
-
-        expect(merge_request.reload.merge_jid).to be_nil
-      end
-
-      it 'is not cleaned when unexpected error is raised' do
-        service = described_class.new(project, user, commit_message: 'Awesome message')
-        allow(service).to receive(:commit).and_raise(StandardError)
-
-        expect { service.execute(merge_request) }.to raise_error(StandardError)
-
-        expect(merge_request.reload.merge_jid).to be_present
-      end
-    end
-
     context 'valid params' do
       let(:service) { described_class.new(project, user, commit_message: 'Awesome message') }
 
diff --git a/spec/workers/stuck_merge_jobs_worker_spec.rb b/spec/workers/stuck_merge_jobs_worker_spec.rb
index a5ad78393c9..f8b55e873df 100644
--- a/spec/workers/stuck_merge_jobs_worker_spec.rb
+++ b/spec/workers/stuck_merge_jobs_worker_spec.rb
@@ -12,8 +12,13 @@ describe StuckMergeJobsWorker do
 
         worker.perform
 
-        expect(mr_with_sha.reload).to be_merged
-        expect(mr_without_sha.reload).to be_opened
+        mr_with_sha.reload
+        mr_without_sha.reload
+
+        expect(mr_with_sha).to be_merged
+        expect(mr_without_sha).to be_opened
+        expect(mr_with_sha.merge_jid).to be_present
+        expect(mr_without_sha.merge_jid).to be_nil
       end
 
       it 'updates merge request to opened when locked but has not been merged' do
-- 
cgit v1.2.1


From d6cd7006aef0199fd346ead55bf094afcf696d40 Mon Sep 17 00:00:00 2001
From: Stan Hu <stanhu@gmail.com>
Date: Wed, 25 Oct 2017 21:15:35 +0300
Subject: Fix broken Members link when relative URL root paths are used

Navigating to the "Members" section of a project would omit the
relative URL root path. Fix the redirection and eliminate the
need for a redirection in the first place.

Fix other redirections failing to work with relative roots
---
 app/views/layouts/nav/sidebar/_project.html.haml             |  2 +-
 .../sh-fix-broken-redirection-relative-url-root.yml          |  5 +++++
 config/routes/ci.rb                                          |  2 +-
 config/routes/project.rb                                     |  2 +-
 config/routes/snippets.rb                                    |  2 +-
 config/routes/user.rb                                        | 12 ++++++------
 6 files changed, 15 insertions(+), 10 deletions(-)
 create mode 100644 changelogs/unreleased/sh-fix-broken-redirection-relative-url-root.yml

diff --git a/app/views/layouts/nav/sidebar/_project.html.haml b/app/views/layouts/nav/sidebar/_project.html.haml
index f82207559a3..66146e61263 100644
--- a/app/views/layouts/nav/sidebar/_project.html.haml
+++ b/app/views/layouts/nav/sidebar/_project.html.haml
@@ -274,7 +274,7 @@
               Members
           %ul.sidebar-sub-level-items.is-fly-out-only
             = nav_link(path: %w[members#show], html_options: { class: "fly-out-top-item" } ) do
-              = link_to project_settings_members_path(@project) do
+              = link_to project_project_members_path(@project) do
                 %strong.fly-out-top-item-name
                   #{ _('Members') }
 
diff --git a/changelogs/unreleased/sh-fix-broken-redirection-relative-url-root.yml b/changelogs/unreleased/sh-fix-broken-redirection-relative-url-root.yml
new file mode 100644
index 00000000000..96e5195d247
--- /dev/null
+++ b/changelogs/unreleased/sh-fix-broken-redirection-relative-url-root.yml
@@ -0,0 +1,5 @@
+---
+title: Fix broken Members link when relative URL root paths are used
+merge_request:
+author:
+type: fixed
diff --git a/config/routes/ci.rb b/config/routes/ci.rb
index cbd4c2db852..60c1724bc05 100644
--- a/config/routes/ci.rb
+++ b/config/routes/ci.rb
@@ -1,5 +1,5 @@
 namespace :ci do
   resource :lint, only: [:show, :create]
 
-  root to: redirect('/')
+  root to: redirect('')
 end
diff --git a/config/routes/project.rb b/config/routes/project.rb
index d05fe11f233..9f553085d50 100644
--- a/config/routes/project.rb
+++ b/config/routes/project.rb
@@ -393,7 +393,7 @@ constraints(ProjectUrlConstrainer.new) do
         end
       end
       namespace :settings do
-        get :members, to: redirect('/%{namespace_id}/%{project_id}/project_members')
+        get :members, to: redirect("%{namespace_id}/%{project_id}/project_members")
         resource :ci_cd, only: [:show], controller: 'ci_cd'
         resource :integrations, only: [:show]
         resource :repository, only: [:show], controller: :repository
diff --git a/config/routes/snippets.rb b/config/routes/snippets.rb
index 0a4ebac3ca3..81bc890d86b 100644
--- a/config/routes/snippets.rb
+++ b/config/routes/snippets.rb
@@ -17,5 +17,5 @@ resources :snippets, concerns: :awardable do
   end
 end
 
-get '/s/:username', to: redirect('/u/%{username}/snippets'),
+get '/s/:username', to: redirect('u/%{username}/snippets'),
                     constraints: { username: /[a-zA-Z.0-9_\-]+(?<!\.atom)/ }
diff --git a/config/routes/user.rb b/config/routes/user.rb
index e682dcd6663..733a3f6ce9a 100644
--- a/config/routes/user.rb
+++ b/config/routes/user.rb
@@ -22,17 +22,17 @@ scope(constraints: { username: Gitlab::PathRegex.root_namespace_route_regex }) d
     get :contributed, as: :contributed_projects
     get :snippets
     get :exists
-    get '/', to: redirect('/%{username}'), as: nil
+    get '/', to: redirect('%{username}'), as: nil
   end
 
   # Compatibility with old routing
   # TODO (dzaporozhets): remove in 10.0
-  get '/u/:username', to: redirect('/%{username}')
+  get '/u/:username', to: redirect('%{username}')
   # TODO (dzaporozhets): remove in 9.0
-  get '/u/:username/groups', to: redirect('/users/%{username}/groups')
-  get '/u/:username/projects', to: redirect('/users/%{username}/projects')
-  get '/u/:username/snippets', to: redirect('/users/%{username}/snippets')
-  get '/u/:username/contributed', to: redirect('/users/%{username}/contributed')
+  get '/u/:username/groups', to: redirect('users/%{username}/groups')
+  get '/u/:username/projects', to: redirect('users/%{username}/projects')
+  get '/u/:username/snippets', to: redirect('users/%{username}/snippets')
+  get '/u/:username/contributed', to: redirect('users/%{username}/contributed')
 end
 
 constraints(UserUrlConstrainer.new) do
-- 
cgit v1.2.1


From 306d030240b4678a94cf8bf8af11c07100abfa7c Mon Sep 17 00:00:00 2001
From: Brett Walker <bwalker@gitlab.com>
Date: Sat, 28 Oct 2017 10:49:14 +0200
Subject: more readable changelog

---
 changelogs/unreleased/39366-email-confirmation-fails.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/changelogs/unreleased/39366-email-confirmation-fails.yml b/changelogs/unreleased/39366-email-confirmation-fails.yml
index 7f6a753f8c8..a5568670c70 100644
--- a/changelogs/unreleased/39366-email-confirmation-fails.yml
+++ b/changelogs/unreleased/39366-email-confirmation-fails.yml
@@ -1,5 +1,5 @@
 ---
-title: 'Fix #39366 : E-mail confirmation fails: NoMethodError: undefined method "username"'
+title: 'Fix bug preventing secondary emails from being confirmed'
 merge_request: 15010
 author:
 type: fixed
-- 
cgit v1.2.1


From 7e60c764282c84d4acea517903705a4c4e3a61f2 Mon Sep 17 00:00:00 2001
From: Oswaldo Ferreira <oswaldo@gitlab.com>
Date: Fri, 27 Oct 2017 22:41:44 +0200
Subject: Add changelog

---
 changelogs/unreleased/make-merge-jid-handling-less-stateful.yml | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 changelogs/unreleased/make-merge-jid-handling-less-stateful.yml

diff --git a/changelogs/unreleased/make-merge-jid-handling-less-stateful.yml b/changelogs/unreleased/make-merge-jid-handling-less-stateful.yml
new file mode 100644
index 00000000000..fe945e822fd
--- /dev/null
+++ b/changelogs/unreleased/make-merge-jid-handling-less-stateful.yml
@@ -0,0 +1,5 @@
+---
+title: Fix widget of locked merge requests not being presented
+merge_request:
+author:
+type: fixed
-- 
cgit v1.2.1


From a718a59bf6fa81bbc51242267c56a4895629304c Mon Sep 17 00:00:00 2001
From: Takuya Noguchi <takninnovationresearch@gmail.com>
Date: Sun, 29 Oct 2017 21:19:40 +0900
Subject: Bump carrierwave to 1.2.1

---
 Gemfile                                                   | 2 +-
 Gemfile.lock                                              | 4 ++--
 changelogs/unreleased/39580-bump-carrierwave-to-1-2-1.yml | 5 +++++
 3 files changed, 8 insertions(+), 3 deletions(-)
 create mode 100644 changelogs/unreleased/39580-bump-carrierwave-to-1-2-1.yml

diff --git a/Gemfile b/Gemfile
index 5adba4d58df..dd9146511b8 100644
--- a/Gemfile
+++ b/Gemfile
@@ -90,7 +90,7 @@ gem 'kaminari', '~> 1.0'
 gem 'hamlit', '~> 2.6.1'
 
 # Files attachments
-gem 'carrierwave', '~> 1.1'
+gem 'carrierwave', '~> 1.2'
 
 # Drag and Drop UI
 gem 'dropzonejs-rails', '~> 0.7.1'
diff --git a/Gemfile.lock b/Gemfile.lock
index 53efb1c76c2..e4a323dde7b 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -107,7 +107,7 @@ GEM
     capybara-screenshot (1.0.14)
       capybara (>= 1.0, < 3)
       launchy
-    carrierwave (1.1.0)
+    carrierwave (1.2.1)
       activemodel (>= 4.0.0)
       activesupport (>= 4.0.0)
       mime-types (>= 1.16)
@@ -990,7 +990,7 @@ DEPENDENCIES
   bundler-audit (~> 0.5.0)
   capybara (~> 2.15.0)
   capybara-screenshot (~> 1.0.0)
-  carrierwave (~> 1.1)
+  carrierwave (~> 1.2)
   charlock_holmes (~> 0.7.5)
   chronic (~> 0.10.2)
   chronic_duration (~> 0.10.6)
diff --git a/changelogs/unreleased/39580-bump-carrierwave-to-1-2-1.yml b/changelogs/unreleased/39580-bump-carrierwave-to-1-2-1.yml
new file mode 100644
index 00000000000..bda85ac24e0
--- /dev/null
+++ b/changelogs/unreleased/39580-bump-carrierwave-to-1-2-1.yml
@@ -0,0 +1,5 @@
+---
+title: Bump carrierwave to 1.2.1
+merge_request: 15072
+author: Takuya Noguchi
+type: other
-- 
cgit v1.2.1


From 1cd0fbd96b29c0713a926fe9602eae703f77525d Mon Sep 17 00:00:00 2001
From: Takuya Noguchi <takninnovationresearch@gmail.com>
Date: Mon, 30 Oct 2017 00:24:11 +0900
Subject: Enable NestingDepth (level 6) on scss-lint

---
 .scss-lint.yml                                     |  3 ++-
 app/assets/stylesheets/framework/gitlab-theme.scss |  7 ++-----
 app/assets/stylesheets/framework/header.scss       |  6 ++----
 app/assets/stylesheets/pages/notes.scss            | 12 +-----------
 changelogs/unreleased/39582-nestingdepth-6.yml     |  5 +++++
 5 files changed, 12 insertions(+), 21 deletions(-)
 create mode 100644 changelogs/unreleased/39582-nestingdepth-6.yml

diff --git a/.scss-lint.yml b/.scss-lint.yml
index 73f8d27f78c..d2c972fa9c4 100644
--- a/.scss-lint.yml
+++ b/.scss-lint.yml
@@ -121,7 +121,8 @@ linters:
 
   # Avoid nesting selectors too deeply.
   NestingDepth:
-    enabled: false
+    enabled: true
+    max_depth: 6
 
   # Always use placeholder selectors in @extend.
   PlaceholderInExtend:
diff --git a/app/assets/stylesheets/framework/gitlab-theme.scss b/app/assets/stylesheets/framework/gitlab-theme.scss
index 52b87de7a3d..dc591c06c88 100644
--- a/app/assets/stylesheets/framework/gitlab-theme.scss
+++ b/app/assets/stylesheets/framework/gitlab-theme.scss
@@ -216,12 +216,9 @@ body {
             color: $theme-gray-900;
           }
 
-          &.active > a {
+          &.active > a,
+          &.active > a:hover {
             color: $white-light;
-
-            &:hover {
-              color: $white-light;
-            }
           }
         }
       }
diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index d79444fad79..62ba74ff582 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -239,10 +239,8 @@
             fill: currentColor;
           }
 
-          &.header-user-dropdown-toggle {
-            .header-user-avatar {
-              border-color: $white-light;
-            }
+          &.header-user-dropdown-toggle .header-user-avatar {
+            border-color: $white-light;
           }
         }
       }
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index 3bd0e3ad535..312917bd13a 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -269,7 +269,7 @@ ul.notes {
           display: none;
         }
 
-        &.system-note-commit-list {
+        &.system-note-commit-list:not(.hide-shade) {
           max-height: 70px;
           overflow: hidden;
           display: block;
@@ -291,16 +291,6 @@ ul.notes {
             bottom: 0;
             background: linear-gradient(rgba($white-light, 0.1) -100px, $white-light 100%);
           }
-
-          &.hide-shade {
-            max-height: 100%;
-            overflow: auto;
-
-            &::after {
-              display: none;
-              background: transparent;
-            }
-          }
         }
       }
     }
diff --git a/changelogs/unreleased/39582-nestingdepth-6.yml b/changelogs/unreleased/39582-nestingdepth-6.yml
new file mode 100644
index 00000000000..efe15f0a5f3
--- /dev/null
+++ b/changelogs/unreleased/39582-nestingdepth-6.yml
@@ -0,0 +1,5 @@
+---
+title: Enable NestingDepth (level 6) on scss-lint
+merge_request: 15073
+author: Takuya Noguchi
+type: other
-- 
cgit v1.2.1


From 3c454b80ef14f975ece751049e10240adce2895f Mon Sep 17 00:00:00 2001
From: Lin Jen-Shin <godfat@godfat.org>
Date: Mon, 30 Oct 2017 14:48:45 +0800
Subject: Add docs for backing up to Google Cloud Storage

---
 doc/raketasks/backup_restore.md | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/doc/raketasks/backup_restore.md b/doc/raketasks/backup_restore.md
index e4c09b2b507..2fff6ab13f1 100644
--- a/doc/raketasks/backup_restore.md
+++ b/doc/raketasks/backup_restore.md
@@ -126,6 +126,25 @@ sudo gitlab-rake gitlab:backup:create SKIP=db,uploads
 sudo -u git -H bundle exec rake gitlab:backup:create SKIP=db,uploads RAILS_ENV=production
 ```
 
+#### Using Google Cloud Storage
+
+If you want to use Google Cloud Storage to save backups, go to the storage
+settings page, select "Interoperability" and create an access key there.
+Copy "Access Key" and "Secret", fill the configurations in
+`/etc/gitlab/gitlab.rb`:
+
+```ruby
+gitlab_rails['backup_upload_connection'] = {
+  'provider' => 'Google',
+  'google_storage_access_key_id' => 'Access Key',
+  'google_storage_secret_access_key' => 'Secret'
+}
+gitlab_rails['backup_upload_remote_directory'] = 'my.google.bucket'
+```
+
+Make sure you have project and bucket setting up correctly, and run
+`sudo gitlab-ctl reconfigure` after making the changes.
+
 ### Uploading backups to a remote (cloud) storage
 
 Starting with GitLab 7.4 you can let the backup script upload the '.tar' file it creates.
-- 
cgit v1.2.1


From 7dbf114f595f8ff3ff41339d81d41b7722b97d2a Mon Sep 17 00:00:00 2001
From: Bob Van Landuyt <bob@vanlanduyt.co>
Date: Fri, 27 Oct 2017 16:09:11 +0200
Subject: Use the correct project visibility in system hooks

---
 app/services/system_hooks_service.rb                             | 2 +-
 changelogs/unreleased/bvl-fix-system-hook-project-visibility.yml | 5 +++++
 spec/services/system_hooks_service_spec.rb                       | 6 ++++++
 3 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 changelogs/unreleased/bvl-fix-system-hook-project-visibility.yml

diff --git a/app/services/system_hooks_service.rb b/app/services/system_hooks_service.rb
index a1c2f8d0180..5d275967821 100644
--- a/app/services/system_hooks_service.rb
+++ b/app/services/system_hooks_service.rb
@@ -83,7 +83,7 @@ class SystemHooksService
       project_id: model.id,
       owner_name: owner.name,
       owner_email: owner.respond_to?(:email) ? owner.email : "",
-      project_visibility: Project.visibility_levels.key(model.visibility_level_value).downcase
+      project_visibility: model.visibility.downcase
     }
   end
 
diff --git a/changelogs/unreleased/bvl-fix-system-hook-project-visibility.yml b/changelogs/unreleased/bvl-fix-system-hook-project-visibility.yml
new file mode 100644
index 00000000000..a17ed51c9b8
--- /dev/null
+++ b/changelogs/unreleased/bvl-fix-system-hook-project-visibility.yml
@@ -0,0 +1,5 @@
+---
+title: Use the correct visibility attribute for projects in system hooks
+merge_request: 15065
+author:
+type: fixed
diff --git a/spec/services/system_hooks_service_spec.rb b/spec/services/system_hooks_service_spec.rb
index 8b5d9187785..8f7aea533dc 100644
--- a/spec/services/system_hooks_service_spec.rb
+++ b/spec/services/system_hooks_service_spec.rb
@@ -63,6 +63,12 @@ describe SystemHooksService do
         :group_id, :user_id, :user_username, :user_name, :user_email, :group_access
       )
     end
+
+    it 'includes the correct project visibility level' do
+      data = event_data(project, :create)
+
+      expect(data[:project_visibility]).to eq('private')
+    end
   end
 
   context 'event names' do
-- 
cgit v1.2.1


From cd784a80d7c779edc468d6255ffdeb8ea692661a Mon Sep 17 00:00:00 2001
From: Oswaldo Ferreira <oswaldo@gitlab.com>
Date: Mon, 30 Oct 2017 09:10:09 +0000
Subject: [CE backport] Saved configuration for issue board

---
 .../javascripts/boards/filtered_search_boards.js   |   9 +-
 .../javascripts/boards/stores/boards_store.js      |   8 +-
 .../javascripts/filtered_search/dropdown_utils.js  |  10 ++
 .../filtered_search/filtered_search_manager.js     |  10 +-
 .../filtered_search_visual_tokens.js               |  15 +--
 app/assets/javascripts/labels_select.js            |  13 ++-
 app/assets/javascripts/milestone_select.js         |  17 +++-
 app/assets/javascripts/users_select.js             |   7 +-
 .../vue_shared/components/loading_icon.vue         |   8 +-
 .../vue_shared/components/popup_dialog.vue         | 101 +++++++++++++--------
 app/assets/stylesheets/framework/common.scss       |   3 +
 app/assets/stylesheets/framework/dropdowns.scss    |   1 +
 app/assets/stylesheets/framework/modal.scss        |   8 ++
 .../framework/tw_bootstrap_variables.scss          |  33 +++++++
 app/assets/stylesheets/pages/repo.scss             |  13 ---
 app/helpers/boards_helper.rb                       |  11 ---
 16 files changed, 174 insertions(+), 93 deletions(-)

diff --git a/app/assets/javascripts/boards/filtered_search_boards.js b/app/assets/javascripts/boards/filtered_search_boards.js
index 3f083655f95..184665f395c 100644
--- a/app/assets/javascripts/boards/filtered_search_boards.js
+++ b/app/assets/javascripts/boards/filtered_search_boards.js
@@ -11,7 +11,8 @@ export default class FilteredSearchBoards extends gl.FilteredSearchManager {
     // Issue boards is slightly different, we handle all the requests async
     // instead or reloading the page, we just re-fire the list ajax requests
     this.isHandledAsync = true;
-    this.cantEdit = cantEdit;
+    this.cantEdit = cantEdit.filter(i => typeof i === 'string');
+    this.cantEditWithValue = cantEdit.filter(i => typeof i === 'object');
   }
 
   updateObject(path) {
@@ -42,7 +43,9 @@ export default class FilteredSearchBoards extends gl.FilteredSearchManager {
     this.filteredSearchInput.dispatchEvent(new Event('input'));
   }
 
-  canEdit(tokenName) {
-    return this.cantEdit.indexOf(tokenName) === -1;
+  canEdit(tokenName, tokenValue) {
+    if (this.cantEdit.includes(tokenName)) return false;
+    return this.cantEditWithValue.findIndex(token => token.name === tokenName &&
+      token.value === tokenValue) === -1;
   }
 }
diff --git a/app/assets/javascripts/boards/stores/boards_store.js b/app/assets/javascripts/boards/stores/boards_store.js
index ea82958e80d..798d7e0d147 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js
+++ b/app/assets/javascripts/boards/stores/boards_store.js
@@ -14,16 +14,18 @@ gl.issueBoards.BoardsStore = {
   },
   state: {},
   detail: {
-    issue: {}
+    issue: {},
   },
   moving: {
     issue: {},
-    list: {}
+    list: {},
   },
   create () {
     this.state.lists = [];
     this.filter.path = getUrlParamsArray().join('&');
-    this.detail = { issue: {} };
+    this.detail = {
+      issue: {},
+    };
   },
   addList (listObj, defaultAvatar) {
     const list = new List(listObj, defaultAvatar);
diff --git a/app/assets/javascripts/filtered_search/dropdown_utils.js b/app/assets/javascripts/filtered_search/dropdown_utils.js
index 8d711e3213c..cf8a9b0402b 100644
--- a/app/assets/javascripts/filtered_search/dropdown_utils.js
+++ b/app/assets/javascripts/filtered_search/dropdown_utils.js
@@ -147,6 +147,16 @@ class DropdownUtils {
     return dataValue !== null;
   }
 
+  static getVisualTokenValues(visualToken) {
+    const tokenName = visualToken && visualToken.querySelector('.name').textContent.trim();
+    let tokenValue = visualToken && visualToken.querySelector('.value') && visualToken.querySelector('.value').textContent.trim();
+    if (tokenName === 'label' && tokenValue) {
+      // remove leading symbol and wrapping quotes
+      tokenValue = tokenValue.replace(/^~("|')?(.*)/, '$2').replace(/("|')$/, '');
+    }
+    return { tokenName, tokenValue };
+  }
+
   // Determines the full search query (visual tokens + input)
   static getSearchQuery(untilInput = false) {
     const container = FilteredSearchContainer.container;
diff --git a/app/assets/javascripts/filtered_search/filtered_search_manager.js b/app/assets/javascripts/filtered_search/filtered_search_manager.js
index 7b233842d5a..69c57f923b6 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_manager.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_manager.js
@@ -185,8 +185,8 @@ class FilteredSearchManager {
     if (e.keyCode === 8 || e.keyCode === 46) {
       const { lastVisualToken } = gl.FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
-      const sanitizedTokenName = lastVisualToken && lastVisualToken.querySelector('.name').textContent.trim();
-      const canEdit = sanitizedTokenName && this.canEdit && this.canEdit(sanitizedTokenName);
+      const { tokenName, tokenValue } = gl.DropdownUtils.getVisualTokenValues(lastVisualToken);
+      const canEdit = tokenName && this.canEdit && this.canEdit(tokenName, tokenValue);
       if (this.filteredSearchInput.value === '' && lastVisualToken && canEdit) {
         this.filteredSearchInput.value = gl.FilteredSearchVisualTokens.getLastTokenPartial();
         gl.FilteredSearchVisualTokens.removeLastTokenPartial();
@@ -336,8 +336,8 @@ class FilteredSearchManager {
       let canClearToken = t.classList.contains('js-visual-token');
 
       if (canClearToken) {
-        const tokenKey = t.querySelector('.name').textContent.trim();
-        canClearToken = this.canEdit && this.canEdit(tokenKey);
+        const { tokenName, tokenValue } = gl.DropdownUtils.getVisualTokenValues(t);
+        canClearToken = this.canEdit && this.canEdit(tokenName, tokenValue);
       }
 
       if (canClearToken) {
@@ -469,7 +469,7 @@ class FilteredSearchManager {
           }
 
           hasFilteredSearch = true;
-          const canEdit = this.canEdit && this.canEdit(sanitizedKey);
+          const canEdit = this.canEdit && this.canEdit(sanitizedKey, sanitizedValue);
           gl.FilteredSearchVisualTokens.addFilterVisualToken(
             sanitizedKey,
             `${symbol}${quotationsToUse}${sanitizedValue}${quotationsToUse}`,
diff --git a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
index d2f92929b8a..6139e81fe6d 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
@@ -38,21 +38,14 @@ class FilteredSearchVisualTokens {
   }
 
   static createVisualTokenElementHTML(canEdit = true) {
-    let removeTokenMarkup = '';
-    if (canEdit) {
-      removeTokenMarkup = `
-        <div class="remove-token" role="button">
-          <i class="fa fa-close"></i>
-        </div>
-      `;
-    }
-
     return `
-      <div class="selectable" role="button">
+      <div class="${canEdit ? 'selectable' : 'hidden'}" role="button">
         <div class="name"></div>
         <div class="value-container">
           <div class="value"></div>
-          ${removeTokenMarkup}
+          <div class="remove-token" role="button">
+            <i class="fa fa-close"></i>
+          </div>
         </div>
       </div>
     `;
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index 84602cf9207..1e52963b1dd 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -8,7 +8,7 @@ import CreateLabelDropdown from './create_label';
 
 (function() {
   this.LabelsSelect = (function() {
-    function LabelsSelect(els) {
+    function LabelsSelect(els, options = {}) {
       var _this, $els;
       _this = this;
 
@@ -58,6 +58,7 @@ import CreateLabelDropdown from './create_label';
           labelHTMLTemplate = _.template('<% _.each(labels, function(label){ %> <a href="<%- ["",issueURLSplit[1], issueURLSplit[2],""].join("/") %>issues?label_name[]=<%- encodeURIComponent(label.title) %>"> <span class="label has-tooltip color-label" title="<%- label.description %>" style="background-color: <%- label.color %>; color: <%- label.text_color %>;"> <%- label.title %> </span> </a> <% }); %>');
           labelNoneHTMLTemplate = '<span class="no-value">None</span>';
         }
+        const handleClick = options.handleClick;
 
         $sidebarLabelTooltip.tooltip();
 
@@ -316,9 +317,9 @@ import CreateLabelDropdown from './create_label';
           },
           multiSelect: $dropdown.hasClass('js-multiselect'),
           vue: $dropdown.hasClass('js-issue-board-sidebar'),
-          clicked: function(options) {
-            const { $el, e, isMarking } = options;
-            const label = options.selectedObj;
+          clicked: function(clickEvent) {
+            const { $el, e, isMarking } = clickEvent;
+            const label = clickEvent.selectedObj;
 
             var isIssueIndex, isMRIndex, page, boardsModel;
             var fadeOutLoader = () => {
@@ -391,6 +392,10 @@ import CreateLabelDropdown from './create_label';
                 .then(fadeOutLoader)
                 .catch(fadeOutLoader);
             }
+            else if (handleClick) {
+              e.preventDefault();
+              handleClick(label);
+            }
             else {
               if ($dropdown.hasClass('js-multiselect')) {
 
diff --git a/app/assets/javascripts/milestone_select.js b/app/assets/javascripts/milestone_select.js
index e7d5325a509..74e5a4f1cea 100644
--- a/app/assets/javascripts/milestone_select.js
+++ b/app/assets/javascripts/milestone_select.js
@@ -5,7 +5,7 @@ import _ from 'underscore';
 
 (function() {
   this.MilestoneSelect = (function() {
-    function MilestoneSelect(currentProject, els) {
+    function MilestoneSelect(currentProject, els, options = {}) {
       var _this, $els;
       if (currentProject != null) {
         _this = this;
@@ -136,19 +136,26 @@ import _ from 'underscore';
           },
           opened: function(e) {
             const $el = $(e.currentTarget);
-            if ($dropdown.hasClass('js-issue-board-sidebar')) {
+            if ($dropdown.hasClass('js-issue-board-sidebar') || options.handleClick) {
               selectedMilestone = $dropdown[0].dataset.selected || selectedMilestoneDefault;
             }
             $('a.is-active', $el).removeClass('is-active');
             $(`[data-milestone-id="${selectedMilestone}"] > a`, $el).addClass('is-active');
           },
           vue: $dropdown.hasClass('js-issue-board-sidebar'),
-          clicked: function(options) {
-            const { $el, e } = options;
-            let selected = options.selectedObj;
+          clicked: function(clickEvent) {
+            const { $el, e } = clickEvent;
+            let selected = clickEvent.selectedObj;
 
             var data, isIssueIndex, isMRIndex, isSelecting, page, boardsStore;
             if (!selected) return;
+
+            if (options.handleClick) {
+              e.preventDefault();
+              options.handleClick(selected);
+              return;
+            }
+
             page = $('body').attr('data-page');
             isIssueIndex = page === 'projects:issues:index';
             isMRIndex = (page === page && page === 'projects:merge_requests:index');
diff --git a/app/assets/javascripts/users_select.js b/app/assets/javascripts/users_select.js
index a0883b32593..759cc9925f4 100644
--- a/app/assets/javascripts/users_select.js
+++ b/app/assets/javascripts/users_select.js
@@ -6,7 +6,7 @@ import _ from 'underscore';
 // TODO: remove eventHub hack after code splitting refactor
 window.emitSidebarEvent = window.emitSidebarEvent || $.noop;
 
-function UsersSelect(currentUser, els) {
+function UsersSelect(currentUser, els, options = {}) {
   var $els;
   this.users = this.users.bind(this);
   this.user = this.user.bind(this);
@@ -20,6 +20,8 @@ function UsersSelect(currentUser, els) {
     }
   }
 
+  const { handleClick } = options;
+
   $els = $(els);
 
   if (!els) {
@@ -442,6 +444,9 @@ function UsersSelect(currentUser, els) {
           }
           if ($el.closest('.add-issues-modal').length) {
             gl.issueBoards.ModalStore.store.filter[$dropdown.data('field-name')] = user.id;
+          } else if (handleClick) {
+            e.preventDefault();
+            handleClick(user, isMarking);
           } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
             return Issuable.filterResults($dropdown.closest('form'));
           } else if ($dropdown.hasClass('js-filter-submit')) {
diff --git a/app/assets/javascripts/vue_shared/components/loading_icon.vue b/app/assets/javascripts/vue_shared/components/loading_icon.vue
index 15581d5c2a0..494fe4468d9 100644
--- a/app/assets/javascripts/vue_shared/components/loading_icon.vue
+++ b/app/assets/javascripts/vue_shared/components/loading_icon.vue
@@ -18,6 +18,12 @@
         required: false,
         default: false,
       },
+
+      class: {
+        type: String,
+        required: false,
+        default: '',
+      },
     },
 
     computed: {
@@ -25,7 +31,7 @@
         return this.inline ? 'span' : 'div';
       },
       cssClass() {
-        return `fa-${this.size}x`;
+        return `fa-${this.size}x ${this.class}`.trim();
       },
     },
   };
diff --git a/app/assets/javascripts/vue_shared/components/popup_dialog.vue b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
index 9e8c10bdc1a..fc6421fecb9 100644
--- a/app/assets/javascripts/vue_shared/components/popup_dialog.vue
+++ b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
@@ -5,17 +5,27 @@ export default {
   props: {
     title: {
       type: String,
-      required: true,
+      required: false,
     },
     text: {
       type: String,
       required: false,
     },
+    hideFooter: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
     kind: {
       type: String,
       required: false,
       default: 'primary',
     },
+    modalDialogClass: {
+      type: String,
+      required: false,
+      default: '',
+    },
     closeKind: {
       type: String,
       required: false,
@@ -30,6 +40,11 @@ export default {
       type: String,
       required: true,
     },
+    submitDisabled: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
 
   computed: {
@@ -57,43 +72,57 @@ export default {
 </script>
 
 <template>
-<div
-  class="modal popup-dialog"
-  role="dialog"
-  tabindex="-1">
-  <div class="modal-dialog" role="document">
-    <div class="modal-content">
-      <div class="modal-header">
-        <button type="button"
-          class="close"
-          @click="close"
-          aria-label="Close">
-          <span aria-hidden="true">&times;</span>
-        </button>
-        <h4 class="modal-title">{{this.title}}</h4>
-      </div>
-      <div class="modal-body">
-        <slot name="body" :text="text">
-          <p>{{text}}</p>
-        </slot>
-      </div>
-      <div class="modal-footer">
-        <button
-          type="button"
-          class="btn"
-          :class="btnCancelKindClass"
-          @click="close">
-          {{ closeButtonLabel }}
-        </button>
-        <button
-          type="button"
-          class="btn"
-          :class="btnKindClass"
-          @click="emitSubmit(true)">
-          {{ primaryButtonLabel }}
-        </button>
+<div class="modal-open">
+  <div
+    class="modal popup-dialog"
+    role="dialog"
+    tabindex="-1"
+  >
+    <div
+      :class="modalDialogClass"
+      class="modal-dialog"
+      role="document"
+    >
+      <div class="modal-content">
+        <div class="modal-header">
+          <slot name="header">
+            <h4 class="modal-title pull-left">
+              {{this.title}}
+            </h4>
+            <button
+              type="button"
+              class="close pull-right"
+              @click="close"
+              aria-label="Close"
+            >
+              <span aria-hidden="true">&times;</span>
+            </button>
+          </slot>
+        </div>
+        <div class="modal-body">
+          <slot name="body" :text="text">
+            <p>{{this.text}}</p>
+          </slot>
+        </div>
+        <div class="modal-footer" v-if="!hideFooter">
+          <button
+            type="button"
+            class="btn pull-left"
+            :class="btnCancelKindClass"
+            @click="close">
+            {{ closeButtonLabel }}
+          </button>
+          <button
+            type="button"
+            class="btn pull-right"
+            :class="btnKindClass"
+            @click="emitSubmit(true)">
+            {{ primaryButtonLabel }}
+          </button>
+        </div>
       </div>
     </div>
   </div>
+  <div class="modal-backdrop fade in" />
 </div>
 </template>
diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index 96f9dda26c4..1cfd7ef01a8 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -4,6 +4,9 @@
 .cred { color: $common-red; }
 .cgreen { color: $common-green; }
 .cdark { color: $common-gray-dark; }
+.text-secondary {
+  color: $gl-text-color-secondary;
+}
 
 /** COMMON CLASSES **/
 .prepend-top-0 { margin-top: 0; }
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index a9d804e735d..63697fd38a7 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -37,6 +37,7 @@
   .dropdown-menu-nav {
     @include set-visible;
     display: block;
+    min-height: 40px;
 
     @media (max-width: $screen-xs-max) {
       width: 100%;
diff --git a/app/assets/stylesheets/framework/modal.scss b/app/assets/stylesheets/framework/modal.scss
index 1cebd02df48..d218fb6d702 100644
--- a/app/assets/stylesheets/framework/modal.scss
+++ b/app/assets/stylesheets/framework/modal.scss
@@ -42,3 +42,11 @@ body.modal-open {
     width: 98%;
   }
 }
+
+.modal.popup-dialog {
+  display: block;
+}
+
+.modal-body {
+  background-color: $modal-body-bg;
+}
diff --git a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
index 3ea77eb7a43..a23131e0818 100644
--- a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
+++ b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
@@ -164,3 +164,36 @@ $pre-border-color: $border-color;
 $table-bg-accent: $gray-light;
 
 $zindex-popover: 900;
+
+//== Modals
+//
+//##
+
+//** Padding applied to the modal body
+$modal-inner-padding: $gl-padding;
+
+//** Padding applied to the modal title
+$modal-title-padding: $gl-padding;
+//** Modal title line-height
+// $modal-title-line-height:     $line-height-base
+
+//** Background color of modal content area
+$modal-content-bg: $gray-light;
+$modal-body-bg: $white-light;
+//** Modal content border color
+// $modal-content-border-color:                   rgba(0,0,0,.2)
+//** Modal content border color **for IE8**
+// $modal-content-fallback-border-color:          #999
+
+//** Modal backdrop background color
+// $modal-backdrop-bg:           #000
+//** Modal backdrop opacity
+// $modal-backdrop-opacity:      .5
+//** Modal header border color
+// $modal-header-border-color:   #e5e5e5
+//** Modal footer border color
+// $modal-footer-border-color:   $modal-header-border-color
+
+// $modal-lg:                    900px
+// $modal-md:                    600px
+// $modal-sm:                    300px
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index 6a363b1710e..e8c7f8a8fc0 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -7,19 +7,6 @@
   background: $black-transparent;
 }
 
-.modal.popup-dialog {
-  display: block;
-  background-color: $black-transparent;
-  z-index: 2100;
-
-  @media (min-width: $screen-md-min) {
-    .modal-dialog {
-      width: 600px;
-      margin: 30px auto;
-    }
-  }
-}
-
 .project-refs-form,
 .project-refs-target-form {
   display: inline-block;
diff --git a/app/helpers/boards_helper.rb b/app/helpers/boards_helper.rb
index 7112c6ee470..c4a621160af 100644
--- a/app/helpers/boards_helper.rb
+++ b/app/helpers/boards_helper.rb
@@ -20,17 +20,6 @@ module BoardsHelper
     project_issues_path(@project)
   end
 
-  def current_board_json
-    board = @board || @boards.first
-
-    board.to_json(
-      only: [:id, :name, :milestone_id],
-      include: {
-        milestone: { only: [:title] }
-      }
-    )
-  end
-
   def board_base_url
     project_boards_path(@project)
   end
-- 
cgit v1.2.1


From 8275e34e41cc6a6e20c2c4fbfa5dccd9c8e498b6 Mon Sep 17 00:00:00 2001
From: Zeger-Jan van de Weg <git@zjvandeweg.nl>
Date: Mon, 30 Oct 2017 10:25:28 +0100
Subject: Ci::Build tag is a trait instead of an own factory

Minor annoyance of mine, and there were a couple of things wrong, for
example:
1. Switching on a property is just a trait
2. It didn't inherrit from its parent

Find and replace through the code based fixed all occurances.
---
 spec/factories/ci/builds.rb      |  2 +-
 spec/requests/api/runner_spec.rb | 16 ++++++++--------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/spec/factories/ci/builds.rb b/spec/factories/ci/builds.rb
index c2b59239af9..cf38066dedc 100644
--- a/spec/factories/ci/builds.rb
+++ b/spec/factories/ci/builds.rb
@@ -119,7 +119,7 @@ FactoryGirl.define do
       finished_at nil
     end
 
-    factory :ci_build_tag do
+    trait :tag do
       tag true
     end
 
diff --git a/spec/requests/api/runner_spec.rb b/spec/requests/api/runner_spec.rb
index 5fd76fce7df..47f4ccd4887 100644
--- a/spec/requests/api/runner_spec.rb
+++ b/spec/requests/api/runner_spec.rb
@@ -385,7 +385,7 @@ describe API::Runner do
           end
 
           context 'when job is made for tag' do
-            let!(:job) { create(:ci_build_tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
+            let!(:job) { create(:ci_build, :tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
 
             it 'sets branch as ref_type' do
               request_job
@@ -436,8 +436,8 @@ describe API::Runner do
           end
 
           context 'when project and pipeline have multiple jobs' do
-            let!(:job) { create(:ci_build_tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
-            let!(:job2) { create(:ci_build_tag, pipeline: pipeline, name: 'rubocop', stage: 'test', stage_idx: 0) }
+            let!(:job) { create(:ci_build, :tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
+            let!(:job2) { create(:ci_build, :tag, pipeline: pipeline, name: 'rubocop', stage: 'test', stage_idx: 0) }
             let!(:test_job) { create(:ci_build, pipeline: pipeline, name: 'deploy', stage: 'deploy', stage_idx: 1) }
 
             before do
@@ -458,7 +458,7 @@ describe API::Runner do
           end
 
           context 'when pipeline have jobs with artifacts' do
-            let!(:job) { create(:ci_build_tag, :artifacts, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
+            let!(:job) { create(:ci_build, :tag, :artifacts, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
             let!(:test_job) { create(:ci_build, pipeline: pipeline, name: 'deploy', stage: 'deploy', stage_idx: 1) }
 
             before do
@@ -478,8 +478,8 @@ describe API::Runner do
           end
 
           context 'when explicit dependencies are defined' do
-            let!(:job) { create(:ci_build_tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
-            let!(:job2) { create(:ci_build_tag, pipeline: pipeline, name: 'rubocop', stage: 'test', stage_idx: 0) }
+            let!(:job) { create(:ci_build, :tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
+            let!(:job2) { create(:ci_build, :tag, pipeline: pipeline, name: 'rubocop', stage: 'test', stage_idx: 0) }
             let!(:test_job) do
               create(:ci_build, pipeline: pipeline, token: 'test-job-token', name: 'deploy',
                                 stage: 'deploy', stage_idx: 1,
@@ -502,8 +502,8 @@ describe API::Runner do
           end
 
           context 'when dependencies is an empty array' do
-            let!(:job) { create(:ci_build_tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
-            let!(:job2) { create(:ci_build_tag, pipeline: pipeline, name: 'rubocop', stage: 'test', stage_idx: 0) }
+            let!(:job) { create(:ci_build, :tag, pipeline: pipeline, name: 'spinach', stage: 'test', stage_idx: 0) }
+            let!(:job2) { create(:ci_build, :tag, pipeline: pipeline, name: 'rubocop', stage: 'test', stage_idx: 0) }
             let!(:empty_dependencies_job) do
               create(:ci_build, pipeline: pipeline, token: 'test-job-token', name: 'empty_dependencies_job',
                                 stage: 'deploy', stage_idx: 1,
-- 
cgit v1.2.1


From c4124fce48e83db603d69a83bb912ae5d0d54f65 Mon Sep 17 00:00:00 2001
From: Oswaldo Ferreira <oswaldo@gitlab.com>
Date: Mon, 30 Oct 2017 11:21:23 +0100
Subject: Move locked check to a guard-clause

---
 app/models/merge_request.rb | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/app/models/merge_request.rb b/app/models/merge_request.rb
index c952ab862d7..07352db5d2d 100644
--- a/app/models/merge_request.rb
+++ b/app/models/merge_request.rb
@@ -398,7 +398,9 @@ class MergeRequest < ActiveRecord::Base
   def merge_ongoing?
     # While the MergeRequest is locked, it should present itself as 'merge ongoing'.
     # The unlocking process is handled by StuckMergeJobsWorker scheduled in Cron.
-    locked? || !!merge_jid && !merged? && Gitlab::SidekiqStatus.running?(merge_jid)
+    return true if locked?
+
+    !!merge_jid && !merged? && Gitlab::SidekiqStatus.running?(merge_jid)
   end
 
   def closed_without_fork?
-- 
cgit v1.2.1


From 5e0308d5b920f4210f2f00da1e8f3e95f2ce1ab4 Mon Sep 17 00:00:00 2001
From: Achilleas Pipinellis <axil@gitlab.com>
Date: Mon, 30 Oct 2017 13:43:54 +0200
Subject: Split S3 and Google Cloud Storage sections in backup doc

---
 doc/raketasks/backup_restore.md | 142 +++++++++++++++++++++++++---------------
 1 file changed, 90 insertions(+), 52 deletions(-)

diff --git a/doc/raketasks/backup_restore.md b/doc/raketasks/backup_restore.md
index 2fff6ab13f1..54c3e20d61d 100644
--- a/doc/raketasks/backup_restore.md
+++ b/doc/raketasks/backup_restore.md
@@ -126,25 +126,6 @@ sudo gitlab-rake gitlab:backup:create SKIP=db,uploads
 sudo -u git -H bundle exec rake gitlab:backup:create SKIP=db,uploads RAILS_ENV=production
 ```
 
-#### Using Google Cloud Storage
-
-If you want to use Google Cloud Storage to save backups, go to the storage
-settings page, select "Interoperability" and create an access key there.
-Copy "Access Key" and "Secret", fill the configurations in
-`/etc/gitlab/gitlab.rb`:
-
-```ruby
-gitlab_rails['backup_upload_connection'] = {
-  'provider' => 'Google',
-  'google_storage_access_key_id' => 'Access Key',
-  'google_storage_secret_access_key' => 'Secret'
-}
-gitlab_rails['backup_upload_remote_directory'] = 'my.google.bucket'
-```
-
-Make sure you have project and bucket setting up correctly, and run
-`sudo gitlab-ctl reconfigure` after making the changes.
-
 ### Uploading backups to a remote (cloud) storage
 
 Starting with GitLab 7.4 you can let the backup script upload the '.tar' file it creates.
@@ -155,44 +136,54 @@ In the example below we use Amazon S3 for storage, but Fog also lets you use
 for AWS, Google, OpenStack Swift, Rackspace and Aliyun as well. A local driver is
 [also available](#uploading-to-locally-mounted-shares).
 
-For omnibus packages, add the following to `/etc/gitlab/gitlab.rb`:
+#### Using Amazon S3
 
-```ruby
-gitlab_rails['backup_upload_connection'] = {
-  'provider' => 'AWS',
-  'region' => 'eu-west-1',
-  'aws_access_key_id' => 'AKIAKIAKI',
-  'aws_secret_access_key' => 'secret123'
-  # If using an IAM Profile, don't configure aws_access_key_id & aws_secret_access_key
-  # 'use_iam_profile' => true
-}
-gitlab_rails['backup_upload_remote_directory'] = 'my.s3.bucket'
-```
+For Omnibus GitLab packages:
+
+1. Add the following to `/etc/gitlab/gitlab.rb`:
+
+    ```ruby
+    gitlab_rails['backup_upload_connection'] = {
+      'provider' => 'AWS',
+      'region' => 'eu-west-1',
+      'aws_access_key_id' => 'AKIAKIAKI',
+      'aws_secret_access_key' => 'secret123'
+      # If using an IAM Profile, don't configure aws_access_key_id & aws_secret_access_key
+      # 'use_iam_profile' => true
+    }
+    gitlab_rails['backup_upload_remote_directory'] = 'my.s3.bucket'
+    ```
+
+1. [Reconfigure GitLab] for the changes to take effect
 
-Make sure to run `sudo gitlab-ctl reconfigure` after editing `/etc/gitlab/gitlab.rb` to reflect the changes.
+---
 
 For installations from source:
 
-```yaml
-  backup:
-    # snip
-    upload:
-      # Fog storage connection settings, see http://fog.io/storage/ .
-      connection:
-        provider: AWS
-        region: eu-west-1
-        aws_access_key_id: AKIAKIAKI
-        aws_secret_access_key: 'secret123'
-        # If using an IAM Profile, leave aws_access_key_id & aws_secret_access_key empty
-        # ie. aws_access_key_id: ''
-        # use_iam_profile: 'true'
-      # The remote 'directory' to store your backups. For S3, this would be the bucket name.
-      remote_directory: 'my.s3.bucket'
-      # Turns on AWS Server-Side Encryption with Amazon S3-Managed Keys for backups, this is optional
-      # encryption: 'AES256'
-      # Specifies Amazon S3 storage class to use for backups, this is optional
-      # storage_class: 'STANDARD'
-```
+1. Edit `home/git/gitlab/config/gitlab.yml`:
+
+    ```yaml
+      backup:
+        # snip
+        upload:
+          # Fog storage connection settings, see http://fog.io/storage/ .
+          connection:
+            provider: AWS
+            region: eu-west-1
+            aws_access_key_id: AKIAKIAKI
+            aws_secret_access_key: 'secret123'
+            # If using an IAM Profile, leave aws_access_key_id & aws_secret_access_key empty
+            # ie. aws_access_key_id: ''
+            # use_iam_profile: 'true'
+          # The remote 'directory' to store your backups. For S3, this would be the bucket name.
+          remote_directory: 'my.s3.bucket'
+          # Turns on AWS Server-Side Encryption with Amazon S3-Managed Keys for backups, this is optional
+          # encryption: 'AES256'
+          # Specifies Amazon S3 storage class to use for backups, this is optional
+          # storage_class: 'STANDARD'
+    ```
+
+1. [Restart GitLab] for the changes to take effect
 
 If you are uploading your backups to S3 you will probably want to create a new
 IAM user with restricted access rights. To give the upload user access only for
@@ -245,6 +236,50 @@ with the name of your bucket:
 }
 ```
 
+#### Using Google Cloud Storage
+
+If you want to use Google Cloud Storage to save backups, you'll have to create
+an access key from the Google console first:
+
+1. Go to the storage settings page https://console.cloud.google.com/storage/settings
+1. Select "Interoperability" and create an access key
+1. Make note of the "Access Key" and "Secret" and replace them in the
+   configurations below
+1. Make sure you already have a bucket created
+
+For Omnibus GitLab packages:
+
+1. Edit `/etc/gitlab/gitlab.rb`:
+
+    ```ruby
+    gitlab_rails['backup_upload_connection'] = {
+      'provider' => 'Google',
+      'google_storage_access_key_id' => 'Access Key',
+      'google_storage_secret_access_key' => 'Secret'
+    }
+    gitlab_rails['backup_upload_remote_directory'] = 'my.google.bucket'
+    ```
+
+1. [Reconfigure GitLab] for the changes to take effect
+
+---
+
+For installations from source:
+
+1. Edit `home/git/gitlab/config/gitlab.yml`:
+
+    ```yaml
+      backup:
+        upload:
+          connection:
+            provider: 'Google'
+            google_storage_access_key_id: 'Access Key'
+            google_storage_secret_access_key: 'Secret'
+          remote_directory: 'my.google.bucket'
+    ```
+
+1. [Restart GitLab] for the changes to take effect
+
 ### Uploading to locally mounted shares
 
 You may also send backups to a mounted share (`NFS` / `CIFS` / `SMB` / etc.) by
@@ -573,3 +608,6 @@ The rake task runs this as the `gitlab` user which does not have the superuser a
 Those objects have no influence on the database backup/restore but they give this annoying warning.
 
 For more information see similar questions on postgresql issue tracker[here](http://www.postgresql.org/message-id/201110220712.30886.adrian.klaver@gmail.com) and [here](http://www.postgresql.org/message-id/2039.1177339749@sss.pgh.pa.us) as well as [stack overflow](http://stackoverflow.com/questions/4368789/error-must-be-owner-of-language-plpgsql).
+
+[reconfigure GitLab]: ../administration/restart_gitlab.md#omnibus-gitlab-reconfigure
+[restart GitLab]: ../administration/restart_gitlab.md#installations-from-source
-- 
cgit v1.2.1


From ab64a7f21bd6944d9c4e5400ecdc4a6c854788fe Mon Sep 17 00:00:00 2001
From: Pawel Chojnacki <pawel@chojnacki.ws>
Date: Mon, 30 Oct 2017 13:20:28 +0100
Subject: Update Prometheus Gem to fix problem caused by reading bad data.

---
 Gemfile      | 2 +-
 Gemfile.lock | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/Gemfile b/Gemfile
index 5adba4d58df..8c9edf5c733 100644
--- a/Gemfile
+++ b/Gemfile
@@ -281,7 +281,7 @@ group :metrics do
   gem 'influxdb', '~> 0.2', require: false
 
   # Prometheus
-  gem 'prometheus-client-mmap', '~>0.7.0.beta17'
+  gem 'prometheus-client-mmap', '~>0.7.0.beta18'
   gem 'raindrops', '~> 0.18'
 end
 
diff --git a/Gemfile.lock b/Gemfile.lock
index 53efb1c76c2..34f4e6af7e7 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -623,7 +623,7 @@ GEM
       parser
       unparser
     procto (0.0.3)
-    prometheus-client-mmap (0.7.0.beta17)
+    prometheus-client-mmap (0.7.0.beta18)
       mmap2 (~> 2.2, >= 2.2.7)
     pry (0.10.4)
       coderay (~> 1.1.0)
@@ -1106,7 +1106,7 @@ DEPENDENCIES
   pg (~> 0.18.2)
   poltergeist (~> 1.9.0)
   premailer-rails (~> 1.9.7)
-  prometheus-client-mmap (~> 0.7.0.beta17)
+  prometheus-client-mmap (~> 0.7.0.beta18)
   pry-byebug (~> 3.4.1)
   pry-rails (~> 0.3.4)
   rack-attack (~> 4.4.1)
-- 
cgit v1.2.1


From 3a844b7978eb956316c9979949ddb7669a06aca6 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Mon, 30 Oct 2017 12:23:52 +0000
Subject: Fix queried element

---
 app/assets/javascripts/importer_status.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/importer_status.js b/app/assets/javascripts/importer_status.js
index 99f229cc047..1dc70872d92 100644
--- a/app/assets/javascripts/importer_status.js
+++ b/app/assets/javascripts/importer_status.js
@@ -72,10 +72,10 @@ class ImporterStatus {
 
 // eslint-disable-next-line consistent-return
 export default function initImporterStatus() {
-  const importerStatus = $('.js-importer-status');
-  const data = importerStatus.dataset;
+  const importerStatus = document.querySelector('.js-importer-status');
 
-  if (importerStatus.length) {
+  if (importerStatus) {
+    const data = importerStatus.dataset;
     return new ImporterStatus(data.jobsImportPath, data.importPath);
   }
 }
-- 
cgit v1.2.1


From 7ba7fa5048f26373baf3524af0612e9f353488ec Mon Sep 17 00:00:00 2001
From: AlexWayfer <alex.wayfer@gmail.com>
Date: Mon, 30 Oct 2017 12:30:31 +0000
Subject: Fix 500 error for old (somewhat) MRs

---
 .../unreleased/fix-500-on-old-merge-requests.yml   |  5 +++
 lib/gitlab/diff/position.rb                        |  8 +++--
 spec/lib/gitlab/diff/position_spec.rb              | 37 ++++++++++++++++++++++
 3 files changed, 47 insertions(+), 3 deletions(-)
 create mode 100644 changelogs/unreleased/fix-500-on-old-merge-requests.yml

diff --git a/changelogs/unreleased/fix-500-on-old-merge-requests.yml b/changelogs/unreleased/fix-500-on-old-merge-requests.yml
new file mode 100644
index 00000000000..765d7466819
--- /dev/null
+++ b/changelogs/unreleased/fix-500-on-old-merge-requests.yml
@@ -0,0 +1,5 @@
+---
+title: Fix 500 errors caused by empty diffs in some discussions
+merge_request: 14945
+author: Alexander Popov
+type: fixed
diff --git a/lib/gitlab/diff/position.rb b/lib/gitlab/diff/position.rb
index bd0a9502a5e..ccfb908bcca 100644
--- a/lib/gitlab/diff/position.rb
+++ b/lib/gitlab/diff/position.rb
@@ -94,7 +94,9 @@ module Gitlab
       end
 
       def diff_file(repository)
-        @diff_file ||= begin
+        return @diff_file if defined?(@diff_file)
+
+        @diff_file = begin
           if RequestStore.active?
             key = {
               project_id: repository.project.id,
@@ -122,8 +124,8 @@ module Gitlab
 
       def find_diff_file(repository)
         return unless diff_refs.complete?
-
-        diff_refs.compare_in(repository.project).diffs(paths: paths, expanded: true).diff_files.first
+        return unless comparison = diff_refs.compare_in(repository.project)
+        comparison.diffs(paths: paths, expanded: true).diff_files.first
       end
 
       def get_formatter_class(type)
diff --git a/spec/lib/gitlab/diff/position_spec.rb b/spec/lib/gitlab/diff/position_spec.rb
index 245f24e96d4..677eb373d22 100644
--- a/spec/lib/gitlab/diff/position_spec.rb
+++ b/spec/lib/gitlab/diff/position_spec.rb
@@ -364,6 +364,43 @@ describe Gitlab::Diff::Position do
     end
   end
 
+  describe "position for a missing ref" do
+    let(:diff_refs) do
+      Gitlab::Diff::DiffRefs.new(
+        base_sha: "not_existing_sha",
+        head_sha: "existing_sha"
+      )
+    end
+
+    subject do
+      described_class.new(
+        old_path: "files/ruby/feature.rb",
+        new_path: "files/ruby/feature.rb",
+        old_line: 3,
+        new_line: nil,
+        diff_refs: diff_refs
+      )
+    end
+
+    describe "#diff_file" do
+      it "does not raise exception" do
+        expect { subject.diff_file(project.repository) }.not_to raise_error
+      end
+    end
+
+    describe "#diff_line" do
+      it "does not raise exception" do
+        expect { subject.diff_line(project.repository) }.not_to raise_error
+      end
+    end
+
+    describe "#line_code" do
+      it "does not raise exception" do
+        expect { subject.line_code(project.repository) }.not_to raise_error
+      end
+    end
+  end
+
   describe "position for a file in the initial commit" do
     let(:commit) { project.commit("1a0b36b3cdad1d2ee32457c102a8c0b7056fa863") }
 
-- 
cgit v1.2.1


From 0cf7afac4f00f6720b6fbb617211ea035bfa518e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Francisco=20Javier=20L=C3=B3pez?= <fjlopez@gitlab.com>
Date: Mon, 30 Oct 2017 12:44:28 +0000
Subject: Changed project select to use it independently and not onlt as a
 combobutton

---
 app/assets/javascripts/project_select.js           | 24 +++++++++++++---------
 .../fix-project-select-js-without-button.yml       |  5 +++++
 2 files changed, 19 insertions(+), 10 deletions(-)
 create mode 100644 changelogs/unreleased/fix-project-select-js-without-button.yml

diff --git a/app/assets/javascripts/project_select.js b/app/assets/javascripts/project_select.js
index fb01390f91c..bffc85e6315 100644
--- a/app/assets/javascripts/project_select.js
+++ b/app/assets/javascripts/project_select.js
@@ -2,13 +2,15 @@
 import Api from './api';
 import ProjectSelectComboButton from './project_select_combo_button';
 
-(function() {
-  this.ProjectSelect = (function() {
+(function () {
+  this.ProjectSelect = (function () {
     function ProjectSelect() {
       $('.ajax-project-select').each(function(i, select) {
         var placeholder;
+        const simpleFilter = $(select).data('simple-filter') || false;
         this.groupId = $(select).data('group-id');
         this.includeGroups = $(select).data('include-groups');
+        this.allProjects = $(select).data('all-projects') || false;
         this.orderBy = $(select).data('order-by') || 'id';
         this.withIssuesEnabled = $(select).data('with-issues-enabled');
         this.withMergeRequestsEnabled = $(select).data('with-merge-requests-enabled');
@@ -21,10 +23,10 @@ import ProjectSelectComboButton from './project_select_combo_button';
         $(select).select2({
           placeholder: placeholder,
           minimumInputLength: 0,
-          query: (function(_this) {
-            return function(query) {
+          query: (function (_this) {
+            return function (query) {
               var finalCallback, projectsCallback;
-              finalCallback = function(projects) {
+              finalCallback = function (projects) {
                 var data;
                 data = {
                   results: projects
@@ -32,9 +34,9 @@ import ProjectSelectComboButton from './project_select_combo_button';
                 return query.callback(data);
               };
               if (_this.includeGroups) {
-                projectsCallback = function(projects) {
+                projectsCallback = function (projects) {
                   var groupsCallback;
-                  groupsCallback = function(groups) {
+                  groupsCallback = function (groups) {
                     var data;
                     data = groups.concat(projects);
                     return finalCallback(data);
@@ -50,23 +52,25 @@ import ProjectSelectComboButton from './project_select_combo_button';
                 return Api.projects(query.term, {
                   order_by: _this.orderBy,
                   with_issues_enabled: _this.withIssuesEnabled,
-                  with_merge_requests_enabled: _this.withMergeRequestsEnabled
+                  with_merge_requests_enabled: _this.withMergeRequestsEnabled,
+                  membership: !_this.allProjects,
                 }, projectsCallback);
               }
             };
           })(this),
           id: function(project) {
+            if (simpleFilter) return project.id;
             return JSON.stringify({
               name: project.name,
               url: project.web_url,
             });
           },
-          text: function(project) {
+          text: function (project) {
             return project.name_with_namespace || project.name;
           },
           dropdownCssClass: "ajax-project-dropdown"
         });
-
+        if (simpleFilter) return select;
         return new ProjectSelectComboButton(select);
       });
     }
diff --git a/changelogs/unreleased/fix-project-select-js-without-button.yml b/changelogs/unreleased/fix-project-select-js-without-button.yml
new file mode 100644
index 00000000000..389ca2394f0
--- /dev/null
+++ b/changelogs/unreleased/fix-project-select-js-without-button.yml
@@ -0,0 +1,5 @@
+---
+title: Use project select dropdown not only as a combobutton
+merge_request: 15043
+author:
+type: fixed
-- 
cgit v1.2.1


From c06eb779a3da271103995a6d624dc28c1aea9ecc Mon Sep 17 00:00:00 2001
From: Gabriel Mazetto <brodock@gmail.com>
Date: Mon, 30 Oct 2017 14:30:41 +0100
Subject: Use the Hashed Storage compatible layer to store Attachments

---
 app/uploaders/file_uploader.rb       |  2 +-
 spec/uploaders/file_uploader_spec.rb | 52 +++++++++++++++++++++++++++---------
 2 files changed, 40 insertions(+), 14 deletions(-)

diff --git a/app/uploaders/file_uploader.rb b/app/uploaders/file_uploader.rb
index 7027ac4b5db..d4ba3a028be 100644
--- a/app/uploaders/file_uploader.rb
+++ b/app/uploaders/file_uploader.rb
@@ -30,7 +30,7 @@ class FileUploader < GitlabUploader
   #
   # Returns a String without a trailing slash
   def self.dynamic_path_segment(model)
-    File.join(CarrierWave.root, base_dir, model.full_path)
+    File.join(CarrierWave.root, base_dir, model.disk_path)
   end
 
   attr_accessor :model
diff --git a/spec/uploaders/file_uploader_spec.rb b/spec/uploaders/file_uploader_spec.rb
index 2492d56a5cf..f52b2bab05b 100644
--- a/spec/uploaders/file_uploader_spec.rb
+++ b/spec/uploaders/file_uploader_spec.rb
@@ -3,25 +3,51 @@ require 'spec_helper'
 describe FileUploader do
   let(:uploader) { described_class.new(build_stubbed(:project)) }
 
-  describe '.absolute_path' do
-    it 'returns the correct absolute path by building it dynamically' do
-      project = build_stubbed(:project)
-      upload = double(model: project, path: 'secret/foo.jpg')
+  context 'legacy storage' do
+    let(:project) { build_stubbed(:project) }
 
-      dynamic_segment = project.path_with_namespace
+    describe '.absolute_path' do
+      it 'returns the correct absolute path by building it dynamically' do
+        upload = double(model: project, path: 'secret/foo.jpg')
 
-      expect(described_class.absolute_path(upload))
-        .to end_with("#{dynamic_segment}/secret/foo.jpg")
+        dynamic_segment = project.full_path
+
+        expect(described_class.absolute_path(upload))
+          .to end_with("#{dynamic_segment}/secret/foo.jpg")
+      end
+    end
+
+    describe "#store_dir" do
+      it "stores in the namespace path" do
+        uploader = described_class.new(project)
+
+        expect(uploader.store_dir).to include(project.full_path)
+        expect(uploader.store_dir).not_to include("system")
+      end
     end
   end
 
-  describe "#store_dir" do
-    it "stores in the namespace path" do
-      project = build_stubbed(:project)
-      uploader = described_class.new(project)
+  context 'hashed storage' do
+    let(:project) { build_stubbed(:project, :hashed) }
+
+    describe '.absolute_path' do
+      it 'returns the correct absolute path by building it dynamically' do
+        upload = double(model: project, path: 'secret/foo.jpg')
+
+        dynamic_segment = project.disk_path
+
+        expect(described_class.absolute_path(upload))
+          .to end_with("#{dynamic_segment}/secret/foo.jpg")
+      end
+    end
+
+    describe "#store_dir" do
+      it "stores in the namespace path" do
+        uploader = described_class.new(project)
 
-      expect(uploader.store_dir).to include(project.path_with_namespace)
-      expect(uploader.store_dir).not_to include("system")
+        expect(uploader.store_dir).to include(project.disk_path)
+        expect(uploader.store_dir).not_to include("system")
+      end
     end
   end
 
-- 
cgit v1.2.1


From eed6408e0df243bfeb68d85071ec326abb223005 Mon Sep 17 00:00:00 2001
From: Gabriel Mazetto <brodock@gmail.com>
Date: Mon, 30 Oct 2017 14:31:10 +0100
Subject: Document existing storable objects and their status regarding Hashed
 storage

---
 doc/administration/repository_storage_types.md | 25 ++++++++++++++++++++++++-
 1 file changed, 24 insertions(+), 1 deletion(-)

diff --git a/doc/administration/repository_storage_types.md b/doc/administration/repository_storage_types.md
index fa882bbe28a..0cb2648cc1e 100644
--- a/doc/administration/repository_storage_types.md
+++ b/doc/administration/repository_storage_types.md
@@ -25,7 +25,10 @@ Any change in the URL will need to be reflected on disk (when groups / users or
 of load in big installations, and can be even worst if they are using any type of network based filesystem.
 
 Last, for GitLab Geo, this storage type means we have to synchronize the disk state, replicate renames in the correct
-order or we may end-up with wrong repository or missing data temporarily.   
+order or we may end-up with wrong repository or missing data temporarily.
+
+This pattern also exists in other objects stored in GitLab, like issue Attachments, GitLab Pages artifacts, 
+Docker Containers for the integrated Registry, etc.
 
 ## Hashed Storage
 
@@ -67,3 +70,23 @@ To migrate your existing projects to the new storage type, check the specific [r
 [ce-28283]: https://gitlab.com/gitlab-org/gitlab-ce/issues/28283
 [rake tasks]: raketasks/storage.md#migrate-existing-projects-to-hashed-storage
 [storage-paths]: repository_storage_types.md
+
+### Hashed Storage coverage
+
+We are incrementally moving every storable object in GitLab to the Hashed Storage pattern. You can check the current
+coverage status below.
+
+Not that things stored in S3 compatible endpoint, will not have the downsides mentioned earlier, if they are not
+prefixed with `#{namespace}/#{project_name}`, which is true for CI Cache and LFS Objects.
+
+| Storable Object | Legacy Storage | Hashed Storage | S3 Compatible | GitLab Version | 
+| ----------------| -------------- | -------------- | ------------- | -------------- |
+| Repository      | Yes            | Yes            | -             | 10.0           |
+| Attachments     | Yes            | Yes            | -             | 10.2           |
+| Avatars         | Yes            | No             | -             | -              | 
+| Pages           | Yes            | No             | -             | -              |
+| Docker Registry | Yes            | No             | -             | -              |
+| CI Build Logs   | No             | No             | -             | -              | 
+| CI Artifacts    | No             | No             | -             | -              | 
+| CI Cache        | No             | No             | Yes           | -              |
+| LFS Objects     | Yes            | No             | Yes (EEP)     | -              | 
-- 
cgit v1.2.1


From eddc9e41a6df94e55f9df91241a83e2ae3439c49 Mon Sep 17 00:00:00 2001
From: Sean McGivern <sean@gitlab.com>
Date: Mon, 30 Oct 2017 13:50:19 +0000
Subject: Only set Auto-Submitted header once

The emails on push feature reuses the same email object, to avoid the expensive
work of generating the email body.

This interceptor would previously set multiple values for the same header, as
that's the mail gem's default behaviour when called with the same header more
than once.

We don't want to change the emails on push service (although it's the only place
where this happens), but fixing the interceptor is just as sensible anyway.
---
 ...-only-the-first-recipient-when-using-aws-ses.yml |  5 +++++
 lib/additional_email_headers_interceptor.rb         |  6 ++----
 .../additional_email_headers_interceptor_spec.rb    | 21 +++++++++++++++++++--
 3 files changed, 26 insertions(+), 6 deletions(-)
 create mode 100644 changelogs/unreleased/39593-emails-on-push-are-sent-to-only-the-first-recipient-when-using-aws-ses.yml

diff --git a/changelogs/unreleased/39593-emails-on-push-are-sent-to-only-the-first-recipient-when-using-aws-ses.yml b/changelogs/unreleased/39593-emails-on-push-are-sent-to-only-the-first-recipient-when-using-aws-ses.yml
new file mode 100644
index 00000000000..9a7109d054e
--- /dev/null
+++ b/changelogs/unreleased/39593-emails-on-push-are-sent-to-only-the-first-recipient-when-using-aws-ses.yml
@@ -0,0 +1,5 @@
+---
+title: Only set Auto-Submitted header once for emails on push
+merge_request:
+author:
+type: fixed
diff --git a/lib/additional_email_headers_interceptor.rb b/lib/additional_email_headers_interceptor.rb
index 2358fa6bbfd..3cb1694b9f1 100644
--- a/lib/additional_email_headers_interceptor.rb
+++ b/lib/additional_email_headers_interceptor.rb
@@ -1,8 +1,6 @@
 class AdditionalEmailHeadersInterceptor
   def self.delivering_email(message)
-    message.headers(
-      'Auto-Submitted' => 'auto-generated',
-      'X-Auto-Response-Suppress' => 'All'
-    )
+    message.header['Auto-Submitted'] ||= 'auto-generated'
+    message.header['X-Auto-Response-Suppress'] ||= 'All'
   end
 end
diff --git a/spec/lib/additional_email_headers_interceptor_spec.rb b/spec/lib/additional_email_headers_interceptor_spec.rb
index 580450eef1e..b5c1a360ba9 100644
--- a/spec/lib/additional_email_headers_interceptor_spec.rb
+++ b/spec/lib/additional_email_headers_interceptor_spec.rb
@@ -1,12 +1,29 @@
 require 'spec_helper'
 
 describe AdditionalEmailHeadersInterceptor do
-  it 'adds Auto-Submitted header' do
-    mail = ActionMailer::Base.mail(to: 'test@mail.com', from: 'info@mail.com', body: 'hello').deliver
+  let(:mail) do
+    ActionMailer::Base.mail(to: 'test@mail.com', from: 'info@mail.com', body: 'hello')
+  end
+
+  before do
+    mail.deliver_now
+  end
 
+  it 'adds Auto-Submitted header' do
     expect(mail.header['To'].value).to eq('test@mail.com')
     expect(mail.header['From'].value).to eq('info@mail.com')
     expect(mail.header['Auto-Submitted'].value).to eq('auto-generated')
     expect(mail.header['X-Auto-Response-Suppress'].value).to eq('All')
   end
+
+  context 'when the same mail object is sent twice' do
+    before do
+      mail.deliver_now
+    end
+
+    it 'does not add the Auto-Submitted header twice' do
+      expect(mail.header['Auto-Submitted'].value).to eq('auto-generated')
+      expect(mail.header['X-Auto-Response-Suppress'].value).to eq('All')
+    end
+  end
 end
-- 
cgit v1.2.1


From 95fa62701c9e0f0c927b61852675ffc1493dfb34 Mon Sep 17 00:00:00 2001
From: Gabriel Mazetto <brodock@gmail.com>
Date: Mon, 30 Oct 2017 14:53:03 +0100
Subject: Changelog

---
 changelogs/unreleased/3674-hashed-storage-attachments.yml | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 changelogs/unreleased/3674-hashed-storage-attachments.yml

diff --git a/changelogs/unreleased/3674-hashed-storage-attachments.yml b/changelogs/unreleased/3674-hashed-storage-attachments.yml
new file mode 100644
index 00000000000..41bdb5fa568
--- /dev/null
+++ b/changelogs/unreleased/3674-hashed-storage-attachments.yml
@@ -0,0 +1,5 @@
+---
+title: Hashed Storage support for Attachments
+merge_request: 15068
+author:
+type: added
-- 
cgit v1.2.1


From 5c75d750cf3b86e7e61df89b4b0efef1207829e0 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Mon, 30 Oct 2017 14:36:24 +0000
Subject: addressed feedback from review spec fixes

---
 .../repo/components/new_dropdown/index.vue         |  7 ++++++
 .../repo/components/new_dropdown/modal.vue         | 21 ++++++----------
 app/assets/javascripts/repo/components/repo.vue    | 15 +++++-------
 .../repo/components/repo_commit_section.vue        |  2 ++
 .../javascripts/repo/components/repo_editor.vue    |  7 +++++-
 .../javascripts/repo/components/repo_file.vue      |  4 ++--
 .../repo/components/repo_loading_file.vue          |  4 ++--
 .../repo/components/repo_prev_directory.vue        |  4 ++--
 .../javascripts/repo/components/repo_preview.vue   |  5 +++-
 .../javascripts/repo/components/repo_sidebar.vue   |  6 ++---
 app/assets/javascripts/repo/stores/actions.js      |  7 ++++--
 app/assets/javascripts/repo/stores/getters.js      | 13 +++++-----
 app/assets/javascripts/repo/stores/state.js        | 28 +++++++++++-----------
 app/views/projects/tree/_tree_header.html.haml     |  2 +-
 spec/features/projects/tree/create_file_spec.rb    |  2 +-
 .../repo/components/repo_edit_button_spec.js       | 11 ++++++---
 spec/javascripts/repo/components/repo_file_spec.js | 12 +++++-----
 spec/javascripts/repo/components/repo_tab_spec.js  | 14 ++++++-----
 spec/javascripts/repo/components/repo_tabs_spec.js |  3 ++-
 19 files changed, 93 insertions(+), 74 deletions(-)

diff --git a/app/assets/javascripts/repo/components/new_dropdown/index.vue b/app/assets/javascripts/repo/components/new_dropdown/index.vue
index 53baa02c344..5e93ce7bc0f 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/index.vue
@@ -1,4 +1,5 @@
 <script>
+  import { mapState } from 'vuex';
   import newModal from './modal.vue';
 
   export default {
@@ -11,6 +12,11 @@
         modalType: '',
       };
     },
+    computed: {
+      ...mapState([
+        'path',
+      ]),
+    },
     methods: {
       createNewItem(type) {
         this.modalType = type;
@@ -64,6 +70,7 @@
     <new-modal
       v-if="openModal"
       :type="modalType"
+      :path="path"
       @toggle="toggleModalOpen"
     />
   </div>
diff --git a/app/assets/javascripts/repo/components/new_dropdown/modal.vue b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
index bb22dc4caa9..e780b88b04c 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/modal.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
@@ -9,10 +9,14 @@
         type: String,
         required: true,
       },
+      path: {
+        type: String,
+        required: true,
+      },
     },
     data() {
       return {
-        entryName: '',
+        entryName: this.path !== '' ? `${this.path}/` : '',
       };
     },
     components: {
@@ -24,7 +28,7 @@
       ]),
       createEntryInStore() {
         this.createTempEntry({
-          name: this.entryName,
+          name: this.entryName.replace(new RegExp(`^${this.path}\/`), ''),
           type: this.type,
         });
 
@@ -35,17 +39,6 @@
       },
     },
     computed: {
-      ...mapState([
-        'path',
-      ]),
-      name: {
-        get() {
-          return this.path !== '' ? `${this.path}/${this.entryName}` : this.entryName;
-        },
-        set(newVal) {
-          this.entryName = newVal.replace(`${this.path}/`, '');
-        },
-      },
       modalTitle() {
         if (this.type === 'tree') {
           return __('Create new directory');
@@ -95,7 +88,7 @@
           <input
             type="text"
             class="form-control"
-            v-model="name"
+            v-model="entryName"
             ref="fieldName"
           />
         </div>
diff --git a/app/assets/javascripts/repo/components/repo.vue b/app/assets/javascripts/repo/components/repo.vue
index 31a88b297c0..1f0e168c777 100644
--- a/app/assets/javascripts/repo/components/repo.vue
+++ b/app/assets/javascripts/repo/components/repo.vue
@@ -13,7 +13,7 @@ export default {
       'currentBlobView',
     ]),
     ...mapGetters([
-      'isMini',
+      'isCollapsed',
       'changedFiles',
     ]),
   },
@@ -26,15 +26,12 @@ export default {
     RepoPreview,
   },
   mounted() {
+    const alertMessage = 'Are you sure you want to lose unsaved changes?';
     window.onbeforeunload = (e) => {
-      const event = e || window.event;
-
       if (!this.changedFiles.length) return undefined;
 
-      if (event) event.returnValue = 'Are you sure you want to lose unsaved changes?';
-
-      // For Safari
-      return 'Are you sure you want to lose unsaved changes?';
+      e.returnValue = alertMessage;
+      return alertMessage;
     };
   },
 };
@@ -42,10 +39,10 @@ export default {
 
 <template>
   <div class="repository-view">
-    <div class="tree-content-holder" :class="{'tree-content-holder-mini' : isMini}">
+    <div class="tree-content-holder" :class="{'tree-content-holder-mini' : isCollapsed}">
       <repo-sidebar/>
       <div
-        v-if="isMini"
+        v-if="isCollapsed"
         class="panel-right"
       >
         <repo-tabs/>
diff --git a/app/assets/javascripts/repo/components/repo_commit_section.vue b/app/assets/javascripts/repo/components/repo_commit_section.vue
index 37fc35f35c9..fb613e8af9d 100644
--- a/app/assets/javascripts/repo/components/repo_commit_section.vue
+++ b/app/assets/javascripts/repo/components/repo_commit_section.vue
@@ -33,6 +33,7 @@ export default {
     ...mapActions([
       'checkCommitStatus',
       'commitChanges',
+      'getTreeData',
     ]),
     makeCommit(newBranch = false) {
       const createNewBranch = newBranch || this.startNewMR;
@@ -54,6 +55,7 @@ export default {
       this.commitChanges({ payload, newMr: this.startNewMR })
         .then(() => {
           this.submitCommitsLoading = false;
+          this.getTreeData();
         })
         .catch(() => {
           this.submitCommitsLoading = false;
diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue
index 6e9669403f2..0d6729bb99b 100644
--- a/app/assets/javascripts/repo/components/repo_editor.vue
+++ b/app/assets/javascripts/repo/components/repo_editor.vue
@@ -92,5 +92,10 @@ export default {
 </script>
 
 <template>
-  <div id="ide" v-if='!shouldHideEditor' class="blob-viewer-container blob-editor-container"></div>
+  <div
+    id="ide"
+    v-if='!shouldHideEditor'
+    class="blob-viewer-container blob-editor-container"
+  >
+  </div>
 </template>
diff --git a/app/assets/javascripts/repo/components/repo_file.vue b/app/assets/javascripts/repo/components/repo_file.vue
index 77895174f15..7a23154b340 100644
--- a/app/assets/javascripts/repo/components/repo_file.vue
+++ b/app/assets/javascripts/repo/components/repo_file.vue
@@ -14,7 +14,7 @@
     },
     computed: {
       ...mapGetters([
-        'isMini',
+        'isCollapsed',
       ]),
       fileIcon() {
         return {
@@ -71,7 +71,7 @@
       </template>
     </td>
 
-    <template v-if="!isMini">
+    <template v-if="!isCollapsed">
       <td class="hidden-sm hidden-xs">
         <a
           @click.stop
diff --git a/app/assets/javascripts/repo/components/repo_loading_file.vue b/app/assets/javascripts/repo/components/repo_loading_file.vue
index 51a2aade464..1e6c405f292 100644
--- a/app/assets/javascripts/repo/components/repo_loading_file.vue
+++ b/app/assets/javascripts/repo/components/repo_loading_file.vue
@@ -4,7 +4,7 @@
   export default {
     computed: {
       ...mapGetters([
-        'isMini',
+        'isCollapsed',
       ]),
     },
     methods: {
@@ -30,7 +30,7 @@
         </div>
       </div>
     </td>
-    <template v-if="!isMini">
+    <template v-if="!isCollapsed">
       <td
         class="hidden-sm hidden-xs">
         <div class="animation-container">
diff --git a/app/assets/javascripts/repo/components/repo_prev_directory.vue b/app/assets/javascripts/repo/components/repo_prev_directory.vue
index 3c623dd8020..a2b305bbd05 100644
--- a/app/assets/javascripts/repo/components/repo_prev_directory.vue
+++ b/app/assets/javascripts/repo/components/repo_prev_directory.vue
@@ -7,10 +7,10 @@
         'parentTreeUrl',
       ]),
       ...mapGetters([
-        'isMini',
+        'isCollapsed',
       ]),
       colSpanCondition() {
-        return this.isMini ? undefined : 3;
+        return this.isCollapsed ? undefined : 3;
       },
     },
     methods: {
diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index bbe5c667254..b189a603c57 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -7,6 +7,9 @@ export default {
     ...mapGetters([
       'activeFile',
     ]),
+    renderErrorTooLarge() {
+      return this.activeFile.renderError == 'too_large';
+    },
   },
   methods: {
     highlightFile() {
@@ -35,7 +38,7 @@ export default {
     v-html="activeFile.html">
   </div>
   <div
-    v-else-if="activeFile.renderError == 'too_large'"
+    v-else-if="renderErrorTooLarge"
     class="vertical-center render-error">
     <p class="text-center">
       The source could not be displayed because it is too large. You can <a :href="activeFile.rawPath" download>download</a> it instead.
diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue
index 34eaa26cf72..63c0d70f5c0 100644
--- a/app/assets/javascripts/repo/components/repo_sidebar.vue
+++ b/app/assets/javascripts/repo/components/repo_sidebar.vue
@@ -31,7 +31,7 @@ export default {
     }),
     ...mapGetters([
       'treeList',
-      'isMini',
+      'isCollapsed',
     ]),
   },
   methods: {
@@ -44,12 +44,12 @@ export default {
 </script>
 
 <template>
-<div id="sidebar" :class="{'sidebar-mini' : isMini}">
+<div id="sidebar" :class="{'sidebar-mini' : isCollapsed}">
   <table class="table">
     <thead>
       <tr>
         <th
-          v-if="isMini"
+          v-if="isCollapsed"
           class="repo-file-options title"
         >
           <strong class="clgray">
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index d5dc57e331b..008de3d8315 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -2,6 +2,9 @@ import Vue from 'vue';
 import flash from '../../flash';
 import service from '../services';
 import * as types from './mutation_types';
+import {
+  pushState,
+} from './utils';
 
 export const redirectToUrl = url => gl.utils.visitUrl(url);
 
@@ -67,6 +70,7 @@ export const checkCommitStatus = ({ state }) => service.getBranchData(
 export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =>
   service.commit(state.project.id, payload)
   .then((data) => {
+    const { branch } = payload;
     if (!data.short_id) {
       flash(data.message);
       return;
@@ -75,9 +79,8 @@ export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =
     flash(`Your changes have been committed. Commit ${data.short_id} with ${data.stats.additions} additions, ${data.stats.deletions} deletions.`, 'notice');
 
     if (newMr) {
-      redirectToUrl(`${state.endpoints.newMergeRequestUrl}${payload.branch}`);
+      redirectToUrl(`${state.endpoints.newMergeRequestUrl}${branch}`);
     } else {
-      // TODO: push a new state with the branch name
       commit(types.SET_COMMIT_REF, data.id);
       dispatch('discardAllChanges');
       dispatch('closeAllFiles');
diff --git a/app/assets/javascripts/repo/stores/getters.js b/app/assets/javascripts/repo/stores/getters.js
index 9122578cc79..1ed05ac6e35 100644
--- a/app/assets/javascripts/repo/stores/getters.js
+++ b/app/assets/javascripts/repo/stores/getters.js
@@ -1,5 +1,10 @@
 import _ from 'underscore';
 
+/*
+  Takes the multi-dimensional tree and returns a flattened array.
+  This allows for the table to recursively render the table rows but keeps the data
+  structure nested to make it easier to add new files/directories.
+*/
 export const treeList = (state) => {
   const mapTree = arr => (!arr.tree.length ? [] : _.map(arr.tree, a => [a, mapTree(a)]));
 
@@ -9,11 +14,7 @@ export const treeList = (state) => {
     .value();
 };
 
-export const changedFiles = (state) => {
-  const files = state.openFiles;
-
-  return files.filter(file => file.changed);
-};
+export const changedFiles = state => state.openFiles.filter(file => file.changed);
 
 export const activeFile = state => state.openFiles.find(file => file.active);
 
@@ -22,7 +23,7 @@ export const activeFileExtension = (state) => {
   return file ? `.${file.path.split('.').pop()}` : '';
 };
 
-export const isMini = state => !!state.openFiles.length;
+export const isCollapsed = state => !!state.openFiles.length;
 
 export const canEditFile = (state) => {
   const currentActiveFile = activeFile(state);
diff --git a/app/assets/javascripts/repo/stores/state.js b/app/assets/javascripts/repo/stores/state.js
index 1301350c627..aab74754f02 100644
--- a/app/assets/javascripts/repo/stores/state.js
+++ b/app/assets/javascripts/repo/stores/state.js
@@ -1,23 +1,23 @@
 export default () => ({
-  project: {
-    id: 0,
-    name: '',
-    url: '',
-  },
-  endpoints: {},
-  isRoot: false,
-  isInitialRoot: false,
+  canCommit: false,
   currentBranch: '',
+  currentBlobView: 'repo-preview',
   currentRef: '',
-  path: '',
-  canCommit: false,
-  onTopOfBranch: false,
+  discardPopupOpen: false,
   editMode: false,
+  endpoints: {},
+  isRoot: false,
+  isInitialRoot: false,
   loading: false,
-  currentBlobView: 'repo-preview',
-  discardPopupOpen: false,
-  tree: [],
+  onTopOfBranch: false,
   openFiles: [],
+  path: '',
+  project: {
+    id: 0,
+    name: '',
+    url: '',
+  },
   parentTreeUrl: '',
   previousUrl: '',
+  tree: [],
 });
diff --git a/app/views/projects/tree/_tree_header.html.haml b/app/views/projects/tree/_tree_header.html.haml
index 40266047bad..c02f7ee37ed 100644
--- a/app/views/projects/tree/_tree_header.html.haml
+++ b/app/views/projects/tree/_tree_header.html.haml
@@ -2,7 +2,7 @@
   .tree-ref-holder
     = render 'shared/ref_switcher', destination: 'tree', path: @path, show_create: true
 
-  - if show_new_repo?
+  - if show_new_repo? && can_push_branch?(@project, @ref)
     .js-new-dropdown
   - else
     = render 'projects/tree/old_tree_header'
diff --git a/spec/features/projects/tree/create_file_spec.rb b/spec/features/projects/tree/create_file_spec.rb
index a67ec891e7c..f75122abad3 100644
--- a/spec/features/projects/tree/create_file_spec.rb
+++ b/spec/features/projects/tree/create_file_spec.rb
@@ -28,7 +28,7 @@ feature 'Multi-file editor new file', :js do
       click_button('Create file')
     end
 
-    find('.inputarea').send_keys('file content')
+    find('.inputarea', visible: false).send_keys('file content')
 
     fill_in('commit-message', with: 'commit message')
 
diff --git a/spec/javascripts/repo/components/repo_edit_button_spec.js b/spec/javascripts/repo/components/repo_edit_button_spec.js
index aee2dd6ad55..44018464b35 100644
--- a/spec/javascripts/repo/components/repo_edit_button_spec.js
+++ b/spec/javascripts/repo/components/repo_edit_button_spec.js
@@ -15,7 +15,6 @@ describe('RepoEditButton', () => {
     });
 
     f.active = true;
-    f.changed = true;
     vm.$store.dispatch('setInitialData', {
       canCommit: true,
       onTopOfBranch: true,
@@ -45,17 +44,23 @@ describe('RepoEditButton', () => {
     expect(vm.$el.querySelector('.btn').textContent.trim()).toBe('Cancel edit');
   });
 
-  it('toggles edit mode on click', () => {
+  it('toggles edit mode on click', (done) => {
     vm.$mount();
 
     vm.$el.querySelector('.btn').click();
 
-    expect(vm.$el.querySelector('.btn').textContent.trim()).toBe('Cancel edit');
+    vm.$nextTick(() => {
+      expect(vm.$el.querySelector('.btn').textContent.trim()).toBe('Cancel edit');
+
+      done();
+    });
   });
 
   describe('discardPopupOpen', () => {
     beforeEach(() => {
       vm.$store.state.discardPopupOpen = true;
+      vm.$store.state.editMode = true;
+      vm.$store.state.openFiles[0].changed = true;
 
       vm.$mount();
     });
diff --git a/spec/javascripts/repo/components/repo_file_spec.js b/spec/javascripts/repo/components/repo_file_spec.js
index 18ae461128e..c45f8a18d1f 100644
--- a/spec/javascripts/repo/components/repo_file_spec.js
+++ b/spec/javascripts/repo/components/repo_file_spec.js
@@ -5,6 +5,7 @@ import { file, resetStore } from '../helpers';
 
 describe('RepoFile', () => {
   const updated = 'updated';
+  let vm;
 
   function createComponent(propsData) {
     const RepoFile = Vue.extend(repoFile);
@@ -21,7 +22,7 @@ describe('RepoFile', () => {
 
   it('renders link, icon, name and last commit details', () => {
     const RepoFile = Vue.extend(repoFile);
-    const vm = new RepoFile({
+    vm = new RepoFile({
       store,
       propsData: {
         file: file(),
@@ -43,7 +44,7 @@ describe('RepoFile', () => {
   });
 
   it('does render if hasFiles is true and is loading tree', () => {
-    const vm = createComponent({
+    vm = createComponent({
       file: file(),
     });
 
@@ -53,7 +54,7 @@ describe('RepoFile', () => {
   it('renders a spinner if the file is loading', () => {
     const f = file();
     f.loading = true;
-    const vm = createComponent({
+    vm = createComponent({
       file: f,
     });
 
@@ -62,7 +63,7 @@ describe('RepoFile', () => {
   });
 
   it('does not render commit message and datetime if mini', (done) => {
-    const vm = createComponent({
+    vm = createComponent({
       file: file(),
     });
     vm.$store.state.openFiles.push(vm.file);
@@ -76,7 +77,7 @@ describe('RepoFile', () => {
   });
 
   it('fires clickedTreeRow when the link is clicked', () => {
-    const vm = createComponent({
+    vm = createComponent({
       file: file(),
     });
 
@@ -89,7 +90,6 @@ describe('RepoFile', () => {
 
   describe('submodule', () => {
     let f;
-    let vm;
 
     beforeEach(() => {
       f = file('submodule name', '123456789');
diff --git a/spec/javascripts/repo/components/repo_tab_spec.js b/spec/javascripts/repo/components/repo_tab_spec.js
index 0d1c22a2f89..df0ca55aafc 100644
--- a/spec/javascripts/repo/components/repo_tab_spec.js
+++ b/spec/javascripts/repo/components/repo_tab_spec.js
@@ -4,6 +4,8 @@ import repoTab from '~/repo/components/repo_tab.vue';
 import { file, resetStore } from '../helpers';
 
 describe('RepoTab', () => {
+  let vm;
+
   function createComponent(propsData) {
     const RepoTab = Vue.extend(repoTab);
 
@@ -18,7 +20,7 @@ describe('RepoTab', () => {
   });
 
   it('renders a close link and a name link', () => {
-    const vm = createComponent({
+    vm = createComponent({
       tab: file(),
     });
     vm.$store.state.openFiles.push(vm.tab);
@@ -30,7 +32,7 @@ describe('RepoTab', () => {
   });
 
   it('calls setFileActive when clicking tab', () => {
-    const vm = createComponent({
+    vm = createComponent({
       tab: file(),
     });
 
@@ -42,7 +44,7 @@ describe('RepoTab', () => {
   });
 
   it('calls closeFile when clicking close button', () => {
-    const vm = createComponent({
+    vm = createComponent({
       tab: file(),
     });
 
@@ -56,7 +58,7 @@ describe('RepoTab', () => {
   it('renders an fa-circle icon if tab is changed', () => {
     const tab = file();
     tab.changed = true;
-    const vm = createComponent({
+    vm = createComponent({
       tab,
     });
 
@@ -69,7 +71,7 @@ describe('RepoTab', () => {
         const tab = file();
         tab.changed = true;
         tab.opened = true;
-        const vm = createComponent({
+        vm = createComponent({
           tab,
         });
         vm.$store.state.openFiles.push(tab);
@@ -87,7 +89,7 @@ describe('RepoTab', () => {
       it('closes tab when clicking close btn', (done) => {
         const tab = file('lose');
         tab.opened = true;
-        const vm = createComponent({
+        vm = createComponent({
           tab,
         });
         vm.$store.state.openFiles.push(tab);
diff --git a/spec/javascripts/repo/components/repo_tabs_spec.js b/spec/javascripts/repo/components/repo_tabs_spec.js
index 73ecdab6967..d0246cc72e6 100644
--- a/spec/javascripts/repo/components/repo_tabs_spec.js
+++ b/spec/javascripts/repo/components/repo_tabs_spec.js
@@ -5,6 +5,7 @@ import { file, resetStore } from '../helpers';
 
 describe('RepoTabs', () => {
   const openedFiles = [file(), file()];
+  let vm;
 
   function createComponent() {
     const RepoTabs = Vue.extend(repoTabs);
@@ -19,7 +20,7 @@ describe('RepoTabs', () => {
   });
 
   it('renders a list of tabs', (done) => {
-    const vm = createComponent();
+    vm = createComponent();
     openedFiles[0].active = true;
     vm.$store.state.openFiles = openedFiles;
 
-- 
cgit v1.2.1


From d7942f223cd30c28933c65bb8efa0cb9277b808e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Coutable?= <remy@rymai.me>
Date: Mon, 30 Oct 2017 15:01:37 +0100
Subject: Allow to disable the Performance Bar and document the `p b` shortcut
 in its doc page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Rémy Coutable <remy@rymai.me>
---
 app/models/application_setting.rb                  |  2 +-
 ...ppears-enabled-even-though-it-won-t-show-up.yml |  5 +++++
 .../monitoring/performance/performance_bar.md      |  6 ++++++
 doc/workflow/shortcuts.md                          |  2 +-
 spec/features/admin/admin_settings_spec.rb         | 23 ++++++++++++++++++++++
 5 files changed, 36 insertions(+), 2 deletions(-)
 create mode 100644 changelogs/unreleased/39570-performance-bar-appears-enabled-even-though-it-won-t-show-up.yml

diff --git a/app/models/application_setting.rb b/app/models/application_setting.rb
index f266e7db6da..5e16badabec 100644
--- a/app/models/application_setting.rb
+++ b/app/models/application_setting.rb
@@ -420,7 +420,7 @@ class ApplicationSetting < ActiveRecord::Base
   #   the enabling/disabling is `performance_bar_allowed_group_id`
   # - If `enable` is false, we set `performance_bar_allowed_group_id` to `nil`
   def performance_bar_enabled=(enable)
-    return if enable
+    return if Gitlab::Utils.to_boolean(enable)
 
     self.performance_bar_allowed_group_id = nil
   end
diff --git a/changelogs/unreleased/39570-performance-bar-appears-enabled-even-though-it-won-t-show-up.yml b/changelogs/unreleased/39570-performance-bar-appears-enabled-even-though-it-won-t-show-up.yml
new file mode 100644
index 00000000000..66939d89d69
--- /dev/null
+++ b/changelogs/unreleased/39570-performance-bar-appears-enabled-even-though-it-won-t-show-up.yml
@@ -0,0 +1,5 @@
+---
+title: Allow to disable the Performance Bar
+merge_request: 15084
+author:
+type: fixed
diff --git a/doc/administration/monitoring/performance/performance_bar.md b/doc/administration/monitoring/performance/performance_bar.md
index 68efe0aae5c..b9464945cea 100644
--- a/doc/administration/monitoring/performance/performance_bar.md
+++ b/doc/administration/monitoring/performance/performance_bar.md
@@ -28,6 +28,12 @@ will be allowed to display the Performance Bar.
 Make sure _Enable the Performance Bar_ is checked and hit
 **Save** to save the changes.
 
+Once the Performance Bar is enabled, you will need to press the [<kbd>p</kbd> +
+<kbd>b</kbd> keyboard shortcut](../../../workflow/shortcuts.md) to actually
+display it.
+
+You can toggle the Bar using the same shortcut.
+
 ---
 
 ![GitLab Performance Bar Admin Settings](img/performance_bar_configuration_settings.png)
diff --git a/doc/workflow/shortcuts.md b/doc/workflow/shortcuts.md
index 87416008e98..2e1bd6bfe5c 100644
--- a/doc/workflow/shortcuts.md
+++ b/doc/workflow/shortcuts.md
@@ -9,7 +9,7 @@ You can see GitLab's keyboard shortcuts by using 'shift + ?'
 | <kbd>n</kbd> | Main navigation |
 | <kbd>s</kbd> | Focus search |
 | <kbd>f</kbd> | Focus filter |
-| <kbd>p b</kbd> | Show/hide the Performance Bar |
+| <kbd>p</kbd> + <kbd>b</kbd> | Show/hide the Performance Bar |
 | <kbd>?</kbd> | Show/hide this dialog |
 | <kbd>⌘</kbd> + <kbd>shift</kbd> + <kbd>p</kbd> | Toggle markdown preview |
 | <kbd>↑</kbd> | Edit last comment (when focused on an empty textarea) |
diff --git a/spec/features/admin/admin_settings_spec.rb b/spec/features/admin/admin_settings_spec.rb
index c490dce7ab0..85561511101 100644
--- a/spec/features/admin/admin_settings_spec.rb
+++ b/spec/features/admin/admin_settings_spec.rb
@@ -95,6 +95,29 @@ feature 'Admin updates settings' do
     expect(find_field('ED25519 SSH keys').value).to eq(forbidden)
   end
 
+  scenario 'Change Performance Bar settings' do
+    group = create(:group)
+
+    check 'Enable the Performance Bar'
+    fill_in 'Allowed group', with: group.path
+
+    click_on 'Save'
+
+    expect(page).to have_content 'Application settings saved successfully'
+
+    expect(find_field('Enable the Performance Bar')).to be_checked
+    expect(find_field('Allowed group').value).to eq group.path
+
+    uncheck 'Enable the Performance Bar'
+
+    click_on 'Save'
+
+    expect(page).to have_content 'Application settings saved successfully'
+
+    expect(find_field('Enable the Performance Bar')).not_to be_checked
+    expect(find_field('Allowed group').value).to be_nil
+  end
+
   def check_all_events
     page.check('Active')
     page.check('Push')
-- 
cgit v1.2.1


From 4d70f42055d4393d11ab19d50d504dd5e897789e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Coutable?= <remy@rymai.me>
Date: Mon, 30 Oct 2017 15:37:02 +0100
Subject: Add .gitlab/route-map.yml
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Rémy Coutable <remy@rymai.me>
---
 .gitlab/route-map.yml | 3 +++
 1 file changed, 3 insertions(+)
 create mode 100644 .gitlab/route-map.yml

diff --git a/.gitlab/route-map.yml b/.gitlab/route-map.yml
new file mode 100644
index 00000000000..0b37dc68f8b
--- /dev/null
+++ b/.gitlab/route-map.yml
@@ -0,0 +1,3 @@
+# Documentation
+- source: /doc/(.+?)\.md/ # doc/administration/build_artifacts.md
+  public: '\1.html' # doc/administration/build_artifacts.html
-- 
cgit v1.2.1


From e80f056712be9013262981ad1bfb1978f7ffbbde Mon Sep 17 00:00:00 2001
From: Rob Ede <robjtede@icloud.com>
Date: Mon, 30 Oct 2017 16:20:29 +0000
Subject: Refresh open Issue and Merge Request project counter caches when
 re-opening

---
 app/services/issues/reopen_service.rb                    | 1 +
 app/services/merge_requests/reopen_service.rb            | 1 +
 changelogs/unreleased/39583-reopen-issue-count-cache.yml | 5 +++++
 3 files changed, 7 insertions(+)
 create mode 100644 changelogs/unreleased/39583-reopen-issue-count-cache.yml

diff --git a/app/services/issues/reopen_service.rb b/app/services/issues/reopen_service.rb
index 35de4337b15..62b4b4b6a1e 100644
--- a/app/services/issues/reopen_service.rb
+++ b/app/services/issues/reopen_service.rb
@@ -9,6 +9,7 @@ module Issues
         notification_service.reopen_issue(issue, current_user)
         execute_hooks(issue, 'reopen')
         invalidate_cache_counts(issue, users: issue.assignees)
+        issue.update_project_counter_caches
       end
 
       issue
diff --git a/app/services/merge_requests/reopen_service.rb b/app/services/merge_requests/reopen_service.rb
index b9c65be36ec..c599a90f9fe 100644
--- a/app/services/merge_requests/reopen_service.rb
+++ b/app/services/merge_requests/reopen_service.rb
@@ -11,6 +11,7 @@ module MergeRequests
         merge_request.reload_diff(current_user)
         merge_request.mark_as_unchecked
         invalidate_cache_counts(merge_request, users: merge_request.assignees)
+        merge_request.update_project_counter_caches
       end
 
       merge_request
diff --git a/changelogs/unreleased/39583-reopen-issue-count-cache.yml b/changelogs/unreleased/39583-reopen-issue-count-cache.yml
new file mode 100644
index 00000000000..ee35bcbcdae
--- /dev/null
+++ b/changelogs/unreleased/39583-reopen-issue-count-cache.yml
@@ -0,0 +1,5 @@
+---
+title: Refresh open Issue and Merge Request project counter caches when re-opening.
+merge_request: 15085
+author: Rob Ede @robjtede
+type: fixed
-- 
cgit v1.2.1


From 098a98055abd32a7049b5429064f1ed45e45eea8 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Mon, 30 Oct 2017 16:25:32 +0000
Subject: spec fixes increased perf of scrolling tabs into view

---
 app/assets/javascripts/repo/components/new_dropdown/modal.vue | 4 ++--
 app/assets/javascripts/repo/components/repo.vue               | 8 +++++---
 app/assets/javascripts/repo/components/repo_preview.vue       | 2 +-
 app/assets/javascripts/repo/stores/actions.js                 | 7 ++-----
 app/assets/stylesheets/pages/repo.scss                        | 3 +++
 spec/features/projects/tree/create_file_spec.rb               | 2 +-
 spec/javascripts/repo/components/new_dropdown/index_spec.js   | 6 +++++-
 7 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/app/assets/javascripts/repo/components/new_dropdown/modal.vue b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
index e780b88b04c..ac1f613bb71 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/modal.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
@@ -1,5 +1,5 @@
 <script>
-  import { mapActions, mapState } from 'vuex';
+  import { mapActions } from 'vuex';
   import { __ } from '../../../locale';
   import popupDialog from '../../../vue_shared/components/popup_dialog.vue';
 
@@ -28,7 +28,7 @@
       ]),
       createEntryInStore() {
         this.createTempEntry({
-          name: this.entryName.replace(new RegExp(`^${this.path}\/`), ''),
+          name: this.entryName.replace(new RegExp(`^${this.path}/`), ''),
           type: this.type,
         });
 
diff --git a/app/assets/javascripts/repo/components/repo.vue b/app/assets/javascripts/repo/components/repo.vue
index 1f0e168c777..98117802016 100644
--- a/app/assets/javascripts/repo/components/repo.vue
+++ b/app/assets/javascripts/repo/components/repo.vue
@@ -26,12 +26,14 @@ export default {
     RepoPreview,
   },
   mounted() {
-    const alertMessage = 'Are you sure you want to lose unsaved changes?';
+    const returnValue = 'Are you sure you want to lose unsaved changes?';
     window.onbeforeunload = (e) => {
       if (!this.changedFiles.length) return undefined;
 
-      e.returnValue = alertMessage;
-      return alertMessage;
+      Object.assign(e, {
+        returnValue,
+      });
+      return returnValue;
     };
   },
 };
diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index b189a603c57..d4d0a667ce4 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -8,7 +8,7 @@ export default {
       'activeFile',
     ]),
     renderErrorTooLarge() {
-      return this.activeFile.renderError == 'too_large';
+      return this.activeFile.renderError === 'too_large';
     },
   },
   methods: {
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index 008de3d8315..856a3994b37 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -2,9 +2,6 @@ import Vue from 'vue';
 import flash from '../../flash';
 import service from '../services';
 import * as types from './mutation_types';
-import {
-  pushState,
-} from './utils';
 
 export const redirectToUrl = url => gl.utils.visitUrl(url);
 
@@ -118,9 +115,9 @@ export const scrollToTab = () => {
     const tabs = document.getElementById('tabs');
 
     if (tabs) {
-      const tabEl = tabs.querySelector('.active');
+      const tabEl = tabs.querySelector('.active .repo-tab');
 
-      tabs.scrollLeft = tabEl.offsetLeft;
+      tabEl.focus();
     }
   });
 };
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index 019f3a2ec45..44831288541 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -41,7 +41,9 @@
   }
 
   .panel-right {
+    display: -webkit-flex;
     display: flex;
+    -webkit-flex-direction: column;
     flex-direction: column;
     width: 80%;
     height: 100%;
@@ -73,6 +75,7 @@
     }
 
     .blob-viewer-container {
+      -webkit-flex: 1;
       flex: 1;
       overflow: auto;
 
diff --git a/spec/features/projects/tree/create_file_spec.rb b/spec/features/projects/tree/create_file_spec.rb
index f75122abad3..a67ec891e7c 100644
--- a/spec/features/projects/tree/create_file_spec.rb
+++ b/spec/features/projects/tree/create_file_spec.rb
@@ -28,7 +28,7 @@ feature 'Multi-file editor new file', :js do
       click_button('Create file')
     end
 
-    find('.inputarea', visible: false).send_keys('file content')
+    find('.inputarea').send_keys('file content')
 
     fill_in('commit-message', with: 'commit message')
 
diff --git a/spec/javascripts/repo/components/new_dropdown/index_spec.js b/spec/javascripts/repo/components/new_dropdown/index_spec.js
index dd751f32333..93b10fc1fee 100644
--- a/spec/javascripts/repo/components/new_dropdown/index_spec.js
+++ b/spec/javascripts/repo/components/new_dropdown/index_spec.js
@@ -10,7 +10,11 @@ describe('new dropdown component', () => {
   beforeEach(() => {
     const component = Vue.extend(newDropdown);
 
-    vm = createComponentWithStore(component, store).$mount();
+    vm = createComponentWithStore(component, store);
+
+    vm.$store.state.path = '';
+
+    vm.$mount();
   });
 
   afterEach(() => {
-- 
cgit v1.2.1


From ff1e3a47c4bd15fd5c048c39408361a21057bf30 Mon Sep 17 00:00:00 2001
From: Mark Fletcher <mark@gitlab.com>
Date: Mon, 30 Oct 2017 17:19:51 +0000
Subject: Fix namespacing for MergeWhenPipelineSucceedsService in MR API

---
 ...e-when-pipeline-succeeds-from-the-api-fails.yml |  5 +++++
 lib/api/merge_requests.rb                          |  2 +-
 spec/requests/api/merge_requests_spec.rb           | 24 ++++++++++++++++++++++
 3 files changed, 30 insertions(+), 1 deletion(-)
 create mode 100644 changelogs/unreleased/39619-cancel-merge-when-pipeline-succeeds-from-the-api-fails.yml

diff --git a/changelogs/unreleased/39619-cancel-merge-when-pipeline-succeeds-from-the-api-fails.yml b/changelogs/unreleased/39619-cancel-merge-when-pipeline-succeeds-from-the-api-fails.yml
new file mode 100644
index 00000000000..95251b46ecc
--- /dev/null
+++ b/changelogs/unreleased/39619-cancel-merge-when-pipeline-succeeds-from-the-api-fails.yml
@@ -0,0 +1,5 @@
+---
+title: Fix namespacing for MergeWhenPipelineSucceedsService in MR API
+merge_request:
+author:
+type: fixed
diff --git a/lib/api/merge_requests.rb b/lib/api/merge_requests.rb
index be843ec8251..726f09e3669 100644
--- a/lib/api/merge_requests.rb
+++ b/lib/api/merge_requests.rb
@@ -295,7 +295,7 @@ module API
 
         unauthorized! unless merge_request.can_cancel_merge_when_pipeline_succeeds?(current_user)
 
-        ::MergeRequest::MergeWhenPipelineSucceedsService
+        ::MergeRequests::MergeWhenPipelineSucceedsService
           .new(merge_request.target_project, current_user)
           .cancel(merge_request)
       end
diff --git a/spec/requests/api/merge_requests_spec.rb b/spec/requests/api/merge_requests_spec.rb
index 28b1404a4f7..024cfe8b372 100644
--- a/spec/requests/api/merge_requests_spec.rb
+++ b/spec/requests/api/merge_requests_spec.rb
@@ -1061,6 +1061,30 @@ describe API::MergeRequests do
     end
   end
 
+  describe 'POST :id/merge_requests/:merge_request_iid/cancel_merge_when_pipeline_succeeds' do
+    before do
+      ::MergeRequests::MergeWhenPipelineSucceedsService.new(merge_request.target_project, user).execute(merge_request)
+    end
+
+    it 'removes the merge_when_pipeline_succeeds status' do
+      post api("/projects/#{project.id}/merge_requests/#{merge_request.iid}/cancel_merge_when_pipeline_succeeds", user)
+
+      expect(response).to have_gitlab_http_status(201)
+    end
+
+    it 'returns 404 if the merge request is not found' do
+      post api("/projects/#{project.id}/merge_requests/123/merge_when_pipeline_succeeds", user)
+
+      expect(response).to have_gitlab_http_status(404)
+    end
+
+    it 'returns 404 if the merge request id is used instead of iid' do
+      post api("/projects/#{project.id}/merge_requests/#{merge_request.id}/merge_when_pipeline_succeeds", user)
+
+      expect(response).to have_gitlab_http_status(404)
+    end
+  end
+
   describe 'Time tracking' do
     let(:issuable) { merge_request }
 
-- 
cgit v1.2.1


From 430131f720187772f46e776a100273aba0d13aa6 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Mon, 30 Oct 2017 18:59:16 +0000
Subject: Remove issue and issue status select from global namespace

---
 app/assets/javascripts/header.js                   | 14 +++---
 app/assets/javascripts/init_legacy_filters.js      |  4 +-
 .../javascripts/issuable_bulk_update_sidebar.js    |  5 +-
 app/assets/javascripts/issue.js                    |  4 +-
 app/assets/javascripts/issue_status_select.js      | 58 ++++++++++------------
 app/assets/javascripts/main.js                     |  6 +--
 6 files changed, 40 insertions(+), 51 deletions(-)

diff --git a/app/assets/javascripts/header.js b/app/assets/javascripts/header.js
index ea2e2205077..33a352e158a 100644
--- a/app/assets/javascripts/header.js
+++ b/app/assets/javascripts/header.js
@@ -7,10 +7,12 @@ import { highCountTrim } from '~/lib/utils/text_utility';
  * @param {jQuery.Event} e
  * @param {String} count
  */
-$(document).on('todo:toggle', (e, count) => {
-  const parsedCount = parseInt(count, 10);
-  const $todoPendingCount = $('.todos-count');
+export default function initTodoToggle() {
+  $(document).on('todo:toggle', (e, count) => {
+    const parsedCount = parseInt(count, 10);
+    const $todoPendingCount = $('.todos-count');
 
-  $todoPendingCount.text(highCountTrim(parsedCount));
-  $todoPendingCount.toggleClass('hidden', parsedCount === 0);
-});
+    $todoPendingCount.text(highCountTrim(parsedCount));
+    $todoPendingCount.toggleClass('hidden', parsedCount === 0);
+  });
+}
diff --git a/app/assets/javascripts/init_legacy_filters.js b/app/assets/javascripts/init_legacy_filters.js
index 1211c2c802c..fcf424408f2 100644
--- a/app/assets/javascripts/init_legacy_filters.js
+++ b/app/assets/javascripts/init_legacy_filters.js
@@ -1,15 +1,15 @@
 /* eslint-disable no-new */
 /* global LabelsSelect */
 /* global MilestoneSelect */
-/* global IssueStatusSelect */
 /* global SubscriptionSelect */
 
 import UsersSelect from './users_select';
+import issueStatusSelect from './issue_status_select';
 
 export default () => {
   new UsersSelect();
   new LabelsSelect();
   new MilestoneSelect();
-  new IssueStatusSelect();
+  issueStatusSelect();
   new SubscriptionSelect();
 };
diff --git a/app/assets/javascripts/issuable_bulk_update_sidebar.js b/app/assets/javascripts/issuable_bulk_update_sidebar.js
index bb509089b1d..4a15ec8b147 100644
--- a/app/assets/javascripts/issuable_bulk_update_sidebar.js
+++ b/app/assets/javascripts/issuable_bulk_update_sidebar.js
@@ -1,12 +1,11 @@
 /* eslint-disable class-methods-use-this, no-new */
 /* global LabelsSelect */
 /* global MilestoneSelect */
-/* global IssueStatusSelect */
 /* global SubscriptionSelect */
 
 import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
 import './milestone_select';
-import './issue_status_select';
+import issueStatusSelect from './issue_status_select';
 import './subscription_select';
 import './labels_select';
 
@@ -49,7 +48,7 @@ export default class IssuableBulkUpdateSidebar {
   initDropdowns() {
     new LabelsSelect();
     new MilestoneSelect();
-    new IssueStatusSelect();
+    issueStatusSelect();
     new SubscriptionSelect();
   }
 
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index 3fc29f9a661..acd5730cf3c 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -6,7 +6,7 @@ import TaskList from './task_list';
 import CreateMergeRequestDropdown from './create_merge_request_dropdown';
 import IssuablesHelper from './helpers/issuables_helper';
 
-class Issue {
+export default class Issue {
   constructor() {
     if ($('a.btn-close').length) {
       this.taskList = new TaskList({
@@ -147,5 +147,3 @@ class Issue {
     });
   }
 }
-
-export default Issue;
diff --git a/app/assets/javascripts/issue_status_select.js b/app/assets/javascripts/issue_status_select.js
index 56cb536dcde..fabfd26e699 100644
--- a/app/assets/javascripts/issue_status_select.js
+++ b/app/assets/javascripts/issue_status_select.js
@@ -1,34 +1,26 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, quotes, object-shorthand, no-unused-vars, no-shadow, one-var, one-var-declaration-per-line, comma-dangle, max-len */
-(function() {
-  this.IssueStatusSelect = (function() {
-    function IssueStatusSelect() {
-      $('.js-issue-status').each(function(i, el) {
-        var fieldName;
-        fieldName = $(el).data("field-name");
-        return $(el).glDropdown({
-          selectable: true,
-          fieldName: fieldName,
-          toggleLabel: (function(_this) {
-            return function(selected, el, instance) {
-              var $item, label;
-              label = 'Author';
-              $item = instance.dropdown.find('.is-active');
-              if ($item.length) {
-                label = $item.text();
-              }
-              return label;
-            };
-          })(this),
-          clicked: function(options) {
-            return options.e.preventDefault();
-          },
-          id: function(obj, el) {
-            return $(el).data("id");
+/* eslint-disable func-names,wrap-iife, no-shadow, no-unused-vars, one-var */
+export default function issueStatusSelect() {
+  $('.js-issue-status').each(function (i, el) {
+    const fieldName = $(el).data('field-name');
+    return $(el).glDropdown({
+      selectable: true,
+      fieldName,
+      toggleLabel: (function (_this) {
+        return function (selected, el, instance) {
+          let label = 'Author';
+          const $item = instance.dropdown.find('.is-active');
+          if ($item.length) {
+            label = $item.text();
           }
-        });
-      });
-    }
-
-    return IssueStatusSelect;
-  })();
-}).call(window);
+          return label;
+        };
+      })(this),
+      clicked(options) {
+        return options.e.preventDefault();
+      },
+      id(obj, el) {
+        return $(el).data('id');
+      },
+    });
+  });
+}
diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index fd9d0c335a5..d743f20c615 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -54,11 +54,8 @@ import './gl_dropdown';
 import './gl_field_error';
 import './gl_field_errors';
 import './gl_form';
-import './header';
+import initTodoToggle from './header';
 import initImporterStatus from './importer_status';
-import './issuable_form';
-import './issue';
-import './issue_status_select';
 import './labels_select';
 import './layout_nav';
 import LazyLoader from './lazy_loader';
@@ -137,6 +134,7 @@ $(function () {
 
   initBreadcrumbs();
   initImporterStatus();
+  initTodoToggle();
 
   // Set the default path for all cookies to GitLab's root directory
   Cookies.defaults.path = gon.relative_url_root || '/';
-- 
cgit v1.2.1


From 1c978aff62dc78acbbfc6fd153dcb5f7b777ac3f Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Mon, 30 Oct 2017 19:50:17 +0000
Subject: Fix broken test

---
 spec/javascripts/header_spec.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/spec/javascripts/header_spec.js b/spec/javascripts/header_spec.js
index 4751eb868a4..2443ffd48f3 100644
--- a/spec/javascripts/header_spec.js
+++ b/spec/javascripts/header_spec.js
@@ -1,4 +1,4 @@
-import '~/header';
+import initTodoToggle from '~/header';
 
 describe('Header', function () {
   const todosPendingCount = '.todos-count';
@@ -14,6 +14,7 @@ describe('Header', function () {
 
   preloadFixtures(fixtureTemplate);
   beforeEach(() => {
+    initTodoToggle();
     loadFixtures(fixtureTemplate);
   });
 
-- 
cgit v1.2.1


From c7f0d2b2af38e1e357f0cebd3a82d562894afe9c Mon Sep 17 00:00:00 2001
From: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Date: Mon, 30 Oct 2017 19:53:14 +0000
Subject: Revert "Merge branch '2518-saved-configuration-for-issue-board' into
 'master'"

This reverts merge request !15009
---
 .../javascripts/boards/filtered_search_boards.js   |   9 +-
 .../javascripts/boards/stores/boards_store.js      |   8 +-
 .../javascripts/filtered_search/dropdown_utils.js  |  10 --
 .../filtered_search/filtered_search_manager.js     |  10 +-
 .../filtered_search_visual_tokens.js               |  15 ++-
 app/assets/javascripts/labels_select.js            |  13 +--
 app/assets/javascripts/milestone_select.js         |  17 +---
 app/assets/javascripts/users_select.js             |   7 +-
 .../vue_shared/components/loading_icon.vue         |   8 +-
 .../vue_shared/components/popup_dialog.vue         | 101 ++++++++-------------
 app/assets/stylesheets/framework/common.scss       |   3 -
 app/assets/stylesheets/framework/dropdowns.scss    |   1 -
 app/assets/stylesheets/framework/modal.scss        |   8 --
 .../framework/tw_bootstrap_variables.scss          |  33 -------
 app/assets/stylesheets/pages/repo.scss             |  13 +++
 app/helpers/boards_helper.rb                       |  11 +++
 16 files changed, 93 insertions(+), 174 deletions(-)

diff --git a/app/assets/javascripts/boards/filtered_search_boards.js b/app/assets/javascripts/boards/filtered_search_boards.js
index 184665f395c..3f083655f95 100644
--- a/app/assets/javascripts/boards/filtered_search_boards.js
+++ b/app/assets/javascripts/boards/filtered_search_boards.js
@@ -11,8 +11,7 @@ export default class FilteredSearchBoards extends gl.FilteredSearchManager {
     // Issue boards is slightly different, we handle all the requests async
     // instead or reloading the page, we just re-fire the list ajax requests
     this.isHandledAsync = true;
-    this.cantEdit = cantEdit.filter(i => typeof i === 'string');
-    this.cantEditWithValue = cantEdit.filter(i => typeof i === 'object');
+    this.cantEdit = cantEdit;
   }
 
   updateObject(path) {
@@ -43,9 +42,7 @@ export default class FilteredSearchBoards extends gl.FilteredSearchManager {
     this.filteredSearchInput.dispatchEvent(new Event('input'));
   }
 
-  canEdit(tokenName, tokenValue) {
-    if (this.cantEdit.includes(tokenName)) return false;
-    return this.cantEditWithValue.findIndex(token => token.name === tokenName &&
-      token.value === tokenValue) === -1;
+  canEdit(tokenName) {
+    return this.cantEdit.indexOf(tokenName) === -1;
   }
 }
diff --git a/app/assets/javascripts/boards/stores/boards_store.js b/app/assets/javascripts/boards/stores/boards_store.js
index 798d7e0d147..ea82958e80d 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js
+++ b/app/assets/javascripts/boards/stores/boards_store.js
@@ -14,18 +14,16 @@ gl.issueBoards.BoardsStore = {
   },
   state: {},
   detail: {
-    issue: {},
+    issue: {}
   },
   moving: {
     issue: {},
-    list: {},
+    list: {}
   },
   create () {
     this.state.lists = [];
     this.filter.path = getUrlParamsArray().join('&');
-    this.detail = {
-      issue: {},
-    };
+    this.detail = { issue: {} };
   },
   addList (listObj, defaultAvatar) {
     const list = new List(listObj, defaultAvatar);
diff --git a/app/assets/javascripts/filtered_search/dropdown_utils.js b/app/assets/javascripts/filtered_search/dropdown_utils.js
index cf8a9b0402b..8d711e3213c 100644
--- a/app/assets/javascripts/filtered_search/dropdown_utils.js
+++ b/app/assets/javascripts/filtered_search/dropdown_utils.js
@@ -147,16 +147,6 @@ class DropdownUtils {
     return dataValue !== null;
   }
 
-  static getVisualTokenValues(visualToken) {
-    const tokenName = visualToken && visualToken.querySelector('.name').textContent.trim();
-    let tokenValue = visualToken && visualToken.querySelector('.value') && visualToken.querySelector('.value').textContent.trim();
-    if (tokenName === 'label' && tokenValue) {
-      // remove leading symbol and wrapping quotes
-      tokenValue = tokenValue.replace(/^~("|')?(.*)/, '$2').replace(/("|')$/, '');
-    }
-    return { tokenName, tokenValue };
-  }
-
   // Determines the full search query (visual tokens + input)
   static getSearchQuery(untilInput = false) {
     const container = FilteredSearchContainer.container;
diff --git a/app/assets/javascripts/filtered_search/filtered_search_manager.js b/app/assets/javascripts/filtered_search/filtered_search_manager.js
index 69c57f923b6..7b233842d5a 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_manager.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_manager.js
@@ -185,8 +185,8 @@ class FilteredSearchManager {
     if (e.keyCode === 8 || e.keyCode === 46) {
       const { lastVisualToken } = gl.FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
-      const { tokenName, tokenValue } = gl.DropdownUtils.getVisualTokenValues(lastVisualToken);
-      const canEdit = tokenName && this.canEdit && this.canEdit(tokenName, tokenValue);
+      const sanitizedTokenName = lastVisualToken && lastVisualToken.querySelector('.name').textContent.trim();
+      const canEdit = sanitizedTokenName && this.canEdit && this.canEdit(sanitizedTokenName);
       if (this.filteredSearchInput.value === '' && lastVisualToken && canEdit) {
         this.filteredSearchInput.value = gl.FilteredSearchVisualTokens.getLastTokenPartial();
         gl.FilteredSearchVisualTokens.removeLastTokenPartial();
@@ -336,8 +336,8 @@ class FilteredSearchManager {
       let canClearToken = t.classList.contains('js-visual-token');
 
       if (canClearToken) {
-        const { tokenName, tokenValue } = gl.DropdownUtils.getVisualTokenValues(t);
-        canClearToken = this.canEdit && this.canEdit(tokenName, tokenValue);
+        const tokenKey = t.querySelector('.name').textContent.trim();
+        canClearToken = this.canEdit && this.canEdit(tokenKey);
       }
 
       if (canClearToken) {
@@ -469,7 +469,7 @@ class FilteredSearchManager {
           }
 
           hasFilteredSearch = true;
-          const canEdit = this.canEdit && this.canEdit(sanitizedKey, sanitizedValue);
+          const canEdit = this.canEdit && this.canEdit(sanitizedKey);
           gl.FilteredSearchVisualTokens.addFilterVisualToken(
             sanitizedKey,
             `${symbol}${quotationsToUse}${sanitizedValue}${quotationsToUse}`,
diff --git a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
index 6139e81fe6d..d2f92929b8a 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
@@ -38,14 +38,21 @@ class FilteredSearchVisualTokens {
   }
 
   static createVisualTokenElementHTML(canEdit = true) {
+    let removeTokenMarkup = '';
+    if (canEdit) {
+      removeTokenMarkup = `
+        <div class="remove-token" role="button">
+          <i class="fa fa-close"></i>
+        </div>
+      `;
+    }
+
     return `
-      <div class="${canEdit ? 'selectable' : 'hidden'}" role="button">
+      <div class="selectable" role="button">
         <div class="name"></div>
         <div class="value-container">
           <div class="value"></div>
-          <div class="remove-token" role="button">
-            <i class="fa fa-close"></i>
-          </div>
+          ${removeTokenMarkup}
         </div>
       </div>
     `;
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index 1e52963b1dd..84602cf9207 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -8,7 +8,7 @@ import CreateLabelDropdown from './create_label';
 
 (function() {
   this.LabelsSelect = (function() {
-    function LabelsSelect(els, options = {}) {
+    function LabelsSelect(els) {
       var _this, $els;
       _this = this;
 
@@ -58,7 +58,6 @@ import CreateLabelDropdown from './create_label';
           labelHTMLTemplate = _.template('<% _.each(labels, function(label){ %> <a href="<%- ["",issueURLSplit[1], issueURLSplit[2],""].join("/") %>issues?label_name[]=<%- encodeURIComponent(label.title) %>"> <span class="label has-tooltip color-label" title="<%- label.description %>" style="background-color: <%- label.color %>; color: <%- label.text_color %>;"> <%- label.title %> </span> </a> <% }); %>');
           labelNoneHTMLTemplate = '<span class="no-value">None</span>';
         }
-        const handleClick = options.handleClick;
 
         $sidebarLabelTooltip.tooltip();
 
@@ -317,9 +316,9 @@ import CreateLabelDropdown from './create_label';
           },
           multiSelect: $dropdown.hasClass('js-multiselect'),
           vue: $dropdown.hasClass('js-issue-board-sidebar'),
-          clicked: function(clickEvent) {
-            const { $el, e, isMarking } = clickEvent;
-            const label = clickEvent.selectedObj;
+          clicked: function(options) {
+            const { $el, e, isMarking } = options;
+            const label = options.selectedObj;
 
             var isIssueIndex, isMRIndex, page, boardsModel;
             var fadeOutLoader = () => {
@@ -392,10 +391,6 @@ import CreateLabelDropdown from './create_label';
                 .then(fadeOutLoader)
                 .catch(fadeOutLoader);
             }
-            else if (handleClick) {
-              e.preventDefault();
-              handleClick(label);
-            }
             else {
               if ($dropdown.hasClass('js-multiselect')) {
 
diff --git a/app/assets/javascripts/milestone_select.js b/app/assets/javascripts/milestone_select.js
index 74e5a4f1cea..e7d5325a509 100644
--- a/app/assets/javascripts/milestone_select.js
+++ b/app/assets/javascripts/milestone_select.js
@@ -5,7 +5,7 @@ import _ from 'underscore';
 
 (function() {
   this.MilestoneSelect = (function() {
-    function MilestoneSelect(currentProject, els, options = {}) {
+    function MilestoneSelect(currentProject, els) {
       var _this, $els;
       if (currentProject != null) {
         _this = this;
@@ -136,26 +136,19 @@ import _ from 'underscore';
           },
           opened: function(e) {
             const $el = $(e.currentTarget);
-            if ($dropdown.hasClass('js-issue-board-sidebar') || options.handleClick) {
+            if ($dropdown.hasClass('js-issue-board-sidebar')) {
               selectedMilestone = $dropdown[0].dataset.selected || selectedMilestoneDefault;
             }
             $('a.is-active', $el).removeClass('is-active');
             $(`[data-milestone-id="${selectedMilestone}"] > a`, $el).addClass('is-active');
           },
           vue: $dropdown.hasClass('js-issue-board-sidebar'),
-          clicked: function(clickEvent) {
-            const { $el, e } = clickEvent;
-            let selected = clickEvent.selectedObj;
+          clicked: function(options) {
+            const { $el, e } = options;
+            let selected = options.selectedObj;
 
             var data, isIssueIndex, isMRIndex, isSelecting, page, boardsStore;
             if (!selected) return;
-
-            if (options.handleClick) {
-              e.preventDefault();
-              options.handleClick(selected);
-              return;
-            }
-
             page = $('body').attr('data-page');
             isIssueIndex = page === 'projects:issues:index';
             isMRIndex = (page === page && page === 'projects:merge_requests:index');
diff --git a/app/assets/javascripts/users_select.js b/app/assets/javascripts/users_select.js
index 759cc9925f4..a0883b32593 100644
--- a/app/assets/javascripts/users_select.js
+++ b/app/assets/javascripts/users_select.js
@@ -6,7 +6,7 @@ import _ from 'underscore';
 // TODO: remove eventHub hack after code splitting refactor
 window.emitSidebarEvent = window.emitSidebarEvent || $.noop;
 
-function UsersSelect(currentUser, els, options = {}) {
+function UsersSelect(currentUser, els) {
   var $els;
   this.users = this.users.bind(this);
   this.user = this.user.bind(this);
@@ -20,8 +20,6 @@ function UsersSelect(currentUser, els, options = {}) {
     }
   }
 
-  const { handleClick } = options;
-
   $els = $(els);
 
   if (!els) {
@@ -444,9 +442,6 @@ function UsersSelect(currentUser, els, options = {}) {
           }
           if ($el.closest('.add-issues-modal').length) {
             gl.issueBoards.ModalStore.store.filter[$dropdown.data('field-name')] = user.id;
-          } else if (handleClick) {
-            e.preventDefault();
-            handleClick(user, isMarking);
           } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
             return Issuable.filterResults($dropdown.closest('form'));
           } else if ($dropdown.hasClass('js-filter-submit')) {
diff --git a/app/assets/javascripts/vue_shared/components/loading_icon.vue b/app/assets/javascripts/vue_shared/components/loading_icon.vue
index 494fe4468d9..15581d5c2a0 100644
--- a/app/assets/javascripts/vue_shared/components/loading_icon.vue
+++ b/app/assets/javascripts/vue_shared/components/loading_icon.vue
@@ -18,12 +18,6 @@
         required: false,
         default: false,
       },
-
-      class: {
-        type: String,
-        required: false,
-        default: '',
-      },
     },
 
     computed: {
@@ -31,7 +25,7 @@
         return this.inline ? 'span' : 'div';
       },
       cssClass() {
-        return `fa-${this.size}x ${this.class}`.trim();
+        return `fa-${this.size}x`;
       },
     },
   };
diff --git a/app/assets/javascripts/vue_shared/components/popup_dialog.vue b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
index fc6421fecb9..9e8c10bdc1a 100644
--- a/app/assets/javascripts/vue_shared/components/popup_dialog.vue
+++ b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
@@ -5,27 +5,17 @@ export default {
   props: {
     title: {
       type: String,
-      required: false,
+      required: true,
     },
     text: {
       type: String,
       required: false,
     },
-    hideFooter: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
     kind: {
       type: String,
       required: false,
       default: 'primary',
     },
-    modalDialogClass: {
-      type: String,
-      required: false,
-      default: '',
-    },
     closeKind: {
       type: String,
       required: false,
@@ -40,11 +30,6 @@ export default {
       type: String,
       required: true,
     },
-    submitDisabled: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
   },
 
   computed: {
@@ -72,57 +57,43 @@ export default {
 </script>
 
 <template>
-<div class="modal-open">
-  <div
-    class="modal popup-dialog"
-    role="dialog"
-    tabindex="-1"
-  >
-    <div
-      :class="modalDialogClass"
-      class="modal-dialog"
-      role="document"
-    >
-      <div class="modal-content">
-        <div class="modal-header">
-          <slot name="header">
-            <h4 class="modal-title pull-left">
-              {{this.title}}
-            </h4>
-            <button
-              type="button"
-              class="close pull-right"
-              @click="close"
-              aria-label="Close"
-            >
-              <span aria-hidden="true">&times;</span>
-            </button>
-          </slot>
-        </div>
-        <div class="modal-body">
-          <slot name="body" :text="text">
-            <p>{{this.text}}</p>
-          </slot>
-        </div>
-        <div class="modal-footer" v-if="!hideFooter">
-          <button
-            type="button"
-            class="btn pull-left"
-            :class="btnCancelKindClass"
-            @click="close">
-            {{ closeButtonLabel }}
-          </button>
-          <button
-            type="button"
-            class="btn pull-right"
-            :class="btnKindClass"
-            @click="emitSubmit(true)">
-            {{ primaryButtonLabel }}
-          </button>
-        </div>
+<div
+  class="modal popup-dialog"
+  role="dialog"
+  tabindex="-1">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button"
+          class="close"
+          @click="close"
+          aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+        <h4 class="modal-title">{{this.title}}</h4>
+      </div>
+      <div class="modal-body">
+        <slot name="body" :text="text">
+          <p>{{text}}</p>
+        </slot>
+      </div>
+      <div class="modal-footer">
+        <button
+          type="button"
+          class="btn"
+          :class="btnCancelKindClass"
+          @click="close">
+          {{ closeButtonLabel }}
+        </button>
+        <button
+          type="button"
+          class="btn"
+          :class="btnKindClass"
+          @click="emitSubmit(true)">
+          {{ primaryButtonLabel }}
+        </button>
       </div>
     </div>
   </div>
-  <div class="modal-backdrop fade in" />
 </div>
 </template>
diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index 1cfd7ef01a8..96f9dda26c4 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -4,9 +4,6 @@
 .cred { color: $common-red; }
 .cgreen { color: $common-green; }
 .cdark { color: $common-gray-dark; }
-.text-secondary {
-  color: $gl-text-color-secondary;
-}
 
 /** COMMON CLASSES **/
 .prepend-top-0 { margin-top: 0; }
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index 63697fd38a7..a9d804e735d 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -37,7 +37,6 @@
   .dropdown-menu-nav {
     @include set-visible;
     display: block;
-    min-height: 40px;
 
     @media (max-width: $screen-xs-max) {
       width: 100%;
diff --git a/app/assets/stylesheets/framework/modal.scss b/app/assets/stylesheets/framework/modal.scss
index d218fb6d702..1cebd02df48 100644
--- a/app/assets/stylesheets/framework/modal.scss
+++ b/app/assets/stylesheets/framework/modal.scss
@@ -42,11 +42,3 @@ body.modal-open {
     width: 98%;
   }
 }
-
-.modal.popup-dialog {
-  display: block;
-}
-
-.modal-body {
-  background-color: $modal-body-bg;
-}
diff --git a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
index a23131e0818..3ea77eb7a43 100644
--- a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
+++ b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
@@ -164,36 +164,3 @@ $pre-border-color: $border-color;
 $table-bg-accent: $gray-light;
 
 $zindex-popover: 900;
-
-//== Modals
-//
-//##
-
-//** Padding applied to the modal body
-$modal-inner-padding: $gl-padding;
-
-//** Padding applied to the modal title
-$modal-title-padding: $gl-padding;
-//** Modal title line-height
-// $modal-title-line-height:     $line-height-base
-
-//** Background color of modal content area
-$modal-content-bg: $gray-light;
-$modal-body-bg: $white-light;
-//** Modal content border color
-// $modal-content-border-color:                   rgba(0,0,0,.2)
-//** Modal content border color **for IE8**
-// $modal-content-fallback-border-color:          #999
-
-//** Modal backdrop background color
-// $modal-backdrop-bg:           #000
-//** Modal backdrop opacity
-// $modal-backdrop-opacity:      .5
-//** Modal header border color
-// $modal-header-border-color:   #e5e5e5
-//** Modal footer border color
-// $modal-footer-border-color:   $modal-header-border-color
-
-// $modal-lg:                    900px
-// $modal-md:                    600px
-// $modal-sm:                    300px
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index e8c7f8a8fc0..6a363b1710e 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -7,6 +7,19 @@
   background: $black-transparent;
 }
 
+.modal.popup-dialog {
+  display: block;
+  background-color: $black-transparent;
+  z-index: 2100;
+
+  @media (min-width: $screen-md-min) {
+    .modal-dialog {
+      width: 600px;
+      margin: 30px auto;
+    }
+  }
+}
+
 .project-refs-form,
 .project-refs-target-form {
   display: inline-block;
diff --git a/app/helpers/boards_helper.rb b/app/helpers/boards_helper.rb
index c4a621160af..7112c6ee470 100644
--- a/app/helpers/boards_helper.rb
+++ b/app/helpers/boards_helper.rb
@@ -20,6 +20,17 @@ module BoardsHelper
     project_issues_path(@project)
   end
 
+  def current_board_json
+    board = @board || @boards.first
+
+    board.to_json(
+      only: [:id, :name, :milestone_id],
+      include: {
+        milestone: { only: [:title] }
+      }
+    )
+  end
+
   def board_base_url
     project_boards_path(@project)
   end
-- 
cgit v1.2.1


From 2cad283018b337c277cc386ded295a1cc5cc95a3 Mon Sep 17 00:00:00 2001
From: Jacopo <beschi.jacopo@gmail.com>
Date: Thu, 26 Oct 2017 09:34:02 +0200
Subject: Adds project_id to pipeline hook data

Pipeline hook data now includes the project_id
---
 app/models/project.rb                                          |  1 +
 .../unreleased/31454-missing-project-id-pipeline-hook-data.yml |  5 +++++
 doc/user/project/integrations/webhooks.md                      | 10 ++++++++++
 3 files changed, 16 insertions(+)
 create mode 100644 changelogs/unreleased/31454-missing-project-id-pipeline-hook-data.yml

diff --git a/app/models/project.rb b/app/models/project.rb
index 4689b588906..0b85c420c2a 100644
--- a/app/models/project.rb
+++ b/app/models/project.rb
@@ -1079,6 +1079,7 @@ class Project < ActiveRecord::Base
 
   def hook_attrs(backward: true)
     attrs = {
+      id: id,
       name: name,
       description: description,
       web_url: web_url,
diff --git a/changelogs/unreleased/31454-missing-project-id-pipeline-hook-data.yml b/changelogs/unreleased/31454-missing-project-id-pipeline-hook-data.yml
new file mode 100644
index 00000000000..daf7ac715bd
--- /dev/null
+++ b/changelogs/unreleased/31454-missing-project-id-pipeline-hook-data.yml
@@ -0,0 +1,5 @@
+---
+title: Adds project_id to pipeline hook data
+merge_request: 15044
+author: Jacopo Beschi @jacopo-beschi
+type: added
diff --git a/doc/user/project/integrations/webhooks.md b/doc/user/project/integrations/webhooks.md
index 7abc600a680..df75e25e12b 100644
--- a/doc/user/project/integrations/webhooks.md
+++ b/doc/user/project/integrations/webhooks.md
@@ -76,6 +76,7 @@ X-Gitlab-Event: Push Hook
   "user_avatar": "https://s.gravatar.com/avatar/d4c74594d841139328695756648b6bd6?s=8://s.gravatar.com/avatar/d4c74594d841139328695756648b6bd6?s=80",
   "project_id": 15,
   "project":{
+    "id": 15,
     "name":"Diaspora",
     "description":"",
     "web_url":"http://example.com/mike/diaspora",
@@ -156,6 +157,7 @@ X-Gitlab-Event: Tag Push Hook
   "user_avatar": "https://s.gravatar.com/avatar/d4c74594d841139328695756648b6bd6?s=8://s.gravatar.com/avatar/d4c74594d841139328695756648b6bd6?s=80",
   "project_id": 1,
   "project":{
+    "id": 1,
     "name":"Example",
     "description":"",
     "web_url":"http://example.com/jsmith/example",
@@ -206,6 +208,7 @@ X-Gitlab-Event: Issue Hook
     "avatar_url": "http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=40\u0026d=identicon"
   },
   "project": {
+    "id": 1,
     "name":"Gitlab Test",
     "description":"Aut reprehenderit ut est.",
     "web_url":"http://example.com/gitlabhq/gitlab-test",
@@ -335,6 +338,7 @@ X-Gitlab-Event: Note Hook
   },
   "project_id": 5,
   "project":{
+    "id": 5,
     "name":"Gitlab Test",
     "description":"Aut reprehenderit ut est.",
     "web_url":"http://example.com/gitlabhq/gitlab-test",
@@ -414,6 +418,7 @@ X-Gitlab-Event: Note Hook
   },
   "project_id": 5,
   "project":{
+    "id": 5,
     "name":"Gitlab Test",
     "description":"Aut reprehenderit ut est.",
     "web_url":"http://example.com/gitlab-org/gitlab-test",
@@ -540,6 +545,7 @@ X-Gitlab-Event: Note Hook
   },
   "project_id": 5,
   "project":{
+    "id": 5,
     "name":"Gitlab Test",
     "description":"Aut reprehenderit ut est.",
     "web_url":"http://example.com/gitlab-org/gitlab-test",
@@ -618,6 +624,7 @@ X-Gitlab-Event: Note Hook
   },
   "project_id": 5,
   "project":{
+    "id": 5,
     "name":"Gitlab Test",
     "description":"Aut reprehenderit ut est.",
     "web_url":"http://example.com/gitlab-org/gitlab-test",
@@ -692,6 +699,7 @@ X-Gitlab-Event: Merge Request Hook
     "avatar_url": "http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=40\u0026d=identicon"
   },
   "project": {
+    "id": 1,
     "name":"Gitlab Test",
     "description":"Aut reprehenderit ut est.",
     "web_url":"http://example.com/gitlabhq/gitlab-test",
@@ -848,6 +856,7 @@ X-Gitlab-Event: Wiki Page Hook
     "avatar_url": "http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80\u0026d=identicon"
   },
   "project": {
+    "id": 1,
     "name": "awesome-project",
     "description": "This is awesome",
     "web_url": "http://example.com/root/awesome-project",
@@ -919,6 +928,7 @@ X-Gitlab-Event: Pipeline Hook
       "avatar_url": "http://www.gravatar.com/avatar/e32bd13e2add097461cb96824b7a829c?s=80\u0026d=identicon"
    },
    "project":{
+      "id": 1,
       "name": "Gitlab Test",
       "description": "Atque in sunt eos similique dolores voluptatem.",
       "web_url": "http://192.168.64.1:3005/gitlab-org/gitlab-test",
-- 
cgit v1.2.1


From 1796936abc8873c1fcc38061fe3d8b44acda3ffe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alejandro=20Rodr=C3=ADguez?= <alejorro70@gmail.com>
Date: Mon, 30 Oct 2017 20:21:56 -0300
Subject: Handle large values on `MergeRequestDiffCommit` dates

---
 app/models/merge_request_diff_commit.rb       |  4 +-
 lib/gitlab/database.rb                        |  8 +++
 spec/lib/gitlab/database_spec.rb              | 22 +++++++
 spec/models/merge_request_diff_commit_spec.rb | 83 ++++++++++++++++++++++++++-
 4 files changed, 114 insertions(+), 3 deletions(-)

diff --git a/app/models/merge_request_diff_commit.rb b/app/models/merge_request_diff_commit.rb
index 670b26d4ca3..b75387e236e 100644
--- a/app/models/merge_request_diff_commit.rb
+++ b/app/models/merge_request_diff_commit.rb
@@ -17,7 +17,9 @@ class MergeRequestDiffCommit < ActiveRecord::Base
       commit_hash.merge(
         merge_request_diff_id: merge_request_diff_id,
         relative_order: index,
-        sha: sha_attribute.type_cast_for_database(sha)
+        sha: sha_attribute.type_cast_for_database(sha),
+        authored_date: Gitlab::Database.sanitize_timestamp(commit_hash[:authored_date]),
+        committed_date: Gitlab::Database.sanitize_timestamp(commit_hash[:committed_date])
       )
     end
 
diff --git a/lib/gitlab/database.rb b/lib/gitlab/database.rb
index 357f16936c6..43a00d6cedb 100644
--- a/lib/gitlab/database.rb
+++ b/lib/gitlab/database.rb
@@ -4,6 +4,10 @@ module Gitlab
     # https://www.postgresql.org/docs/9.2/static/datatype-numeric.html
     # http://dev.mysql.com/doc/refman/5.7/en/integer-types.html
     MAX_INT_VALUE = 2147483647
+    # The max value between MySQL's TIMESTAMP and PostgreSQL's timestampz:
+    # https://www.postgresql.org/docs/9.1/static/datatype-datetime.html
+    # https://dev.mysql.com/doc/refman/5.7/en/datetime.html
+    MAX_TIMESTAMP_VALUE = Time.at((1 << 31) - 1).freeze
 
     def self.config
       ActiveRecord::Base.configurations[Rails.env]
@@ -120,6 +124,10 @@ module Gitlab
       EOF
     end
 
+    def self.sanitize_timestamp(timestamp)
+      MAX_TIMESTAMP_VALUE > timestamp ? timestamp : MAX_TIMESTAMP_VALUE.dup
+    end
+
     # pool_size - The size of the DB pool.
     # host - An optional host name to use instead of the default one.
     def self.create_connection_pool(pool_size, host = nil)
diff --git a/spec/lib/gitlab/database_spec.rb b/spec/lib/gitlab/database_spec.rb
index 5fa94999d25..7aeb85b8f5a 100644
--- a/spec/lib/gitlab/database_spec.rb
+++ b/spec/lib/gitlab/database_spec.rb
@@ -256,4 +256,26 @@ describe Gitlab::Database do
       expect(described_class.false_value).to eq 0
     end
   end
+
+  describe '#sanitize_timestamp' do
+    let(:max_timestamp) { Time.at((1 << 31) - 1) }
+
+    subject { described_class.sanitize_timestamp(timestamp) }
+
+    context 'with a timestamp smaller than MAX_TIMESTAMP_VALUE' do
+      let(:timestamp) { max_timestamp - 10.years }
+
+      it 'returns the given timestamp' do
+        expect(subject).to eq(timestamp)
+      end
+    end
+
+    context 'with a timestamp larger than MAX_TIMESTAMP_VALUE' do
+      let(:timestamp) { max_timestamp + 1.second }
+
+      it 'returns MAX_TIMESTAMP_VALUE' do
+        expect(subject).to eq(max_timestamp)
+      end
+    end
+  end
 end
diff --git a/spec/models/merge_request_diff_commit_spec.rb b/spec/models/merge_request_diff_commit_spec.rb
index 9d4a0ecf8c0..7709cf43200 100644
--- a/spec/models/merge_request_diff_commit_spec.rb
+++ b/spec/models/merge_request_diff_commit_spec.rb
@@ -2,14 +2,93 @@ require 'rails_helper'
 
 describe MergeRequestDiffCommit do
   let(:merge_request) { create(:merge_request) }
-  subject { merge_request.commits.first }
+  let(:project) { merge_request.project }
 
   describe '#to_hash' do
+    subject { merge_request.commits.first }
+
     it 'returns the same results as Commit#to_hash, except for parent_ids' do
-      commit_from_repo = merge_request.project.repository.commit(subject.sha)
+      commit_from_repo = project.repository.commit(subject.sha)
       commit_from_repo_hash = commit_from_repo.to_hash.merge(parent_ids: [])
 
       expect(subject.to_hash).to eq(commit_from_repo_hash)
     end
   end
+
+  describe '.create_bulk' do
+    let(:sha_attribute)  { Gitlab::Database::ShaAttribute.new }
+    let(:merge_request_diff_id) { merge_request.merge_request_diff.id }
+    let(:commits) do
+      [
+        project.commit('5937ac0a7beb003549fc5fd26fc247adbce4a52e'),
+        project.commit('570e7b2abdd848b95f2f578043fc23bd6f6fd24d')
+      ]
+    end
+    let(:rows) do
+      [
+        {
+          "message": "Add submodule from gitlab.com\n\nSigned-off-by: Dmitriy Zaporozhets \u003cdmitriy.zaporozhets@gmail.com\u003e\n",
+          "authored_date": "2014-02-27T10:01:38.000+01:00".to_time,
+          "author_name": "Dmitriy Zaporozhets",
+          "author_email": "dmitriy.zaporozhets@gmail.com",
+          "committed_date": "2014-02-27T10:01:38.000+01:00".to_time,
+          "committer_name": "Dmitriy Zaporozhets",
+          "committer_email": "dmitriy.zaporozhets@gmail.com",
+          "merge_request_diff_id": merge_request_diff_id,
+          "relative_order": 0,
+          "sha": sha_attribute.type_cast_for_database('5937ac0a7beb003549fc5fd26fc247adbce4a52e')
+        },
+        {
+          "message": "Change some files\n\nSigned-off-by: Dmitriy Zaporozhets \u003cdmitriy.zaporozhets@gmail.com\u003e\n",
+          "authored_date": "2014-02-27T09:57:31.000+01:00".to_time,
+          "author_name": "Dmitriy Zaporozhets",
+          "author_email": "dmitriy.zaporozhets@gmail.com",
+          "committed_date": "2014-02-27T09:57:31.000+01:00".to_time,
+          "committer_name": "Dmitriy Zaporozhets",
+          "committer_email": "dmitriy.zaporozhets@gmail.com",
+          "merge_request_diff_id": merge_request_diff_id,
+          "relative_order": 1,
+          "sha": sha_attribute.type_cast_for_database('570e7b2abdd848b95f2f578043fc23bd6f6fd24d')
+        }
+      ]
+    end
+
+    subject { described_class.create_bulk(merge_request_diff_id, commits) }
+
+    it 'inserts the commits into the database en masse' do
+      expect(Gitlab::Database).to receive(:bulk_insert)
+        .with(described_class.table_name, rows)
+
+      subject
+    end
+
+    context 'with dates larger than the DB limit' do
+      let(:commits) do
+        # This commit's date is "Sun Aug 17 07:12:55 292278994 +0000"
+        [project.commit('ba3343bc4fa403a8dfbfcab7fc1a8c29ee34bd69')]
+      end
+      let(:timestamp) { Time.at((1 << 31) - 1) }
+      let(:rows) do
+        [{
+          "message": "Weird commit date\n",
+          "authored_date": timestamp,
+          "author_name": "Alejandro Rodríguez",
+          "author_email": "alejorro70@gmail.com",
+          "committed_date": timestamp,
+          "committer_name": "Alejandro Rodríguez",
+          "committer_email": "alejorro70@gmail.com",
+          "merge_request_diff_id": merge_request_diff_id,
+          "relative_order": 0,
+          "sha": sha_attribute.type_cast_for_database('ba3343bc4fa403a8dfbfcab7fc1a8c29ee34bd69')
+        }]
+      end
+
+      it 'uses a sanitized date' do
+        expect(Gitlab::Database).to receive(:bulk_insert)
+          .with(described_class.table_name, rows)
+
+        subject
+      end
+    end
+  end
 end
-- 
cgit v1.2.1


From 6a4534b62fad51e5e9da0d132ed64626ffdc2d10 Mon Sep 17 00:00:00 2001
From: Gabriel Mazetto <brodock@gmail.com>
Date: Tue, 31 Oct 2017 02:00:40 +0100
Subject: Code Style changes and `hashed_storage?` now receives optional
 feature

---
 app/models/project.rb                | 28 ++++++++++++++++++++++++----
 app/models/storage/hashed_project.rb | 13 -------------
 app/models/storage/legacy_project.rb |  7 -------
 spec/models/project_spec.rb          | 18 ++++++++++++++++--
 4 files changed, 40 insertions(+), 26 deletions(-)

diff --git a/app/models/project.rb b/app/models/project.rb
index d9bd6362e70..a43d1a7f484 100644
--- a/app/models/project.rb
+++ b/app/models/project.rb
@@ -26,10 +26,15 @@ class Project < ActiveRecord::Base
 
   NUMBER_OF_PERMITTED_BOARDS = 1
   UNKNOWN_IMPORT_URL = 'http://unknown.git'.freeze
-  # Hashed Storage versions handle rolling out new storage to project and dependents models
+  # Hashed Storage versions handle rolling out new storage to project and dependents models:
+  # nil: legacy
   # 1: repository
   # 2: attachments
   LATEST_STORAGE_VERSION = 2
+  HASHED_STORAGE_FEATURES = {
+    repository: 1,
+    attachments: 2
+  }.freeze
 
   cache_markdown_field :description, pipeline: :description
 
@@ -1387,7 +1392,7 @@ class Project < ActiveRecord::Base
     if storage.rename_repo
       Gitlab::AppLogger.info "Project was renamed: #{full_path_was} -> #{new_full_path}"
       rename_repo_notify!
-      storage.after_rename_repo
+      after_rename_repo
     else
       Rails.logger.error "Repository could not be renamed: #{full_path_was} -> #{new_full_path}"
 
@@ -1397,6 +1402,19 @@ class Project < ActiveRecord::Base
     end
   end
 
+  def after_rename_repo
+    path_before_change = previous_changes['path'].first
+
+    # We need to check if project had been rolled out to move resource to hashed storage or not and decide
+    # if we need execute any take action or no-op.
+
+    unless hashed_storage?(:attachments)
+      Gitlab::UploadsTransfer.new.rename_project(path_before_change, self.path, namespace.full_path)
+    end
+
+    Gitlab::PagesTransfer.new.rename_project(path_before_change, self.path, namespace.full_path)
+  end
+
   def rename_repo_notify!
     send_move_instructions(full_path_was)
     expires_full_path_cache
@@ -1596,8 +1614,10 @@ class Project < ActiveRecord::Base
     [nil, 0].include?(self.storage_version)
   end
 
-  def hashed_storage?
-    self.storage_version && self.storage_version >= 1
+  def hashed_storage?(feature=:repository)
+    raise ArgumentError, "Invalid feature" unless HASHED_STORAGE_FEATURES.include?(feature)
+
+    self.storage_version && self.storage_version >= HASHED_STORAGE_FEATURES[feature]
   end
 
   def renamed?
diff --git a/app/models/storage/hashed_project.rb b/app/models/storage/hashed_project.rb
index 6be365166c4..f025f40994e 100644
--- a/app/models/storage/hashed_project.rb
+++ b/app/models/storage/hashed_project.rb
@@ -32,19 +32,6 @@ module Storage
       true
     end
 
-    def after_rename_repo
-      path_before_change = project.previous_changes['path'].first
-
-      # We need to check if project had been rolled out to move resource to hashed storage or not and decide
-      # if we need execute any take action or no-op.
-
-      unless project.storage_version >= 2
-        Gitlab::UploadsTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
-      end
-
-      Gitlab::PagesTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
-    end
-
     private
 
     # Generates the hash for the project path and name on disk
diff --git a/app/models/storage/legacy_project.rb b/app/models/storage/legacy_project.rb
index 6e7dce8d25a..9d9e5e1d352 100644
--- a/app/models/storage/legacy_project.rb
+++ b/app/models/storage/legacy_project.rb
@@ -47,12 +47,5 @@ module Storage
 
       false
     end
-
-    def after_rename_repo
-      path_before_change = project.previous_changes['path'].first
-
-      Gitlab::UploadsTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
-      Gitlab::PagesTransfer.new.rename_project(path_before_change, project.path, project.namespace.full_path)
-    end
   end
 end
diff --git a/spec/models/project_spec.rb b/spec/models/project_spec.rb
index d80af378140..fb5d0f9db9c 100644
--- a/spec/models/project_spec.rb
+++ b/spec/models/project_spec.rb
@@ -2630,8 +2630,22 @@ describe Project do
     end
 
     describe '#hashed_storage?' do
-      it 'returns true' do
-        expect(project.hashed_storage?).to be_truthy
+      context 'without specifying feature' do
+        it 'returns true' do
+          expect(project.hashed_storage?).to be_truthy
+        end
+      end
+
+      context 'specifying feature' do
+        it 'returns true if rolled out' do
+          expect(project.hashed_storage?(:attachments)).to be_truthy
+        end
+
+        it 'returns false when not rolled out yet' do
+          project.storage_version = 1
+
+          expect(project.hashed_storage?(:attachments)).to be_falsey
+        end
       end
     end
 
-- 
cgit v1.2.1


From 9edb22282582d3303306f298f9336db3c59b5e02 Mon Sep 17 00:00:00 2001
From: Eric Eastwood <contact@ericeastwood.com>
Date: Mon, 30 Oct 2017 04:21:38 -0400
Subject: Fix overlap of right-sidebar and wiki create page form

Fix https://gitlab.com/gitlab-org/gitlab-ce/issues/39509
---
 app/helpers/nav_helper.rb                                       | 6 +-----
 changelogs/unreleased/39509-fix-wiki-create-sidebar-overlap.yml | 5 +++++
 2 files changed, 6 insertions(+), 5 deletions(-)
 create mode 100644 changelogs/unreleased/39509-fix-wiki-create-sidebar-overlap.yml

diff --git a/app/helpers/nav_helper.rb b/app/helpers/nav_helper.rb
index 5a74511afa7..8ada746b244 100644
--- a/app/helpers/nav_helper.rb
+++ b/app/helpers/nav_helper.rb
@@ -19,11 +19,7 @@ module NavHelper
       end
     elsif current_path?('jobs#show')
       %w[page-gutter build-sidebar right-sidebar-expanded]
-    elsif current_path?('wikis#show') ||
-        current_path?('wikis#edit') ||
-        current_path?('wikis#update') ||
-        current_path?('wikis#history') ||
-        current_path?('wikis#git_access')
+    elsif current_controller?('wikis') && current_action?('show', 'create', 'edit', 'update', 'history', 'git_access')
       %w[page-gutter wiki-sidebar right-sidebar-expanded]
     else
       []
diff --git a/changelogs/unreleased/39509-fix-wiki-create-sidebar-overlap.yml b/changelogs/unreleased/39509-fix-wiki-create-sidebar-overlap.yml
new file mode 100644
index 00000000000..aebf6363d97
--- /dev/null
+++ b/changelogs/unreleased/39509-fix-wiki-create-sidebar-overlap.yml
@@ -0,0 +1,5 @@
+---
+title: Fix overlap of right-sidebar and main content when creating a Wiki page
+merge_request:
+author:
+type: fixed
-- 
cgit v1.2.1


From 662f87ca372515f0b739796b31c7e242f1ebcd7f Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Tue, 31 Oct 2017 09:06:23 +0000
Subject: spec fixes

---
 app/assets/stylesheets/pages/repo.scss                      | 5 +++++
 spec/features/projects/tree/create_file_spec.rb             | 2 --
 spec/javascripts/repo/components/new_dropdown/modal_spec.js | 2 ++
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index 44831288541..45aaeb77a48 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -32,6 +32,7 @@
   }
 
   .tree-content-holder {
+    display: -webkit-flex;
     display: flex;
     min-height: 300px;
   }
@@ -134,6 +135,10 @@
           vertical-align: middle;
           text-decoration: none;
           margin-right: 12px;
+
+          &:focus {
+            outline: none;
+          }
         }
 
         .close-btn {
diff --git a/spec/features/projects/tree/create_file_spec.rb b/spec/features/projects/tree/create_file_spec.rb
index a67ec891e7c..ed3b52a5790 100644
--- a/spec/features/projects/tree/create_file_spec.rb
+++ b/spec/features/projects/tree/create_file_spec.rb
@@ -28,8 +28,6 @@ feature 'Multi-file editor new file', :js do
       click_button('Create file')
     end
 
-    find('.inputarea').send_keys('file content')
-
     fill_in('commit-message', with: 'commit message')
 
     click_button('Commit 1 file')
diff --git a/spec/javascripts/repo/components/new_dropdown/modal_spec.js b/spec/javascripts/repo/components/new_dropdown/modal_spec.js
index ed0a443fded..1ff7590ec79 100644
--- a/spec/javascripts/repo/components/new_dropdown/modal_spec.js
+++ b/spec/javascripts/repo/components/new_dropdown/modal_spec.js
@@ -19,6 +19,7 @@ describe('new file modal component', () => {
       beforeEach(() => {
         vm = createComponentWithStore(Component, store, {
           type,
+          path: '',
         }).$mount();
 
         vm.entryName = 'testing';
@@ -187,6 +188,7 @@ describe('new file modal component', () => {
 
     vm = createComponentWithStore(Component, store, {
       type: 'tree',
+      path: '',
     }).$mount('.js-test');
 
     expect(document.activeElement).toBe(vm.$refs.fieldName);
-- 
cgit v1.2.1


From 980f29716f86a261e28dbc69de157a53c3eadb42 Mon Sep 17 00:00:00 2001
From: Tim Zallmann <tzallmann@gitlab.com>
Date: Tue, 31 Oct 2017 09:18:30 +0000
Subject: Resolve "Convert autosize.js library to be a Yarn managed library"

---
 app/assets/javascripts/behaviors/autosize.js       |   6 +-
 app/assets/javascripts/notes.js                    |   4 +-
 .../notes/components/issue_comment_form.vue        |   4 +-
 package.json                                       |   1 +
 spec/javascripts/gl_form_spec.js                   |   4 +-
 spec/javascripts/merge_request_notes_spec.js       |   2 +-
 .../notes/components/issue_comment_form_spec.js    |   6 +-
 spec/javascripts/notes_spec.js                     |   2 +-
 vendor/assets/javascripts/autosize.js              | 243 ---------------------
 yarn.lock                                          |   4 +
 10 files changed, 19 insertions(+), 257 deletions(-)
 delete mode 100644 vendor/assets/javascripts/autosize.js

diff --git a/app/assets/javascripts/behaviors/autosize.js b/app/assets/javascripts/behaviors/autosize.js
index e00af4b2fa8..add43b81f6d 100644
--- a/app/assets/javascripts/behaviors/autosize.js
+++ b/app/assets/javascripts/behaviors/autosize.js
@@ -1,8 +1,8 @@
-import autosize from 'vendor/autosize';
+import Autosize from 'autosize';
 
 document.addEventListener('DOMContentLoaded', () => {
   const autosizeEls = document.querySelectorAll('.js-autosize');
 
-  autosize(autosizeEls);
-  autosize.update(autosizeEls);
+  Autosize(autosizeEls);
+  Autosize.update(autosizeEls);
 });
diff --git a/app/assets/javascripts/notes.js b/app/assets/javascripts/notes.js
index ab101a56db8..705bec23b53 100644
--- a/app/assets/javascripts/notes.js
+++ b/app/assets/javascripts/notes.js
@@ -12,7 +12,7 @@ newline-per-chained-call, no-useless-escape, class-methods-use-this */
 import $ from 'jquery';
 import _ from 'underscore';
 import Cookies from 'js-cookie';
-import autosize from 'vendor/autosize';
+import Autosize from 'autosize';
 import 'vendor/jquery.caret'; // required by jquery.atwho
 import 'vendor/jquery.atwho';
 import AjaxCache from '~/lib/utils/ajax_cache';
@@ -25,7 +25,7 @@ import TaskList from './task_list';
 import { ajaxPost, isInViewport, getPagePath, scrollToElement, isMetaKey } from './lib/utils/common_utils';
 import imageDiffHelper from './image_diff/helpers/index';
 
-window.autosize = autosize;
+window.autosize = Autosize;
 
 function normalizeNewlines(str) {
   return str.replace(/\r\n/g, '\n');
diff --git a/app/assets/javascripts/notes/components/issue_comment_form.vue b/app/assets/javascripts/notes/components/issue_comment_form.vue
index ad384a1cc36..db8f85759b2 100644
--- a/app/assets/javascripts/notes/components/issue_comment_form.vue
+++ b/app/assets/javascripts/notes/components/issue_comment_form.vue
@@ -1,7 +1,7 @@
 <script>
   import { mapActions, mapGetters } from 'vuex';
   import _ from 'underscore';
-  import autosize from 'vendor/autosize';
+  import Autosize from 'autosize';
   import Flash from '../../flash';
   import Autosave from '../../autosave';
   import TaskList from '../../task_list';
@@ -219,7 +219,7 @@
       },
       resizeTextarea() {
         this.$nextTick(() => {
-          autosize.update(this.$refs.textarea);
+          Autosize.update(this.$refs.textarea);
         });
       },
     },
diff --git a/package.json b/package.json
index 057cd8f7bc7..376c47ba796 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
     "webpack-prod": "NODE_ENV=production webpack --config config/webpack.config.js"
   },
   "dependencies": {
+    "autosize": "^4.0.0",
     "axios": "^0.16.2",
     "babel-core": "^6.22.1",
     "babel-eslint": "^7.2.1",
diff --git a/spec/javascripts/gl_form_spec.js b/spec/javascripts/gl_form_spec.js
index 124fc030774..5a8009e57fd 100644
--- a/spec/javascripts/gl_form_spec.js
+++ b/spec/javascripts/gl_form_spec.js
@@ -1,9 +1,9 @@
-import autosize from 'vendor/autosize';
+import Autosize from 'autosize';
 import GLForm from '~/gl_form';
 import '~/lib/utils/text_utility';
 import '~/lib/utils/common_utils';
 
-window.autosize = autosize;
+window.autosize = Autosize;
 
 describe('GLForm', () => {
   describe('when instantiated', function () {
diff --git a/spec/javascripts/merge_request_notes_spec.js b/spec/javascripts/merge_request_notes_spec.js
index ac6ace48108..6054b75d0b8 100644
--- a/spec/javascripts/merge_request_notes_spec.js
+++ b/spec/javascripts/merge_request_notes_spec.js
@@ -1,6 +1,6 @@
 /* global Notes */
 
-import 'vendor/autosize';
+import 'autosize';
 import '~/gl_form';
 import '~/lib/utils/text_utility';
 import '~/render_gfm';
diff --git a/spec/javascripts/notes/components/issue_comment_form_spec.js b/spec/javascripts/notes/components/issue_comment_form_spec.js
index 3f659af5c3b..a26fc8f63cc 100644
--- a/spec/javascripts/notes/components/issue_comment_form_spec.js
+++ b/spec/javascripts/notes/components/issue_comment_form_spec.js
@@ -1,5 +1,5 @@
 import Vue from 'vue';
-import autosize from 'vendor/autosize';
+import Autosize from 'autosize';
 import store from '~/notes/stores';
 import issueCommentForm from '~/notes/components/issue_comment_form.vue';
 import { loggedOutIssueData, notesDataMock, userDataMock, issueDataMock } from '../mock_data';
@@ -97,14 +97,14 @@ describe('issue_comment_form component', () => {
       });
 
       it('should resize textarea after note discarded', (done) => {
-        spyOn(autosize, 'update');
+        spyOn(Autosize, 'update');
         spyOn(vm, 'discard').and.callThrough();
 
         vm.note = 'foo';
         vm.discard();
 
         Vue.nextTick(() => {
-          expect(autosize.update).toHaveBeenCalled();
+          expect(Autosize.update).toHaveBeenCalled();
           done();
         });
       });
diff --git a/spec/javascripts/notes_spec.js b/spec/javascripts/notes_spec.js
index 4546b88e44d..53d8faae911 100644
--- a/spec/javascripts/notes_spec.js
+++ b/spec/javascripts/notes_spec.js
@@ -1,7 +1,7 @@
 /* eslint-disable space-before-function-paren, no-unused-expressions, no-var, object-shorthand, comma-dangle, max-len */
 /* global Notes */
 
-import 'vendor/autosize';
+import 'autosize';
 import '~/gl_form';
 import '~/lib/utils/text_utility';
 import '~/render_gfm';
diff --git a/vendor/assets/javascripts/autosize.js b/vendor/assets/javascripts/autosize.js
deleted file mode 100644
index cfa49e72c50..00000000000
--- a/vendor/assets/javascripts/autosize.js
+++ /dev/null
@@ -1,243 +0,0 @@
-/*!
-	Autosize 3.0.14
-	license: MIT
-	http://www.jacklmoore.com/autosize
-*/
-(function (global, factory) {
-	if (typeof define === 'function' && define.amd) {
-		define(['exports', 'module'], factory);
-	} else if (typeof exports !== 'undefined' && typeof module !== 'undefined') {
-		factory(exports, module);
-	} else {
-		var mod = {
-			exports: {}
-		};
-		factory(mod.exports, mod);
-		global.autosize = mod.exports;
-	}
-})(this, function (exports, module) {
-	'use strict';
-
-	var set = typeof Set === 'function' ? new Set() : (function () {
-		var list = [];
-
-		return {
-			has: function has(key) {
-				return Boolean(list.indexOf(key) > -1);
-			},
-			add: function add(key) {
-				list.push(key);
-			},
-			'delete': function _delete(key) {
-				list.splice(list.indexOf(key), 1);
-			} };
-	})();
-
-	function assign(ta) {
-		var _ref = arguments[1] === undefined ? {} : arguments[1];
-
-		var _ref$setOverflowX = _ref.setOverflowX;
-		var setOverflowX = _ref$setOverflowX === undefined ? true : _ref$setOverflowX;
-		var _ref$setOverflowY = _ref.setOverflowY;
-		var setOverflowY = _ref$setOverflowY === undefined ? true : _ref$setOverflowY;
-
-		if (!ta || !ta.nodeName || ta.nodeName !== 'TEXTAREA' || set.has(ta)) return;
-
-		var heightOffset = null;
-		var overflowY = null;
-		var clientWidth = ta.clientWidth;
-
-		function init() {
-			var style = window.getComputedStyle(ta, null);
-
-			overflowY = style.overflowY;
-
-			if (style.resize === 'vertical') {
-				ta.style.resize = 'none';
-			} else if (style.resize === 'both') {
-				ta.style.resize = 'horizontal';
-			}
-
-			if (style.boxSizing === 'content-box') {
-				heightOffset = -(parseFloat(style.paddingTop) + parseFloat(style.paddingBottom));
-			} else {
-				heightOffset = parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth);
-			}
-			// Fix when a textarea is not on document body and heightOffset is Not a Number
-			if (isNaN(heightOffset)) {
-				heightOffset = 0;
-			}
-
-			update();
-		}
-
-		function changeOverflow(value) {
-			{
-				// Chrome/Safari-specific fix:
-				// When the textarea y-overflow is hidden, Chrome/Safari do not reflow the text to account for the space
-				// made available by removing the scrollbar. The following forces the necessary text reflow.
-				var width = ta.style.width;
-				ta.style.width = '0px';
-				// Force reflow:
-				/* jshint ignore:start */
-				ta.offsetWidth;
-				/* jshint ignore:end */
-				ta.style.width = width;
-			}
-
-			overflowY = value;
-
-			if (setOverflowY) {
-				ta.style.overflowY = value;
-			}
-
-			resize();
-		}
-
-		function resize() {
-			var htmlTop = window.pageYOffset;
-			var bodyTop = document.body.scrollTop;
-			var originalHeight = ta.style.height;
-
-			ta.style.height = 'auto';
-
-			var endHeight = ta.scrollHeight + heightOffset;
-
-			if (ta.scrollHeight === 0) {
-				// If the scrollHeight is 0, then the element probably has display:none or is detached from the DOM.
-				ta.style.height = originalHeight;
-				return;
-			}
-
-			ta.style.height = endHeight + 'px';
-
-			// used to check if an update is actually necessary on window.resize
-			clientWidth = ta.clientWidth;
-
-			// prevents scroll-position jumping
-			document.documentElement.scrollTop = htmlTop;
-			document.body.scrollTop = bodyTop;
-		}
-
-		function update() {
-			var startHeight = ta.style.height;
-
-			resize();
-
-			var style = window.getComputedStyle(ta, null);
-
-			if (style.height !== ta.style.height) {
-				if (overflowY !== 'visible') {
-					changeOverflow('visible');
-				}
-			} else {
-				if (overflowY !== 'hidden') {
-					changeOverflow('hidden');
-				}
-			}
-
-			if (startHeight !== ta.style.height) {
-				var evt = document.createEvent('Event');
-				evt.initEvent('autosize:resized', true, false);
-				ta.dispatchEvent(evt);
-			}
-		}
-
-		var pageResize = function pageResize() {
-			if (ta.clientWidth !== clientWidth) {
-				update();
-			}
-		};
-
-		var destroy = (function (style) {
-			window.removeEventListener('resize', pageResize, false);
-			ta.removeEventListener('input', update, false);
-			ta.removeEventListener('keyup', update, false);
-			ta.removeEventListener('autosize:destroy', destroy, false);
-			ta.removeEventListener('autosize:update', update, false);
-			set['delete'](ta);
-
-			Object.keys(style).forEach(function (key) {
-				ta.style[key] = style[key];
-			});
-		}).bind(ta, {
-			height: ta.style.height,
-			resize: ta.style.resize,
-			overflowY: ta.style.overflowY,
-			overflowX: ta.style.overflowX,
-			wordWrap: ta.style.wordWrap });
-
-		ta.addEventListener('autosize:destroy', destroy, false);
-
-		// IE9 does not fire onpropertychange or oninput for deletions,
-		// so binding to onkeyup to catch most of those events.
-		// There is no way that I know of to detect something like 'cut' in IE9.
-		if ('onpropertychange' in ta && 'oninput' in ta) {
-			ta.addEventListener('keyup', update, false);
-		}
-
-		window.addEventListener('resize', pageResize, false);
-		ta.addEventListener('input', update, false);
-		ta.addEventListener('autosize:update', update, false);
-		set.add(ta);
-
-		if (setOverflowX) {
-			ta.style.overflowX = 'hidden';
-			ta.style.wordWrap = 'break-word';
-		}
-
-		init();
-	}
-
-	function destroy(ta) {
-		if (!(ta && ta.nodeName && ta.nodeName === 'TEXTAREA')) return;
-		var evt = document.createEvent('Event');
-		evt.initEvent('autosize:destroy', true, false);
-		ta.dispatchEvent(evt);
-	}
-
-	function update(ta) {
-		if (!(ta && ta.nodeName && ta.nodeName === 'TEXTAREA')) return;
-		var evt = document.createEvent('Event');
-		evt.initEvent('autosize:update', true, false);
-		ta.dispatchEvent(evt);
-	}
-
-	var autosize = null;
-
-	// Do nothing in Node.js environment and IE8 (or lower)
-	if (typeof window === 'undefined' || typeof window.getComputedStyle !== 'function') {
-		autosize = function (el) {
-			return el;
-		};
-		autosize.destroy = function (el) {
-			return el;
-		};
-		autosize.update = function (el) {
-			return el;
-		};
-	} else {
-		autosize = function (el, options) {
-			if (el) {
-				Array.prototype.forEach.call(el.length ? el : [el], function (x) {
-					return assign(x, options);
-				});
-			}
-			return el;
-		};
-		autosize.destroy = function (el) {
-			if (el) {
-				Array.prototype.forEach.call(el.length ? el : [el], destroy);
-			}
-			return el;
-		};
-		autosize.update = function (el) {
-			if (el) {
-				Array.prototype.forEach.call(el.length ? el : [el], update);
-			}
-			return el;
-		};
-	}
-
-	module.exports = autosize;
-});
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index 91ffbe5d4b0..1d4538b0b94 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -248,6 +248,10 @@ autoprefixer@^6.3.1:
     postcss "^5.2.16"
     postcss-value-parser "^3.2.3"
 
+autosize@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/autosize/-/autosize-4.0.0.tgz#7a0599b1ba84d73bd7589b0d9da3870152c69237"
+
 aws-sign2@~0.6.0:
   version "0.6.0"
   resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.6.0.tgz#14342dd38dbcc94d0e5b87d763cd63612c0e794f"
-- 
cgit v1.2.1


From 307883a5eb582ac203fe0777fcb11fa7d6c3ddca Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Tue, 31 Oct 2017 10:18:56 +0000
Subject: get branch name from the DOM

---
 app/assets/javascripts/repo/index.js  | 5 +++--
 app/views/shared/repo/_repo.html.haml | 1 +
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/repo/index.js b/app/assets/javascripts/repo/index.js
index 480d46eab81..b6801af7fcb 100644
--- a/app/assets/javascripts/repo/index.js
+++ b/app/assets/javascripts/repo/index.js
@@ -9,6 +9,8 @@ import store from './stores';
 import Translate from '../vue_shared/translate';
 
 function initRepo(el) {
+  if (!el) return null;
+
   return new Vue({
     el,
     store,
@@ -38,8 +40,7 @@ function initRepo(el) {
         onTopOfBranch: convertPermissionToBoolean(data.onTopOfBranch),
         currentRef: data.ref,
         path: data.currentPath,
-        // TODO: get through data attribute
-        currentBranch: document.querySelector('.js-project-refs-dropdown').dataset.ref,
+        currentBranch: data.currentBranch,
         isRoot: convertPermissionToBoolean(data.root),
         isInitialRoot: convertPermissionToBoolean(data.root),
       });
diff --git a/app/views/shared/repo/_repo.html.haml b/app/views/shared/repo/_repo.html.haml
index c1ba1cfefba..5867ea58378 100644
--- a/app/views/shared/repo/_repo.html.haml
+++ b/app/views/shared/repo/_repo.html.haml
@@ -1,6 +1,7 @@
 #repo{ data: { root: @path.empty?.to_s,
                root_url: project_tree_path(project),
                url: content_url,
+               current_branch: @ref,
                ref: @commit.id,
                project_name: project.name,
                project_url: project_path(project),
-- 
cgit v1.2.1


From 68d1e9d1c42f34d3fb2d58779d862dcf47d5f17e Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Tue, 31 Oct 2017 10:47:10 +0000
Subject: Upload files through the multi-file editor

---
 .../repo/components/new_dropdown/index.vue         |  15 +++-
 .../repo/components/new_dropdown/modal.vue         |   6 +-
 .../repo/components/new_dropdown/upload.vue        |  67 ++++++++++++++
 .../repo/components/repo_commit_section.vue        |   1 +
 .../javascripts/repo/components/repo_preview.vue   |   7 ++
 app/assets/javascripts/repo/helpers/repo_helper.js |  31 +++++--
 .../javascripts/repo/services/repo_service.js      |   2 +-
 app/assets/stylesheets/framework/dropdowns.scss    |   3 +
 .../unreleased/ph-multi-file-upload-file.yml       |   5 ++
 spec/features/projects/tree/upload_file_spec.rb    |  48 ++++++++++
 .../repo/components/new_dropdown/index_spec.js     |  56 +++++++++---
 .../repo/components/new_dropdown/modal_spec.js     |   6 +-
 .../repo/components/new_dropdown/upload_spec.js    | 100 +++++++++++++++++++++
 13 files changed, 325 insertions(+), 22 deletions(-)
 create mode 100644 app/assets/javascripts/repo/components/new_dropdown/upload.vue
 create mode 100644 changelogs/unreleased/ph-multi-file-upload-file.yml
 create mode 100644 spec/features/projects/tree/upload_file_spec.rb
 create mode 100644 spec/javascripts/repo/components/new_dropdown/upload_spec.js

diff --git a/app/assets/javascripts/repo/components/new_dropdown/index.vue b/app/assets/javascripts/repo/components/new_dropdown/index.vue
index 3ccb50213ab..3a331ed805f 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/index.vue
@@ -3,10 +3,12 @@
   import RepoHelper from '../../helpers/repo_helper';
   import eventHub from '../../event_hub';
   import newModal from './modal.vue';
+  import upload from './upload.vue';
 
   export default {
     components: {
       newModal,
+      upload,
     },
     data() {
       return {
@@ -23,10 +25,12 @@
       toggleModalOpen() {
         this.openModal = !this.openModal;
       },
-      createNewEntryInStore(name, type) {
-        RepoHelper.createNewEntry(name, type);
+      createNewEntryInStore(options, openEditMode = true) {
+        RepoHelper.createNewEntry(options, openEditMode);
 
-        this.toggleModalOpen();
+        if (options.toggleModal) {
+          this.toggleModalOpen();
+        }
       },
     },
     created() {
@@ -64,6 +68,11 @@
               {{ __('New file') }}
             </a>
           </li>
+          <li>
+            <upload
+              :current-path="currentPath"
+            />
+          </li>
           <li>
             <a
               href="#"
diff --git a/app/assets/javascripts/repo/components/new_dropdown/modal.vue b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
index 5ef629e0dde..b49586de6bb 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/modal.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/modal.vue
@@ -24,7 +24,11 @@
     },
     methods: {
       createEntryInStore() {
-        eventHub.$emit('createNewEntry', this.entryName, this.type);
+        eventHub.$emit('createNewEntry', {
+          name: this.entryName,
+          type: this.type,
+          toggleModal: true,
+        });
       },
       toggleModalOpen() {
         this.$emit('toggle');
diff --git a/app/assets/javascripts/repo/components/new_dropdown/upload.vue b/app/assets/javascripts/repo/components/new_dropdown/upload.vue
new file mode 100644
index 00000000000..cbea9c08249
--- /dev/null
+++ b/app/assets/javascripts/repo/components/new_dropdown/upload.vue
@@ -0,0 +1,67 @@
+<script>
+  import eventHub from '../../event_hub';
+
+  export default {
+    props: {
+      currentPath: {
+        type: String,
+        required: true,
+      },
+    },
+    methods: {
+      createFile(target, file, isText) {
+        const { name } = file;
+        const nameWithPath = `${this.currentPath !== '' ? `${this.currentPath}/` : ''}${name}`;
+        let { result } = target;
+
+        if (!isText) {
+          result = result.split('base64,')[1];
+        }
+
+        eventHub.$emit('createNewEntry', {
+          name: nameWithPath,
+          type: 'blob',
+          content: result,
+          toggleModal: false,
+          base64: !isText,
+        }, isText);
+      },
+      readFile(file) {
+        const reader = new FileReader();
+        const isText = file.type.match(/text.*/) !== null;
+
+        reader.addEventListener('load', e => this.createFile(e.target, file, isText), { once: true });
+
+        if (isText) {
+          reader.readAsText(file);
+        } else {
+          reader.readAsDataURL(file);
+        }
+      },
+      openFile() {
+        Array.from(this.$refs.fileUpload.files).forEach(file => this.readFile(file));
+      },
+    },
+    mounted() {
+      this.$refs.fileUpload.addEventListener('change', this.openFile);
+    },
+    beforeDestroy() {
+      this.$refs.fileUpload.removeEventListener('change', this.openFile);
+    },
+  };
+</script>
+
+<template>
+  <label
+    role="button"
+    class="menu-item"
+  >
+    {{ __('Upload file') }}
+    <input
+      id="file-upload"
+      type="file"
+      class="hidden"
+      ref="fileUpload"
+    />
+  </label>
+</template>
diff --git a/app/assets/javascripts/repo/components/repo_commit_section.vue b/app/assets/javascripts/repo/components/repo_commit_section.vue
index 0d6259a37a8..649c69c43fd 100644
--- a/app/assets/javascripts/repo/components/repo_commit_section.vue
+++ b/app/assets/javascripts/repo/components/repo_commit_section.vue
@@ -52,6 +52,7 @@ export default {
         action: f.tempFile ? 'create' : 'update',
         file_path: f.path,
         content: f.newContent,
+        encoding: f.base64 ? 'base64' : 'text',
       }));
       const branch = newBranch ? `${this.currentBranch}-${this.currentShortHash}` : this.currentBranch;
       const payload = {
diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index b5be771d539..264694f01a2 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -49,6 +49,13 @@ export default {
     v-if="!activeFile.render_error"
     v-html="activeFile.html">
   </div>
+  <div
+    v-else-if="activeFile.tempFile"
+    class="vertical-center render-error">
+    <p class="text-center">
+      The source could not be displayed for this temporary file.
+    </p>
+  </div>
   <div
     v-else-if="activeFile.tooLarge"
     class="vertical-center render-error">
diff --git a/app/assets/javascripts/repo/helpers/repo_helper.js b/app/assets/javascripts/repo/helpers/repo_helper.js
index fb26f3b7380..1c677049b31 100644
--- a/app/assets/javascripts/repo/helpers/repo_helper.js
+++ b/app/assets/javascripts/repo/helpers/repo_helper.js
@@ -155,7 +155,7 @@ const RepoHelper = {
     if (newFile.render_error === 'too_large' || newFile.render_error === 'collapsed') {
       newFile.tooLarge = true;
     }
-    newFile.newContent = '';
+    newFile.newContent = file.newContent ? file.newContent : '';
 
     Store.addToOpenedFiles(newFile);
     Store.setActiveFiles(newFile);
@@ -276,7 +276,13 @@ const RepoHelper = {
   removeAllTmpFiles(storeFilesKey) {
     Store[storeFilesKey] = Store[storeFilesKey].filter(f => !f.tempFile);
   },
-  createNewEntry(name, type) {
+  createNewEntry(options, openEditMode = true) {
+    const {
+      name,
+      type,
+      content = '',
+      base64 = false,
+    } = options;
     const originalPath = Store.path;
     let entryName = name;
 
@@ -304,9 +310,24 @@ const RepoHelper = {
     if ((type === 'tree' && tree.tempFile) || type === 'blob') {
       const file = this.findOrCreateEntry('blob', tree, fileName);
 
-      if (!file.exists) {
-        this.setFile(file.entry, file.entry);
-        this.openEditMode();
+      if (file.exists) {
+        Flash(`The name "${file.entry.name}" is already taken in this directory.`);
+      } else {
+        const { entry } = file;
+        entry.newContent = content;
+        entry.base64 = base64;
+
+        if (entry.base64) {
+          entry.render_error = true;
+        }
+
+        this.setFile(entry, entry);
+
+        if (openEditMode) {
+          this.openEditMode();
+        } else {
+          file.entry.render_error = 'asdsad';
+        }
       }
     }
 
diff --git a/app/assets/javascripts/repo/services/repo_service.js b/app/assets/javascripts/repo/services/repo_service.js
index c9fa5cc8bf8..d003e2b0a5e 100644
--- a/app/assets/javascripts/repo/services/repo_service.js
+++ b/app/assets/javascripts/repo/services/repo_service.js
@@ -19,7 +19,7 @@ const RepoService = {
   getRaw(file) {
     if (file.tempFile) {
       return Promise.resolve({
-        data: '',
+        data: file.newContent ? file.newContent : '',
       });
     }
 
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index a9d804e735d..1aa53b8f8cf 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -776,12 +776,15 @@
       a,
       button,
       .menu-item {
+        margin-bottom: 0;
         border-radius: 0;
         box-shadow: none;
         padding: 8px 16px;
         text-align: left;
         white-space: normal;
         width: 100%;
+        font-weight: $gl-font-weight-normal;
+        line-height: normal;
 
         &.dropdown-menu-user-link {
           white-space: nowrap;
diff --git a/changelogs/unreleased/ph-multi-file-upload-file.yml b/changelogs/unreleased/ph-multi-file-upload-file.yml
new file mode 100644
index 00000000000..a2bd3cfe459
--- /dev/null
+++ b/changelogs/unreleased/ph-multi-file-upload-file.yml
@@ -0,0 +1,5 @@
+---
+title: Allow files to uploaded in the multi-file editor
+merge_request:
+author:
+type: added
diff --git a/spec/features/projects/tree/upload_file_spec.rb b/spec/features/projects/tree/upload_file_spec.rb
new file mode 100644
index 00000000000..7dbe4fd0aa5
--- /dev/null
+++ b/spec/features/projects/tree/upload_file_spec.rb
@@ -0,0 +1,48 @@
+require 'spec_helper'
+
+feature 'Multi-file editor upload file', :js do
+  include WaitForRequests
+
+  let(:user) { create(:user) }
+  let(:project) { create(:project, :repository) }
+  let(:txt_file) { File.join(Rails.root, 'spec', 'fixtures', 'doc_sample.txt') }
+  let(:img_file) { File.join(Rails.root, 'spec', 'fixtures', 'dk.png') }
+
+  before do
+    project.add_master(user)
+    sign_in(user)
+
+    page.driver.set_cookie('new_repo', 'true')
+
+    visit project_tree_path(project, :master)
+
+    wait_for_requests
+  end
+
+  it 'uploads text file' do
+    find('.add-to-tree').click
+
+    # make the field visible so capybara can use it
+    execute_script('document.querySelector("#file-upload").classList.remove("hidden")')
+    attach_file('file-upload', txt_file)
+
+    find('.add-to-tree').click
+
+    expect(page).to have_selector('.repo-tab', text: 'doc_sample.txt')
+    expect(page).to have_content(File.open(txt_file, &:readline))
+  end
+
+  it 'uploads image file' do
+    find('.add-to-tree').click
+
+    # make the field visible so capybara can use it
+    execute_script('document.querySelector("#file-upload").classList.remove("hidden")')
+    attach_file('file-upload', img_file)
+
+    find('.add-to-tree').click
+
+    expect(page).to have_selector('.repo-tab', text: 'dk.png')
+    expect(page).not_to have_selector('.monaco-editor')
+    expect(page).to have_content('The source could not be displayed for this temporary file.')
+  end
+end
diff --git a/spec/javascripts/repo/components/new_dropdown/index_spec.js b/spec/javascripts/repo/components/new_dropdown/index_spec.js
index ddbfdab582d..ddffef53300 100644
--- a/spec/javascripts/repo/components/new_dropdown/index_spec.js
+++ b/spec/javascripts/repo/components/new_dropdown/index_spec.js
@@ -74,25 +74,38 @@ describe('new dropdown component', () => {
         it('closes modal after creating file', () => {
           vm.openModal = true;
 
-          eventHub.$emit('createNewEntry', 'testing', type);
+          eventHub.$emit('createNewEntry', {
+            name: 'testing',
+            type,
+            toggleModal: true,
+          });
 
           expect(vm.openModal).toBeFalsy();
         });
 
         it('sets editMode to true', () => {
-          eventHub.$emit('createNewEntry', 'testing', type);
+          eventHub.$emit('createNewEntry', {
+            name: 'testing',
+            type,
+          });
 
           expect(RepoStore.editMode).toBeTruthy();
         });
 
         it('toggles blob view', () => {
-          eventHub.$emit('createNewEntry', 'testing', type);
+          eventHub.$emit('createNewEntry', {
+            name: 'testing',
+            type,
+          });
 
           expect(RepoStore.isPreviewView()).toBeFalsy();
         });
 
         it('adds file into activeFiles', () => {
-          eventHub.$emit('createNewEntry', 'testing', type);
+          eventHub.$emit('createNewEntry', {
+            name: 'testing',
+            type,
+          });
 
           expect(RepoStore.openedFiles.length).toBe(1);
         });
@@ -100,7 +113,10 @@ describe('new dropdown component', () => {
         it(`creates ${type} in the current stores path`, () => {
           RepoStore.path = 'testing';
 
-          eventHub.$emit('createNewEntry', 'testing/app', type);
+          eventHub.$emit('createNewEntry', {
+            name: 'testing/app',
+            type,
+          });
 
           expect(RepoStore.files[0].path).toBe('testing/app');
           expect(RepoStore.files[0].name).toBe('app');
@@ -116,7 +132,10 @@ describe('new dropdown component', () => {
 
     describe('file', () => {
       it('creates new file', () => {
-        eventHub.$emit('createNewEntry', 'testing', 'blob');
+        eventHub.$emit('createNewEntry', {
+          name: 'testing',
+          type: 'blob',
+        });
 
         expect(RepoStore.files.length).toBe(1);
         expect(RepoStore.files[0].name).toBe('testing');
@@ -129,7 +148,10 @@ describe('new dropdown component', () => {
           name: 'testing',
         }));
 
-        eventHub.$emit('createNewEntry', 'testing', 'blob');
+        eventHub.$emit('createNewEntry', {
+          name: 'testing',
+          type: 'blob',
+        });
 
         expect(RepoStore.files.length).toBe(1);
         expect(RepoStore.files[0].name).toBe('testing');
@@ -140,7 +162,10 @@ describe('new dropdown component', () => {
 
     describe('tree', () => {
       it('creates new tree', () => {
-        eventHub.$emit('createNewEntry', 'testing', 'tree');
+        eventHub.$emit('createNewEntry', {
+          name: 'testing',
+          type: 'tree',
+        });
 
         expect(RepoStore.files.length).toBe(1);
         expect(RepoStore.files[0].name).toBe('testing');
@@ -151,7 +176,10 @@ describe('new dropdown component', () => {
       });
 
       it('creates multiple trees when entryName has slashes', () => {
-        eventHub.$emit('createNewEntry', 'app/test', 'tree');
+        eventHub.$emit('createNewEntry', {
+          name: 'app/test',
+          type: 'tree',
+        });
 
         expect(RepoStore.files.length).toBe(1);
         expect(RepoStore.files[0].name).toBe('app');
@@ -164,7 +192,10 @@ describe('new dropdown component', () => {
           name: 'app',
         }));
 
-        eventHub.$emit('createNewEntry', 'app/test', 'tree');
+        eventHub.$emit('createNewEntry', {
+          name: 'app/test',
+          type: 'tree',
+        });
 
         expect(RepoStore.files.length).toBe(1);
         expect(RepoStore.files[0].name).toBe('app');
@@ -179,7 +210,10 @@ describe('new dropdown component', () => {
           name: 'app',
         }));
 
-        eventHub.$emit('createNewEntry', 'app', 'tree');
+        eventHub.$emit('createNewEntry', {
+          name: 'app',
+          type: 'tree',
+        });
 
         expect(RepoStore.files.length).toBe(1);
         expect(RepoStore.files[0].name).toBe('app');
diff --git a/spec/javascripts/repo/components/new_dropdown/modal_spec.js b/spec/javascripts/repo/components/new_dropdown/modal_spec.js
index 4c5cdc47c6e..d9fd9b9a595 100644
--- a/spec/javascripts/repo/components/new_dropdown/modal_spec.js
+++ b/spec/javascripts/repo/components/new_dropdown/modal_spec.js
@@ -70,7 +70,11 @@ describe('new file modal component', () => {
 
       vm.createEntryInStore();
 
-      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', 'testing', 'tree');
+      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', {
+        name: 'testing',
+        type: 'tree',
+        toggleModal: true,
+      });
     });
   });
 });
diff --git a/spec/javascripts/repo/components/new_dropdown/upload_spec.js b/spec/javascripts/repo/components/new_dropdown/upload_spec.js
new file mode 100644
index 00000000000..31878e9d327
--- /dev/null
+++ b/spec/javascripts/repo/components/new_dropdown/upload_spec.js
@@ -0,0 +1,100 @@
+import Vue from 'vue';
+import upload from '~/repo/components/new_dropdown/upload.vue';
+import eventHub from '~/repo/event_hub';
+import createComponent from '../../../helpers/vue_mount_component_helper';
+
+describe('new dropdown upload', () => {
+  let vm;
+
+  beforeEach(() => {
+    const Component = Vue.extend(upload);
+
+    vm = createComponent(Component, {
+      currentPath: '',
+    });
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  describe('readFile', () => {
+    beforeEach(() => {
+      spyOn(FileReader.prototype, 'readAsText');
+      spyOn(FileReader.prototype, 'readAsDataURL');
+    });
+
+    it('calls readAsText for text files', () => {
+      const file = {
+        type: 'text/html',
+      };
+
+      vm.readFile(file);
+
+      expect(FileReader.prototype.readAsText).toHaveBeenCalledWith(file);
+    });
+
+    it('calls readAsDataURL for non-text files', () => {
+      const file = {
+        type: 'images/png',
+      };
+
+      vm.readFile(file);
+
+      expect(FileReader.prototype.readAsDataURL).toHaveBeenCalledWith(file);
+    });
+  });
+
+  describe('createFile', () => {
+    const target = {
+      result: 'content',
+    };
+    const binaryTarget = {
+      result: 'base64,base64content',
+    };
+    const file = {
+      name: 'file',
+    };
+
+    beforeEach(() => {
+      spyOn(eventHub, '$emit');
+    });
+
+    it('emits createNewEntry event', () => {
+      vm.createFile(target, file, true);
+
+      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', {
+        name: 'file',
+        type: 'blob',
+        content: 'content',
+        toggleModal: false,
+        base64: false,
+      }, true);
+    });
+
+    it('createNewEntry event name contains current path', () => {
+      vm.currentPath = 'testing';
+      vm.createFile(target, file, true);
+
+      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', {
+        name: 'testing/file',
+        type: 'blob',
+        content: 'content',
+        toggleModal: false,
+        base64: false,
+      }, true);
+    });
+
+    it('splits content on base64 if binary', () => {
+      vm.createFile(binaryTarget, file, false);
+
+      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', {
+        name: 'file',
+        type: 'blob',
+        content: 'base64content',
+        toggleModal: false,
+        base64: true,
+      }, false);
+    });
+  });
+});
-- 
cgit v1.2.1


From b8ad3ec0144cc0593dcd1c86401ad4d1ba84fdf7 Mon Sep 17 00:00:00 2001
From: Lawrence <lawrence.chan03@gmail.com>
Date: Tue, 31 Oct 2017 10:48:12 +0000
Subject: Fix example typo.

---
 doc/api/pipelines.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/doc/api/pipelines.md b/doc/api/pipelines.md
index 890945cfc7e..a6631cab8c3 100644
--- a/doc/api/pipelines.md
+++ b/doc/api/pipelines.md
@@ -57,7 +57,7 @@ GET /projects/:id/pipelines/:pipeline_id
 | `pipeline_id` | integer | yes      | The ID of a pipeline   |
 
 ```
-curl --header "PRIVATE-TOKEN: 9koXpg98eAheJpvBs5tK" "https://gitlab.example.com/api/v4/projects/1/pipeline/46"
+curl --header "PRIVATE-TOKEN: 9koXpg98eAheJpvBs5tK" "https://gitlab.example.com/api/v4/projects/1/pipelines/46"
 ```
 
 Example of response
-- 
cgit v1.2.1


From ca01ee515ced41d43dc53dba0a9c63409b02f8dc Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Tue, 31 Oct 2017 10:54:06 +0000
Subject: Adds callback function to inital cluster request

---
 app/assets/javascripts/clusters.js            | 22 ++++++++++++++--------
 changelogs/unreleased/39639-clusters-poll.yml |  5 +++++
 2 files changed, 19 insertions(+), 8 deletions(-)
 create mode 100644 changelogs/unreleased/39639-clusters-poll.yml

diff --git a/app/assets/javascripts/clusters.js b/app/assets/javascripts/clusters.js
index 180aa30e98c..661870c226c 100644
--- a/app/assets/javascripts/clusters.js
+++ b/app/assets/javascripts/clusters.js
@@ -64,19 +64,16 @@ export default class Clusters {
     this.poll = new Poll({
       resource: this.service,
       method: 'fetchData',
-      successCallback: (data) => {
-        const { status, status_reason } = data.data;
-        this.updateContainer(status, status_reason);
-      },
-      errorCallback: () => {
-        Flash(s__('ClusterIntegration|Something went wrong on our end.'));
-      },
+      successCallback: data => this.handleSuccess(data),
+      errorCallback: () => Clusters.handleError(),
     });
 
     if (!Visibility.hidden()) {
       this.poll.makeRequest();
     } else {
-      this.service.fetchData();
+      this.service.fetchData()
+        .then(data => this.handleSuccess(data))
+        .catch(() => Clusters.handleError());
     }
 
     Visibility.change(() => {
@@ -88,6 +85,15 @@ export default class Clusters {
     });
   }
 
+  static handleError() {
+    Flash(s__('ClusterIntegration|Something went wrong on our end.'));
+  }
+
+  handleSuccess(data) {
+    const { status, status_reason } = data.data;
+    this.updateContainer(status, status_reason);
+  }
+
   hideAll() {
     this.errorContainer.classList.add('hidden');
     this.successContainer.classList.add('hidden');
diff --git a/changelogs/unreleased/39639-clusters-poll.yml b/changelogs/unreleased/39639-clusters-poll.yml
new file mode 100644
index 00000000000..f0a82f58b19
--- /dev/null
+++ b/changelogs/unreleased/39639-clusters-poll.yml
@@ -0,0 +1,5 @@
+---
+title: Adds callback functions for initial request in clusters page
+merge_request:
+author:
+type: fixed
-- 
cgit v1.2.1


From 9c41c7ac1ea2e9085424e3eb1fe9924243affb7c Mon Sep 17 00:00:00 2001
From: Gabriel Mazetto <brodock@gmail.com>
Date: Tue, 31 Oct 2017 11:31:57 +0100
Subject: Make `#hashed_storage?` require feature argument

---
 app/models/project.rb                                |  9 ++++++---
 .../projects/hashed_storage_migration_service.rb     |  2 +-
 spec/models/project_spec.rb                          | 20 ++++++--------------
 .../hashed_storage_migration_service_spec.rb         |  2 +-
 4 files changed, 14 insertions(+), 19 deletions(-)

diff --git a/app/models/project.rb b/app/models/project.rb
index a43d1a7f484..cc35ebca6ad 100644
--- a/app/models/project.rb
+++ b/app/models/project.rb
@@ -1614,7 +1614,10 @@ class Project < ActiveRecord::Base
     [nil, 0].include?(self.storage_version)
   end
 
-  def hashed_storage?(feature=:repository)
+  # Check if Hashed Storage is enabled for the project with at least informed feature rolled out
+  #
+  # @param [Symbol] feature that needs to be rolled out for the project (:repository, :attachments)
+  def hashed_storage?(feature)
     raise ArgumentError, "Invalid feature" unless HASHED_STORAGE_FEATURES.include?(feature)
 
     self.storage_version && self.storage_version >= HASHED_STORAGE_FEATURES[feature]
@@ -1653,7 +1656,7 @@ class Project < ActiveRecord::Base
   end
 
   def migrate_to_hashed_storage!
-    return if hashed_storage?
+    return if hashed_storage?(:repository)
 
     update!(repository_read_only: true)
 
@@ -1678,7 +1681,7 @@ class Project < ActiveRecord::Base
 
   def storage
     @storage ||=
-      if hashed_storage?
+      if hashed_storage?(:repository)
         Storage::HashedProject.new(self)
       else
         Storage::LegacyProject.new(self)
diff --git a/app/services/projects/hashed_storage_migration_service.rb b/app/services/projects/hashed_storage_migration_service.rb
index 41259de3a16..f5945f3b87f 100644
--- a/app/services/projects/hashed_storage_migration_service.rb
+++ b/app/services/projects/hashed_storage_migration_service.rb
@@ -10,7 +10,7 @@ module Projects
     end
 
     def execute
-      return if project.hashed_storage?
+      return if project.hashed_storage?(:repository)
 
       @old_disk_path = project.disk_path
       has_wiki = project.wiki.repository_exists?
diff --git a/spec/models/project_spec.rb b/spec/models/project_spec.rb
index fb5d0f9db9c..5eaff405c0e 100644
--- a/spec/models/project_spec.rb
+++ b/spec/models/project_spec.rb
@@ -2494,7 +2494,7 @@ describe Project do
 
     describe '#hashed_storage?' do
       it 'returns false' do
-        expect(project.hashed_storage?).to be_falsey
+        expect(project.hashed_storage?(:repository)).to be_falsey
       end
     end
 
@@ -2630,22 +2630,14 @@ describe Project do
     end
 
     describe '#hashed_storage?' do
-      context 'without specifying feature' do
-        it 'returns true' do
-          expect(project.hashed_storage?).to be_truthy
-        end
+      it 'returns true if rolled out' do
+        expect(project.hashed_storage?(:attachments)).to be_truthy
       end
 
-      context 'specifying feature' do
-        it 'returns true if rolled out' do
-          expect(project.hashed_storage?(:attachments)).to be_truthy
-        end
-
-        it 'returns false when not rolled out yet' do
-          project.storage_version = 1
+      it 'returns false when not rolled out yet' do
+        project.storage_version = 1
 
-          expect(project.hashed_storage?(:attachments)).to be_falsey
-        end
+        expect(project.hashed_storage?(:attachments)).to be_falsey
       end
     end
 
diff --git a/spec/services/projects/hashed_storage_migration_service_spec.rb b/spec/services/projects/hashed_storage_migration_service_spec.rb
index aa1988d29d6..b71b47c59b6 100644
--- a/spec/services/projects/hashed_storage_migration_service_spec.rb
+++ b/spec/services/projects/hashed_storage_migration_service_spec.rb
@@ -23,7 +23,7 @@ describe Projects::HashedStorageMigrationService do
       it 'updates project to be hashed and not read-only' do
         service.execute
 
-        expect(project.hashed_storage?).to be_truthy
+        expect(project.hashed_storage?(:repository)).to be_truthy
         expect(project.repository_read_only).to be_falsey
       end
 
-- 
cgit v1.2.1


From 9afa9b8d76434d6bb21b7ab87b4d22fe55ced6e5 Mon Sep 17 00:00:00 2001
From: Filipa Lacerda <filipa@gitlab.com>
Date: Tue, 31 Oct 2017 11:27:50 +0000
Subject: Enable eslint

---
 app/assets/javascripts/issue_status_select.js | 25 +++++++++++--------------
 1 file changed, 11 insertions(+), 14 deletions(-)

diff --git a/app/assets/javascripts/issue_status_select.js b/app/assets/javascripts/issue_status_select.js
index fabfd26e699..03546f61d1f 100644
--- a/app/assets/javascripts/issue_status_select.js
+++ b/app/assets/javascripts/issue_status_select.js
@@ -1,25 +1,22 @@
-/* eslint-disable func-names,wrap-iife, no-shadow, no-unused-vars, one-var */
 export default function issueStatusSelect() {
-  $('.js-issue-status').each(function (i, el) {
+  $('.js-issue-status').each((i, el) => {
     const fieldName = $(el).data('field-name');
     return $(el).glDropdown({
       selectable: true,
       fieldName,
-      toggleLabel: (function (_this) {
-        return function (selected, el, instance) {
-          let label = 'Author';
-          const $item = instance.dropdown.find('.is-active');
-          if ($item.length) {
-            label = $item.text();
-          }
-          return label;
-        };
-      })(this),
+      toggleLabel(selected, element, instance) {
+        let label = 'Author';
+        const $item = instance.dropdown.find('.is-active');
+        if ($item.length) {
+          label = $item.text();
+        }
+        return label;
+      },
       clicked(options) {
         return options.e.preventDefault();
       },
-      id(obj, el) {
-        return $(el).data('id');
+      id(obj, element) {
+        return $(element).data('id');
       },
     });
   });
-- 
cgit v1.2.1


From b3a0166203e4b187de8956a14b40957f7d967e32 Mon Sep 17 00:00:00 2001
From: Ahmad Sherif <me@ahmadsherif.com>
Date: Tue, 31 Oct 2017 12:38:15 +0200
Subject: Migrate Gitlab::Git::Wiki#delete_page to Gitaly

Closes gitaly#673
---
 GITALY_SERVER_VERSION                    |  2 +-
 Gemfile                                  |  2 +-
 Gemfile.lock                             |  4 ++--
 lib/gitlab/git/wiki.rb                   | 23 +++++++++++++++----
 lib/gitlab/gitaly_client/wiki_service.rb | 26 +++++++++++++++++-----
 spec/models/project_wiki_spec.rb         | 38 ++++++++++++++++++++------------
 spec/models/wiki_page_spec.rb            |  2 +-
 7 files changed, 69 insertions(+), 28 deletions(-)

diff --git a/GITALY_SERVER_VERSION b/GITALY_SERVER_VERSION
index 564edf82ddf..c5d4cee36a1 100644
--- a/GITALY_SERVER_VERSION
+++ b/GITALY_SERVER_VERSION
@@ -1 +1 @@
-0.50.0
+0.51.0
diff --git a/Gemfile b/Gemfile
index 8c9edf5c733..f9719749bbc 100644
--- a/Gemfile
+++ b/Gemfile
@@ -398,7 +398,7 @@ group :ed25519 do
 end
 
 # Gitaly GRPC client
-gem 'gitaly-proto', '~> 0.48.0', require: 'gitaly'
+gem 'gitaly-proto', '~> 0.51.0', require: 'gitaly'
 
 gem 'toml-rb', '~> 0.3.15', require: false
 
diff --git a/Gemfile.lock b/Gemfile.lock
index 34f4e6af7e7..0a94a9ce497 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -273,7 +273,7 @@ GEM
       po_to_json (>= 1.0.0)
       rails (>= 3.2.0)
     gherkin-ruby (0.3.2)
-    gitaly-proto (0.48.0)
+    gitaly-proto (0.51.0)
       google-protobuf (~> 3.1)
       grpc (~> 1.0)
     github-linguist (4.7.6)
@@ -1030,7 +1030,7 @@ DEPENDENCIES
   gettext (~> 3.2.2)
   gettext_i18n_rails (~> 1.8.0)
   gettext_i18n_rails_js (~> 1.2.0)
-  gitaly-proto (~> 0.48.0)
+  gitaly-proto (~> 0.51.0)
   github-linguist (~> 4.7.0)
   gitlab-flowdock-git-hook (~> 1.0.1)
   gitlab-markup (~> 1.6.2)
diff --git a/lib/gitlab/git/wiki.rb b/lib/gitlab/git/wiki.rb
index f01d5c96fc8..9b387a19388 100644
--- a/lib/gitlab/git/wiki.rb
+++ b/lib/gitlab/git/wiki.rb
@@ -35,10 +35,14 @@ module Gitlab
       end
 
       def delete_page(page_path, commit_details)
-        assert_type!(commit_details, CommitDetails)
-
-        gollum_wiki.delete_page(gollum_page_by_path(page_path), commit_details.to_h)
-        nil
+        @repository.gitaly_migrate(:wiki_delete_page) do |is_enabled|
+          if is_enabled
+            gitaly_delete_page(page_path, commit_details)
+            gollum_wiki.clear_cache
+          else
+            gollum_delete_page(page_path, commit_details)
+          end
+        end
       end
 
       def update_page(page_path, title, format, content, commit_details)
@@ -135,9 +139,20 @@ module Gitlab
         raise Gitlab::Git::Wiki::DuplicatePageError, e.message
       end
 
+      def gollum_delete_page(page_path, commit_details)
+        assert_type!(commit_details, CommitDetails)
+
+        gollum_wiki.delete_page(gollum_page_by_path(page_path), commit_details.to_h)
+        nil
+      end
+
       def gitaly_write_page(name, format, content, commit_details)
         gitaly_wiki_client.write_page(name, format, content, commit_details)
       end
+
+      def gitaly_delete_page(page_path, commit_details)
+        gitaly_wiki_client.delete_page(page_path, commit_details)
+      end
     end
   end
 end
diff --git a/lib/gitlab/gitaly_client/wiki_service.rb b/lib/gitlab/gitaly_client/wiki_service.rb
index 03afcce81f0..b7407dc1cc1 100644
--- a/lib/gitlab/gitaly_client/wiki_service.rb
+++ b/lib/gitlab/gitaly_client/wiki_service.rb
@@ -15,11 +15,7 @@ module Gitlab
           repository: @gitaly_repo,
           name: GitalyClient.encode(name),
           format: format.to_s,
-          commit_details: Gitaly::WikiCommitDetails.new(
-            name: GitalyClient.encode(commit_details.name),
-            email: GitalyClient.encode(commit_details.email),
-            message: GitalyClient.encode(commit_details.message)
-          )
+          commit_details: gitaly_commit_details(commit_details)
         )
 
         strio = StringIO.new(content)
@@ -40,6 +36,26 @@ module Gitlab
           raise Gitlab::Git::Wiki::DuplicatePageError, error
         end
       end
+
+      def delete_page(page_path, commit_details)
+        request = Gitaly::WikiDeletePageRequest.new(
+          repository: @gitaly_repo,
+          page_path: GitalyClient.encode(page_path),
+          commit_details: gitaly_commit_details(commit_details)
+        )
+
+        GitalyClient.call(@repository.storage, :wiki_service, :wiki_delete_page, request)
+      end
+
+      private
+
+      def gitaly_commit_details(commit_details)
+        Gitaly::WikiCommitDetails.new(
+          name: GitalyClient.encode(commit_details.name),
+          email: GitalyClient.encode(commit_details.email),
+          message: GitalyClient.encode(commit_details.message)
+        )
+      end
     end
   end
 end
diff --git a/spec/models/project_wiki_spec.rb b/spec/models/project_wiki_spec.rb
index f10d9383ae2..95d58b96f33 100644
--- a/spec/models/project_wiki_spec.rb
+++ b/spec/models/project_wiki_spec.rb
@@ -265,23 +265,33 @@ describe ProjectWiki do
   end
 
   describe "#delete_page" do
-    before do
-      create_page("index", "some content")
-      @page = subject.wiki.page(title: "index")
-    end
+    shared_examples 'deleting a wiki page' do
+      before do
+        create_page("index", "some content")
+        @page = subject.wiki.page(title: "index")
+      end
 
-    it "deletes the page" do
-      subject.delete_page(@page)
-      expect(subject.pages.count).to eq(0)
-    end
+      it "deletes the page" do
+        subject.delete_page(@page)
+        expect(subject.pages.count).to eq(0)
+      end
 
-    it 'updates project activity' do
-      subject.delete_page(@page)
+      it 'updates project activity' do
+        subject.delete_page(@page)
 
-      project.reload
+        project.reload
 
-      expect(project.last_activity_at).to be_within(1.minute).of(Time.now)
-      expect(project.last_repository_updated_at).to be_within(1.minute).of(Time.now)
+        expect(project.last_activity_at).to be_within(1.minute).of(Time.now)
+        expect(project.last_repository_updated_at).to be_within(1.minute).of(Time.now)
+      end
+    end
+
+    context 'when Gitaly wiki_delete_page is enabled' do
+      it_behaves_like 'deleting a wiki page'
+    end
+
+    context 'when Gitaly wiki_delete_page is disabled', :skip_gitaly_mock do
+      it_behaves_like 'deleting a wiki page'
     end
   end
 
@@ -343,6 +353,6 @@ describe ProjectWiki do
   end
 
   def destroy_page(page)
-    subject.delete_page(page, commit_details)
+    subject.delete_page(page, "test commit")
   end
 end
diff --git a/spec/models/wiki_page_spec.rb b/spec/models/wiki_page_spec.rb
index 1f14d06997e..a7227b38850 100644
--- a/spec/models/wiki_page_spec.rb
+++ b/spec/models/wiki_page_spec.rb
@@ -402,7 +402,7 @@ describe WikiPage do
 
   def destroy_page(title)
     page = wiki.wiki.page(title: title)
-    wiki.delete_page(page, commit_details)
+    wiki.delete_page(page, "test commit")
   end
 
   def get_slugs(page_or_dir)
-- 
cgit v1.2.1


From ef8217fbeee55c02b6bab3a8b273f8ffeaa21f74 Mon Sep 17 00:00:00 2001
From: James Lopez <james@jameslopez.es>
Date: Tue, 31 Oct 2017 12:56:16 +0100
Subject: fix missing issue assignees

---
 lib/gitlab/import_export/import_export.yml                  | 1 +
 spec/lib/gitlab/import_export/project.json                  | 8 +++++++-
 spec/lib/gitlab/import_export/project_tree_restorer_spec.rb | 4 ++++
 spec/lib/gitlab/import_export/project_tree_saver_spec.rb    | 4 ++++
 4 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/lib/gitlab/import_export/import_export.yml b/lib/gitlab/import_export/import_export.yml
index dec8b4c5acd..e68761066d8 100644
--- a/lib/gitlab/import_export/import_export.yml
+++ b/lib/gitlab/import_export/import_export.yml
@@ -19,6 +19,7 @@ project_tree:
     - milestone:
       - events:
         - :push_event_payload
+    - :issue_assignees
   - snippets:
     - :award_emoji
     - notes:
diff --git a/spec/lib/gitlab/import_export/project.json b/spec/lib/gitlab/import_export/project.json
index 1115fb218d6..4eb8afc08e3 100644
--- a/spec/lib/gitlab/import_export/project.json
+++ b/spec/lib/gitlab/import_export/project.json
@@ -43,7 +43,7 @@
   "issues": [
     {
       "id": 40,
-      "title": "Voluptatem amet doloribus deleniti eos maxime repudiandae molestias.",
+      "title": "Voluptatem",
       "assignee_id": 1,
       "author_id": 22,
       "project_id": 5,
@@ -70,6 +70,12 @@
         "updated_at": "2016-06-14T15:02:04.415Z",
         "state": "active",
         "iid": 1,
+        "issue_assignees": [
+          {
+            "user_id": 1,
+            "issue_id": 1
+          }
+        ]
         "events": [
           {
             "id": 487,
diff --git a/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb b/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb
index 4301eee17dc..a8eac318242 100644
--- a/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb
+++ b/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb
@@ -63,6 +63,10 @@ describe Gitlab::ImportExport::ProjectTreeRestorer do
         expect(issue.reload.updated_at.to_s).to eq('2016-06-14 15:02:47 UTC')
       end
 
+      it 'has issue assignees' do
+        expect(project.issues.where(title: 'Voluptatem').first.issue_assignees).not_to be_empty
+      end
+
       it 'contains the merge access levels on a protected branch' do
         expect(ProtectedBranch.first.merge_access_levels).not_to be_empty
       end
diff --git a/spec/lib/gitlab/import_export/project_tree_saver_spec.rb b/spec/lib/gitlab/import_export/project_tree_saver_spec.rb
index d9b86e1bf34..8da768ebd07 100644
--- a/spec/lib/gitlab/import_export/project_tree_saver_spec.rb
+++ b/spec/lib/gitlab/import_export/project_tree_saver_spec.rb
@@ -77,6 +77,10 @@ describe Gitlab::ImportExport::ProjectTreeSaver do
         expect(saved_project_json['issues'].first['notes']).not_to be_empty
       end
 
+      it 'has issue assignees' do
+        expect(saved_project_json['issues'].first['issue_assignees']).not_to be_empty
+      end
+
       it 'has author on issue comments' do
         expect(saved_project_json['issues'].first['notes'].first['author']).not_to be_empty
       end
-- 
cgit v1.2.1


From f2f24f05f804b732832e29c743e405985cdfc373 Mon Sep 17 00:00:00 2001
From: Phil Hughes <me@iamphill.com>
Date: Tue, 31 Oct 2017 12:13:29 +0000
Subject: fixed up upload feature after master merge

---
 .../repo/components/new_dropdown/index.vue         |  2 +-
 .../repo/components/new_dropdown/upload.vue        | 15 ++---
 .../repo/components/repo_commit_section.vue        |  1 +
 app/assets/javascripts/repo/stores/actions.js      |  4 +-
 app/assets/javascripts/repo/stores/actions/file.js | 10 +++-
 app/assets/javascripts/repo/stores/utils.js        |  9 ++-
 .../repo/components/new_dropdown/upload_spec.js    | 69 +++++++++++-----------
 7 files changed, 64 insertions(+), 46 deletions(-)

diff --git a/app/assets/javascripts/repo/components/new_dropdown/index.vue b/app/assets/javascripts/repo/components/new_dropdown/index.vue
index 9e1597add53..a5ee4f71281 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/index.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/index.vue
@@ -59,7 +59,7 @@
           </li>
           <li>
             <upload
-              :current-path="currentPath"
+              :path="path"
             />
           </li>
           <li>
diff --git a/app/assets/javascripts/repo/components/new_dropdown/upload.vue b/app/assets/javascripts/repo/components/new_dropdown/upload.vue
index cbea9c08249..14ad32f4ae0 100644
--- a/app/assets/javascripts/repo/components/new_dropdown/upload.vue
+++ b/app/assets/javascripts/repo/components/new_dropdown/upload.vue
@@ -1,30 +1,31 @@
 <script>
-  import eventHub from '../../event_hub';
+  import { mapActions } from 'vuex';
 
   export default {
     props: {
-      currentPath: {
+      path: {
         type: String,
         required: true,
       },
     },
     methods: {
+      ...mapActions([
+        'createTempEntry',
+      ]),
       createFile(target, file, isText) {
         const { name } = file;
-        const nameWithPath = `${this.currentPath !== '' ? `${this.currentPath}/` : ''}${name}`;
         let { result } = target;
 
         if (!isText) {
           result = result.split('base64,')[1];
         }
 
-        eventHub.$emit('createNewEntry', {
-          name: nameWithPath,
+        this.createTempEntry({
+          name,
           type: 'blob',
           content: result,
-          toggleModal: false,
           base64: !isText,
-        }, isText);
+        });
       },
       readFile(file) {
         const reader = new FileReader();
diff --git a/app/assets/javascripts/repo/components/repo_commit_section.vue b/app/assets/javascripts/repo/components/repo_commit_section.vue
index fb613e8af9d..377e3d65348 100644
--- a/app/assets/javascripts/repo/components/repo_commit_section.vue
+++ b/app/assets/javascripts/repo/components/repo_commit_section.vue
@@ -45,6 +45,7 @@ export default {
           action: f.tempFile ? 'create' : 'update',
           file_path: f.path,
           content: f.content,
+          encoding: f.base64 ? 'base64' : 'text',
         })),
         start_branch: createNewBranch ? this.currentBranch : undefined,
       };
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index 856a3994b37..ca2f2a5ce7a 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -88,13 +88,15 @@ export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =
   })
   .catch(() => flash('Error committing changes. Please try again.'));
 
-export const createTempEntry = ({ state, dispatch }, { name, type }) => {
+export const createTempEntry = ({ state, dispatch }, { name, type, content = '', base64 = false }) => {
   if (type === 'tree') {
     dispatch('createTempTree', name);
   } else if (type === 'blob') {
     dispatch('createTempFile', {
       tree: state,
       name,
+      base64,
+      content,
     });
   }
 };
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
index 013a0b3f4da..afbe0b78a82 100644
--- a/app/assets/javascripts/repo/stores/actions/file.js
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -80,16 +80,18 @@ export const changeFileContent = ({ commit }, { file, content }) => {
   commit(types.UPDATE_FILE_CONTENT, { file, content });
 };
 
-export const createTempFile = ({ state, commit, dispatch }, { tree, name }) => {
+export const createTempFile = ({ state, commit, dispatch }, { tree, name, content = '', base64 = '' }) => {
   const file = createTemp({
     name: name.replace(`${state.path}/`, ''),
     path: tree.path,
     type: 'blob',
     level: tree.level !== undefined ? tree.level + 1 : 0,
     changed: true,
+    content,
+    base64,
   });
 
-  if (findEntry(tree, 'blob', file.name)) return;
+  if (findEntry(tree, 'blob', file.name)) return flash(`The name "${file.name}" is already taken in this directory.`);
 
   commit(types.CREATE_TMP_FILE, {
     parent: tree,
@@ -98,7 +100,9 @@ export const createTempFile = ({ state, commit, dispatch }, { tree, name }) => {
   commit(types.TOGGLE_FILE_OPEN, file);
   dispatch('setFileActive', file);
 
-  if (!state.editMode) {
+  if (!state.editMode && !file.base64) {
     dispatch('toggleEditMode', true);
   }
+
+  return Promise.resolve(file);
 };
diff --git a/app/assets/javascripts/repo/stores/utils.js b/app/assets/javascripts/repo/stores/utils.js
index 5d5ee99ed43..797c2b1e5b9 100644
--- a/app/assets/javascripts/repo/stores/utils.js
+++ b/app/assets/javascripts/repo/stores/utils.js
@@ -24,6 +24,7 @@ export const dataStructure = () => ({
   content: '',
   parentTreeUrl: '',
   renderError: false,
+  base64: false,
 });
 
 export const decorateData = (entity, projectUrl = '') => {
@@ -37,12 +38,14 @@ export const decorateData = (entity, projectUrl = '') => {
     tree_url,
     path,
     renderError,
+    content = '',
     tempFile = false,
     active = false,
     opened = false,
     changed = false,
     parentTreeUrl = '',
     level = 0,
+    base64 = false,
   } = entity;
 
   return {
@@ -61,6 +64,8 @@ export const decorateData = (entity, projectUrl = '') => {
     parentTreeUrl,
     changed,
     renderError,
+    content,
+    base64,
     // eslint-disable-next-line camelcase
     lastCommit: last_commit ? {
       url: `${projectUrl}/commit/${last_commit.id}`,
@@ -83,7 +88,7 @@ export const pushState = (url) => {
   history.pushState({ url }, '', url);
 };
 
-export const createTemp = ({ name, path, type, level, changed, content }) => {
+export const createTemp = ({ name, path, type, level, changed, content, base64 }) => {
   const treePath = path ? `${path}/${name}` : name;
 
   return decorateData({
@@ -97,5 +102,7 @@ export const createTemp = ({ name, path, type, level, changed, content }) => {
     content,
     parentTreeUrl: '',
     level,
+    base64,
+    renderError: base64,
   });
 };
diff --git a/spec/javascripts/repo/components/new_dropdown/upload_spec.js b/spec/javascripts/repo/components/new_dropdown/upload_spec.js
index 31878e9d327..bf7893029b1 100644
--- a/spec/javascripts/repo/components/new_dropdown/upload_spec.js
+++ b/spec/javascripts/repo/components/new_dropdown/upload_spec.js
@@ -1,7 +1,8 @@
 import Vue from 'vue';
 import upload from '~/repo/components/new_dropdown/upload.vue';
-import eventHub from '~/repo/event_hub';
-import createComponent from '../../../helpers/vue_mount_component_helper';
+import store from '~/repo/stores';
+import { createComponentWithStore } from '../../../helpers/vue_mount_component_helper';
+import { resetStore } from '../../helpers';
 
 describe('new dropdown upload', () => {
   let vm;
@@ -9,13 +10,17 @@ describe('new dropdown upload', () => {
   beforeEach(() => {
     const Component = Vue.extend(upload);
 
-    vm = createComponent(Component, {
-      currentPath: '',
+    vm = createComponentWithStore(Component, store, {
+      path: '',
     });
+
+    vm.$mount();
   });
 
   afterEach(() => {
     vm.$destroy();
+
+    resetStore(vm.$store);
   });
 
   describe('readFile', () => {
@@ -56,45 +61,43 @@ describe('new dropdown upload', () => {
       name: 'file',
     };
 
-    beforeEach(() => {
-      spyOn(eventHub, '$emit');
-    });
-
-    it('emits createNewEntry event', () => {
+    it('creates new file', (done) => {
       vm.createFile(target, file, true);
 
-      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', {
-        name: 'file',
-        type: 'blob',
-        content: 'content',
-        toggleModal: false,
-        base64: false,
-      }, true);
+      vm.$nextTick(() => {
+        expect(vm.$store.state.tree.length).toBe(1);
+        expect(vm.$store.state.tree[0].name).toBe(file.name);
+        expect(vm.$store.state.tree[0].content).toBe(target.result);
+
+        done();
+      });
     });
 
-    it('createNewEntry event name contains current path', () => {
-      vm.currentPath = 'testing';
+    it('creates new file in path', (done) => {
+      vm.$store.state.path = 'testing';
       vm.createFile(target, file, true);
 
-      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', {
-        name: 'testing/file',
-        type: 'blob',
-        content: 'content',
-        toggleModal: false,
-        base64: false,
-      }, true);
+      vm.$nextTick(() => {
+        expect(vm.$store.state.tree.length).toBe(1);
+        expect(vm.$store.state.tree[0].name).toBe(file.name);
+        expect(vm.$store.state.tree[0].content).toBe(target.result);
+        expect(vm.$store.state.tree[0].path).toBe(`testing/${file.name}`);
+
+        done();
+      });
     });
 
-    it('splits content on base64 if binary', () => {
+    it('splits content on base64 if binary', (done) => {
       vm.createFile(binaryTarget, file, false);
 
-      expect(eventHub.$emit).toHaveBeenCalledWith('createNewEntry', {
-        name: 'file',
-        type: 'blob',
-        content: 'base64content',
-        toggleModal: false,
-        base64: true,
-      }, false);
+      vm.$nextTick(() => {
+        expect(vm.$store.state.tree.length).toBe(1);
+        expect(vm.$store.state.tree[0].name).toBe(file.name);
+        expect(vm.$store.state.tree[0].content).toBe(binaryTarget.result.split('base64,')[1]);
+        expect(vm.$store.state.tree[0].base64).toBe(true);
+
+        done();
+      });
     });
   });
 });
-- 
cgit v1.2.1


From 2994de75905f6078b334d919c64dfeb135e7d004 Mon Sep 17 00:00:00 2001
From: Zeger-Jan van de Weg <git@zjvandeweg.nl>
Date: Tue, 19 Sep 2017 09:17:22 +0200
Subject: Upgrade Ruby to 2.3.5

Part of gitlab-org/gitlab-ce#38040
---
 .gitlab-ci.yml                             | 6 +++---
 .ruby-version                              | 2 +-
 changelogs/unreleased/zj-ruby-2-3-5.yml    | 5 +++++
 lib/system_check/app/ruby_version_check.rb | 2 +-
 4 files changed, 10 insertions(+), 5 deletions(-)
 create mode 100644 changelogs/unreleased/zj-ruby-2-3-5.yml

diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index 87d73fc0c52..dc1e651d34b 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -1,7 +1,7 @@
-image: "dev.gitlab.org:5005/gitlab/gitlab-build-images:ruby-2.3.3-golang-1.8-git-2.13-phantomjs-2.1-node-8.x-yarn-1.0-postgresql-9.6"
+image: "dev.gitlab.org:5005/gitlab/gitlab-build-images:ruby-2.3.5-golang-1.8-git-2.13-phantomjs-2.1-node-8.x-yarn-1.0-postgresql-9.6"
 
 .default-cache: &default-cache
-  key: "ruby-233-with-yarn"
+  key: "ruby-235-with-yarn"
   paths:
     - vendor/ruby
     - .yarn-cache/
@@ -551,7 +551,7 @@ karma:
   <<: *dedicated-runner
   <<: *except-docs
   <<: *pull-cache
-  image: "dev.gitlab.org:5005/gitlab/gitlab-build-images:ruby-2.3.3-golang-1.8-git-2.13-chrome-61.0-node-8.x-yarn-1.0-postgresql-9.6"
+  image: "dev.gitlab.org:5005/gitlab/gitlab-build-images:ruby-2.3.5-golang-1.8-git-2.13-chrome-61.0-node-8.x-yarn-1.0-postgresql-9.6"
   stage: test
   variables:
     BABEL_ENV: "coverage"
diff --git a/.ruby-version b/.ruby-version
index 0bee604df76..cc6c9a491e0 100644
--- a/.ruby-version
+++ b/.ruby-version
@@ -1 +1 @@
-2.3.3
+2.3.5
diff --git a/changelogs/unreleased/zj-ruby-2-3-5.yml b/changelogs/unreleased/zj-ruby-2-3-5.yml
new file mode 100644
index 00000000000..09ec02417aa
--- /dev/null
+++ b/changelogs/unreleased/zj-ruby-2-3-5.yml
@@ -0,0 +1,5 @@
+---
+title: Upgrade Ruby to 2.3.5 to include security patches
+merge_request: 15099
+author:
+type: security
diff --git a/lib/system_check/app/ruby_version_check.rb b/lib/system_check/app/ruby_version_check.rb
index 08a2c495bd4..57bbabece1f 100644
--- a/lib/system_check/app/ruby_version_check.rb
+++ b/lib/system_check/app/ruby_version_check.rb
@@ -5,7 +5,7 @@ module SystemCheck
       set_check_pass -> { "yes (#{self.current_version})" }
 
       def self.required_version
-        @required_version ||= Gitlab::VersionInfo.new(2, 3, 3)
+        @required_version ||= Gitlab::VersionInfo.new(2, 3, 5)
       end
 
       def self.current_version
-- 
cgit v1.2.1


From a7829863c870bfb143cdf67f6b46584f09939c0d Mon Sep 17 00:00:00 2001
From: Zeger-Jan van de Weg <git@zjvandeweg.nl>
Date: Tue, 26 Sep 2017 11:30:28 +0200
Subject: Be able to bundle gems with newer rubies
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Rémy Coutable <remy@rymai.me>
---
 .gitlab-ci.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index dc1e651d34b..38fb743b0c9 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -455,7 +455,7 @@ db:migrate:reset-mysql:
   variables:
     SETUP_DB: "false"
   script:
-    - git fetch origin v8.14.10
+    - git fetch origin v9.3.0
     - git checkout -f FETCH_HEAD
     - bundle install $BUNDLE_INSTALL_FLAGS
     - cp config/gitlab.yml.example config/gitlab.yml
-- 
cgit v1.2.1


From 4bce563c6b66cffd87cd32921214148d4de541e0 Mon Sep 17 00:00:00 2001
From: James Lopez <james@jameslopez.es>
Date: Tue, 31 Oct 2017 14:26:51 +0100
Subject: fix specs

---
 spec/lib/gitlab/import_export/project.json                  | 12 ++++++------
 spec/lib/gitlab/import_export/project_tree_restorer_spec.rb |  2 +-
 spec/lib/gitlab/import_export/safe_model_attributes.yml     |  3 +++
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/spec/lib/gitlab/import_export/project.json b/spec/lib/gitlab/import_export/project.json
index 4eb8afc08e3..9a68bbb379c 100644
--- a/spec/lib/gitlab/import_export/project.json
+++ b/spec/lib/gitlab/import_export/project.json
@@ -60,6 +60,12 @@
       "due_date": null,
       "moved_to_id": null,
       "test_ee_field": "test",
+      "issue_assignees": [
+        {
+          "user_id": 1,
+          "issue_id": 1
+        }
+      ],
       "milestone": {
         "id": 1,
         "title": "test milestone",
@@ -70,12 +76,6 @@
         "updated_at": "2016-06-14T15:02:04.415Z",
         "state": "active",
         "iid": 1,
-        "issue_assignees": [
-          {
-            "user_id": 1,
-            "issue_id": 1
-          }
-        ]
         "events": [
           {
             "id": 487,
diff --git a/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb b/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb
index a8eac318242..76b01b6a1ec 100644
--- a/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb
+++ b/spec/lib/gitlab/import_export/project_tree_restorer_spec.rb
@@ -64,7 +64,7 @@ describe Gitlab::ImportExport::ProjectTreeRestorer do
       end
 
       it 'has issue assignees' do
-        expect(project.issues.where(title: 'Voluptatem').first.issue_assignees).not_to be_empty
+        expect(Issue.where(title: 'Voluptatem').first.issue_assignees).not_to be_empty
       end
 
       it 'contains the merge access levels on a protected branch' do
diff --git a/spec/lib/gitlab/import_export/safe_model_attributes.yml b/spec/lib/gitlab/import_export/safe_model_attributes.yml
index 121c0ed04ed..89d30407077 100644
--- a/spec/lib/gitlab/import_export/safe_model_attributes.yml
+++ b/spec/lib/gitlab/import_export/safe_model_attributes.yml
@@ -506,3 +506,6 @@ ProjectAutoDevops:
 - project_id
 - created_at
 - updated_at
+IssueAssignee:
+- user_id
+- issue_id
\ No newline at end of file
-- 
cgit v1.2.1


From 2f8577d45e996aaee078106686647a3034f1c78b Mon Sep 17 00:00:00 2001
From: Felipe Artur <fcardozo@gitlab.com>
Date: Tue, 31 Oct 2017 15:03:52 +0000
Subject: Allow promoting project milestones to group milestones

---
 app/controllers/projects/milestones_controller.rb  | 12 +++-
 app/services/milestones/promote_service.rb         | 80 ++++++++++++++++++++++
 app/views/projects/milestones/show.html.haml       | 11 ++-
 app/views/shared/milestones/_milestone.html.haml   |  7 ++
 changelogs/unreleased/issue_38777.yml              |  5 ++
 config/routes/project.rb                           |  1 +
 doc/user/project/milestones/index.md               |  3 +-
 .../projects/milestones_controller_spec.rb         | 28 ++++++++
 spec/routing/project_routing_spec.rb               | 19 +++--
 spec/services/milestones/promote_service_spec.rb   | 77 +++++++++++++++++++++
 10 files changed, 230 insertions(+), 13 deletions(-)
 create mode 100644 app/services/milestones/promote_service.rb
 create mode 100644 changelogs/unreleased/issue_38777.yml
 create mode 100644 spec/services/milestones/promote_service_spec.rb

diff --git a/app/controllers/projects/milestones_controller.rb b/app/controllers/projects/milestones_controller.rb
index c94384d2a1a..980bbf699b6 100644
--- a/app/controllers/projects/milestones_controller.rb
+++ b/app/controllers/projects/milestones_controller.rb
@@ -2,13 +2,13 @@ class Projects::MilestonesController < Projects::ApplicationController
   include MilestoneActions
 
   before_action :check_issuables_available!
-  before_action :milestone, only: [:edit, :update, :destroy, :show, :merge_requests, :participants, :labels]
+  before_action :milestone, only: [:edit, :update, :destroy, :show, :merge_requests, :participants, :labels, :promote]
 
   # Allow read any milestone
   before_action :authorize_read_milestone!
 
   # Allow admin milestone
-  before_action :authorize_admin_milestone!, except: [:index, :show, :merge_requests, :participants, :labels]
+  before_action :authorize_admin_milestone!, except: [:index, :show, :merge_requests, :participants, :labels, :promote]
 
   respond_to :html
 
@@ -69,6 +69,14 @@ class Projects::MilestonesController < Projects::ApplicationController
     end
   end
 
+  def promote
+    promoted_milestone = Milestones::PromoteService.new(project, current_user).execute(milestone)
+    flash[:notice] = "Milestone has been promoted to group milestone."
+    redirect_to group_milestone_path(project.group, promoted_milestone.iid)
+  rescue Milestones::PromoteService::PromoteMilestoneError => error
+    redirect_to milestone, alert: error.message
+  end
+
   def destroy
     return access_denied! unless can?(current_user, :admin_milestone, @project)
 
diff --git a/app/services/milestones/promote_service.rb b/app/services/milestones/promote_service.rb
new file mode 100644
index 00000000000..bd9cfd4e0ea
--- /dev/null
+++ b/app/services/milestones/promote_service.rb
@@ -0,0 +1,80 @@
+module Milestones
+  class PromoteService < Milestones::BaseService
+    PromoteMilestoneError = Class.new(StandardError)
+
+    def execute(milestone)
+      check_project_milestone!(milestone)
+
+      Milestone.transaction do
+        # Destroy all milestones with same title across projects
+        destroy_old_milestones(milestone)
+
+        group_milestone = clone_project_milestone(milestone)
+
+        move_children_to_group_milestone(group_milestone)
+
+        # Just to be safe
+        unless group_milestone.valid?
+          raise_error(group_milestone.errors.full_messages.to_sentence)
+        end
+
+        group_milestone
+      end
+    end
+
+    private
+
+    def milestone_ids_for_merge(group_milestone)
+      # Pluck need to be used here instead of select so the array of ids
+      # is persistent after old milestones gets deleted.
+      @milestone_ids_for_merge ||= begin
+        search_params = { title: group_milestone.title, project_ids: group_project_ids, state: 'all' }
+        milestones = MilestonesFinder.new(search_params).execute
+        milestones.pluck(:id)
+      end
+    end
+
+    def move_children_to_group_milestone(group_milestone)
+      milestone_ids_for_merge(group_milestone).in_groups_of(100) do |milestone_ids|
+        update_children(group_milestone, milestone_ids)
+      end
+    end
+
+    def check_project_milestone!(milestone)
+      raise_error('Only project milestones can be promoted.') unless milestone.project_milestone?
+    end
+
+    def clone_project_milestone(milestone)
+      params = milestone.slice(:title, :description, :start_date, :due_date, :state_event)
+
+      create_service = CreateService.new(group, current_user, params)
+
+      create_service.execute
+    end
+
+    def update_children(group_milestone, milestone_ids)
+      issues = Issue.where(project_id: group_project_ids, milestone_id: milestone_ids)
+      merge_requests = MergeRequest.where(source_project_id: group_project_ids, milestone_id: milestone_ids)
+
+      [issues, merge_requests].each do |issuable_collection|
+        issuable_collection.update_all(milestone_id: group_milestone.id)
+      end
+    end
+
+    def group
+      @group ||= parent.group || raise_error('Project does not belong to a group.')
+    end
+
+    def destroy_old_milestones(group_milestone)
+      Milestone.where(id: milestone_ids_for_merge(group_milestone)).destroy_all
+    end
+
+    def group_project_ids
+      @group_project_ids ||= group.projects.map(&:id)
+    end
+
+    def raise_error(message)
+      raise PromoteMilestoneError, "Promotion failed - #{message}"
+    end
+  end
+end
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index a5153df1159..9fc297ab7f6 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -23,14 +23,18 @@
         = milestone_date_range(@milestone)
     .milestone-buttons
       - if can?(current_user, :admin_milestone, @project)
+        = link_to edit_project_milestone_path(@project, @milestone), class: "btn btn-grouped btn-nr" do
+          Edit
+
+        - if @project.group
+          = link_to promote_project_milestone_path(@milestone.project, @milestone), title: "Promote to Group Milestone", class: 'btn btn-grouped', data: { confirm: "Promoting this milestone will make it available for all projects inside the group. Existing project milestones with the same name will be merged. Are you sure?", toggle: "tooltip" }, method: :post do
+            Promote
+
         - if @milestone.active?
           = link_to 'Close milestone', project_milestone_path(@project, @milestone, milestone: {state_event: :close }), method: :put, class: "btn btn-close btn-nr btn-grouped"
         - else
           = link_to 'Reopen milestone', project_milestone_path(@project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-reopen btn-nr btn-grouped"
 
-        = link_to edit_project_milestone_path(@project, @milestone), class: "btn btn-grouped btn-nr" do
-          Edit
-
         = link_to project_milestone_path(@project, @milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-grouped btn-danger" do
           Delete
 
@@ -40,6 +44,7 @@
   .detail-page-description.milestone-detail
     %h2.title
       = markdown_field(@milestone, :title)
+
     %div
       - if @milestone.description.present?
         .description
diff --git a/app/views/shared/milestones/_milestone.html.haml b/app/views/shared/milestones/_milestone.html.haml
index 305e2542281..7ba8f9d4313 100644
--- a/app/views/shared/milestones/_milestone.html.haml
+++ b/app/views/shared/milestones/_milestone.html.haml
@@ -49,6 +49,13 @@
           = link_to edit_project_milestone_path(milestone.project, milestone), class: "btn btn-xs btn-grouped" do
             Edit
           \
+
+          - if @project.group
+            = link_to promote_project_milestone_path(milestone.project, milestone), title: "Promote to Group Milestone", class: 'btn btn-xs btn-grouped', data: { confirm: "Promoting this milestone will make it available for all projects inside the group. Existing project milestones with the same name will be merged. Are you sure?", toggle: "tooltip" }, method: :post do
+              Promote
+
           = link_to 'Close Milestone', project_milestone_path(@project, milestone, milestone: {state_event: :close }), method: :put, remote: true, class: "btn btn-xs btn-close btn-grouped"
+
           = link_to project_milestone_path(milestone.project, milestone), data: { confirm: 'Are you sure?' }, method: :delete, class: "btn btn-xs btn-remove btn-grouped" do
             Delete
+
diff --git a/changelogs/unreleased/issue_38777.yml b/changelogs/unreleased/issue_38777.yml
new file mode 100644
index 00000000000..5c49b2f7879
--- /dev/null
+++ b/changelogs/unreleased/issue_38777.yml
@@ -0,0 +1,5 @@
+---
+title: Allow promoting project milestones to group milestones
+merge_request:
+author:
+type: added
diff --git a/config/routes/project.rb b/config/routes/project.rb
index 9f553085d50..746c0c46677 100644
--- a/config/routes/project.rb
+++ b/config/routes/project.rb
@@ -293,6 +293,7 @@ constraints(ProjectUrlConstrainer.new) do
 
       resources :milestones, constraints: { id: /\d+/ } do
         member do
+          post :promote
           put :sort_issues
           put :sort_merge_requests
           get :merge_requests
diff --git a/doc/user/project/milestones/index.md b/doc/user/project/milestones/index.md
index 876b98a4dc5..83adbd8cce2 100644
--- a/doc/user/project/milestones/index.md
+++ b/doc/user/project/milestones/index.md
@@ -29,7 +29,8 @@ In addition to that you will be able to filter issues or merge requests by group
 
 ## Milestone promotion
 
-You will be able to promote a project milestone to a group milestone [in the future](https://gitlab.com/gitlab-org/gitlab-ce/issues/35833).
+Project milestones can be promoted to group milestones if its project belongs to a group. When a milestone is promoted all other milestones across the group projects with the same title will be merged into it, which means all milestone's children like issues, merge requests and boards will be moved into the new promoted milestone.
+The promote button can be found in the milestone view or milestones list.
 
 ## Special milestone filters
 
diff --git a/spec/controllers/projects/milestones_controller_spec.rb b/spec/controllers/projects/milestones_controller_spec.rb
index 573530d0db0..209979e642d 100644
--- a/spec/controllers/projects/milestones_controller_spec.rb
+++ b/spec/controllers/projects/milestones_controller_spec.rb
@@ -86,4 +86,32 @@ describe Projects::MilestonesController do
       expect(last_note).to eq('removed milestone')
     end
   end
+
+  describe '#promote' do
+    context 'promotion succeeds' do
+      before do
+        group = create(:group)
+        group.add_developer(user)
+        milestone.project.update(namespace: group)
+      end
+
+      it 'shows group milestone' do
+        post :promote, namespace_id: project.namespace.id, project_id: project.id, id: milestone.iid
+
+        group_milestone = assigns(:milestone)
+
+        expect(response).to redirect_to(group_milestone_path(project.group, group_milestone.iid))
+        expect(flash[:notice]).to eq('Milestone has been promoted to group milestone.')
+      end
+    end
+
+    context 'promotion fails' do
+      it 'shows project milestone' do
+        post :promote, namespace_id: project.namespace.id, project_id: project.id, id: milestone.iid
+
+        expect(response).to redirect_to(project_milestone_path(project, milestone))
+        expect(flash[:alert]).to eq('Promotion failed - Project does not belong to a group.')
+      end
+    end
+  end
 end
diff --git a/spec/routing/project_routing_spec.rb b/spec/routing/project_routing_spec.rb
index 39d44245c3f..fb1281a6b42 100644
--- a/spec/routing/project_routing_spec.rb
+++ b/spec/routing/project_routing_spec.rb
@@ -426,18 +426,23 @@ describe 'project routing' do
     end
   end
 
-  #     project_milestones GET    /:project_id/milestones(.:format)          milestones#index
-  #                        POST   /:project_id/milestones(.:format)          milestones#create
-  #  new_project_milestone GET    /:project_id/milestones/new(.:format)      milestones#new
-  # edit_project_milestone GET    /:project_id/milestones/:id/edit(.:format) milestones#edit
-  #      project_milestone GET    /:project_id/milestones/:id(.:format)      milestones#show
-  #                        PUT    /:project_id/milestones/:id(.:format)      milestones#update
-  #                        DELETE /:project_id/milestones/:id(.:format)      milestones#destroy
+  #     project_milestones    GET    /:project_id/milestones(.:format)          milestones#index
+  #                           POST   /:project_id/milestones(.:format)          milestones#create
+  #  new_project_milestone    GET    /:project_id/milestones/new(.:format)      milestones#new
+  # edit_project_milestone    GET    /:project_id/milestones/:id/edit(.:format) milestones#edit
+  #      project_milestone    GET    /:project_id/milestones/:id(.:format)      milestones#show
+  #                           PUT    /:project_id/milestones/:id(.:format)      milestones#update
+  #                           DELETE /:project_id/milestones/:id(.:format)      milestones#destroy
+  # promote_project_milestone POST /:project_id/milestones/:id/promote          milestones#promote
   describe Projects::MilestonesController, 'routing' do
     it_behaves_like 'RESTful project resources' do
       let(:controller) { 'milestones' }
       let(:actions) { [:index, :create, :new, :edit, :show, :update] }
     end
+
+    it 'to #promote' do
+      expect(post('/gitlab/gitlabhq/milestones/1/promote')).to route_to('projects/milestones#promote', namespace_id: 'gitlab', project_id: 'gitlabhq', id: "1")
+    end
   end
 
   # project_labels GET    /:project_id/labels(.:format) labels#index
diff --git a/spec/services/milestones/promote_service_spec.rb b/spec/services/milestones/promote_service_spec.rb
new file mode 100644
index 00000000000..9f2df6d6d19
--- /dev/null
+++ b/spec/services/milestones/promote_service_spec.rb
@@ -0,0 +1,77 @@
+require 'spec_helper'
+
+describe Milestones::PromoteService do
+  let(:group) { create(:group) }
+  let(:project) { create(:project, namespace: group) }
+  let(:user) { create(:user) }
+  let(:milestone_title) { 'project milestone' }
+  let(:milestone) { create(:milestone, project: project, title: milestone_title) }
+  let(:service) { described_class.new(project, user) }
+
+  describe '#execute' do
+    before do
+      group.add_master(user)
+    end
+
+    context 'validations' do
+      it 'raises error if milestone does not belong to a project' do
+        allow(milestone).to receive(:project_milestone?).and_return(false)
+
+        expect { service.execute(milestone) }.to raise_error(described_class::PromoteMilestoneError)
+      end
+
+      it 'raises error if project does not belong to a group' do
+        project.update(namespace: user.namespace)
+
+        expect { service.execute(milestone) }.to raise_error(described_class::PromoteMilestoneError)
+      end
+    end
+
+    context 'without duplicated milestone titles across projects' do
+      it 'promotes project milestone to group milestone' do
+        promoted_milestone = service.execute(milestone)
+
+        expect(promoted_milestone).to be_group_milestone
+      end
+
+      it 'sets issuables with new promoted milestone' do
+        issue = create(:issue, milestone: milestone, project: project)
+        merge_request = create(:merge_request, milestone: milestone, source_project: project)
+
+        promoted_milestone = service.execute(milestone)
+
+        expect(promoted_milestone).to be_group_milestone
+        expect(issue.reload.milestone).to eq(promoted_milestone)
+        expect(merge_request.reload.milestone).to eq(promoted_milestone)
+      end
+    end
+
+    context 'with duplicated milestone titles across projects' do
+      let(:project_2) { create(:project, namespace: group) }
+      let!(:milestone_2) { create(:milestone, project: project_2, title: milestone_title) }
+
+      it 'deletes project milestones with the same title' do
+        promoted_milestone = service.execute(milestone)
+
+        expect(promoted_milestone).to be_group_milestone
+        expect(promoted_milestone).to be_valid
+        expect(Milestone.exists?(milestone.id)).to be_falsy
+        expect(Milestone.exists?(milestone_2.id)).to be_falsy
+      end
+
+      it 'sets all issuables with new promoted milestone' do
+        issue = create(:issue, milestone: milestone, project: project)
+        issue_2 = create(:issue, milestone: milestone_2, project: project_2)
+        merge_request = create(:merge_request, milestone: milestone, source_project: project)
+        merge_request_2 = create(:merge_request, milestone: milestone_2, source_project: project_2)
+
+        promoted_milestone = service.execute(milestone)
+
+        expect(issue.reload.milestone).to eq(promoted_milestone)
+        expect(issue_2.reload.milestone).to eq(promoted_milestone)
+        expect(merge_request.reload.milestone).to eq(promoted_milestone)
+        expect(merge_request_2.reload.milestone).to eq(promoted_milestone)
+      end
+    end
+  end
+end
-- 
cgit v1.2.1


From 3a887c92d066b24afa64968bf67dfae97edb63a4 Mon Sep 17 00:00:00 2001
From: James Lopez <james@jameslopez.es>
Date: Tue, 31 Oct 2017 16:13:09 +0100
Subject: fix spec failure

---
 spec/lib/gitlab/import_export/all_models.yml | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/spec/lib/gitlab/import_export/all_models.yml b/spec/lib/gitlab/import_export/all_models.yml
index 29baa70d5ae..f5f48c47520 100644
--- a/spec/lib/gitlab/import_export/all_models.yml
+++ b/spec/lib/gitlab/import_export/all_models.yml
@@ -286,3 +286,6 @@ timelogs:
 - user
 push_event_payload:
 - event
+issue_assignees:
+- issue
+- assignee
\ No newline at end of file
-- 
cgit v1.2.1


From da17419418f9339cb4e8c790350d7198ce2d5546 Mon Sep 17 00:00:00 2001
From: James Lopez <james@jameslopez.es>
Date: Tue, 31 Oct 2017 16:29:39 +0100
Subject: add changelog

---
 changelogs/unreleased/fix-import-issue-assignees.yml | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 changelogs/unreleased/fix-import-issue-assignees.yml

diff --git a/changelogs/unreleased/fix-import-issue-assignees.yml b/changelogs/unreleased/fix-import-issue-assignees.yml
new file mode 100644
index 00000000000..063b6afaf08
--- /dev/null
+++ b/changelogs/unreleased/fix-import-issue-assignees.yml
@@ -0,0 +1,5 @@
+---
+title: Fix missing Import/Export issue assignees
+merge_request:
+author:
+type: fixed
-- 
cgit v1.2.1


From 5390655290d67199155fc29b9bbf5ceadd87491a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A9my=20Coutable?= <remy@rymai.me>
Date: Tue, 31 Oct 2017 17:05:06 +0100
Subject: Improve the maintenance policy page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Make clear that we may backport bug fixes to the previous stable
release.

Signed-off-by: Rémy Coutable <remy@rymai.me>
---
 doc/policy/maintenance.md | 31 ++++++++++++++++++-------------
 1 file changed, 18 insertions(+), 13 deletions(-)

diff --git a/doc/policy/maintenance.md b/doc/policy/maintenance.md
index 7ab56c89014..8d0afa9e692 100644
--- a/doc/policy/maintenance.md
+++ b/doc/policy/maintenance.md
@@ -19,24 +19,30 @@ For example, for GitLab version 10.5.7:
 * `5` represents minor version
 * `7` represents patch number
 
-## Security releases
+## Patch releases
 
-The current stable release will receive security patches and bug fixes
-(eg. `8.9.0` -> `8.9.1`).
+Patch releases usually only include bug fixes and are only done for the current
+stable release. That said, in some cases, we may backport it to previous stable
+release, depending on the severity of the bug.
 
-Feature releases will mark the next supported stable
-release where the minor version is increased numerically by increments of one
-(eg. `8.9 -> 8.10`).
+For instance, if we release `10.1.1` with a fix for a severe bug introduced in
+`10.0.0`, we could backport the fix to a new `10.0.x` patch release.
 
-Our current policy is to support one stable release at any given time.
-For medium-level security issues, we may consider backporting to the previous two
+### Security releases
+
+Security releases are a special kind of patch release that only include security
+fixes and patches (see below).
+
+Our current policy is to support one stable release at any given time, but for
+medium-level security issues, we may backport security fixes to the previous two
 monthly releases.
 
-For very serious security issues, there is [precedent](https://about.gitlab.com/2016/05/02/cve-2016-4340-patches/)
-to backport security fixes to even more monthly releases of GitLab. This decision
-is made on a case-by-case basis.
+For very serious security issues, there is
+[precedent](https://about.gitlab.com/2016/05/02/cve-2016-4340-patches/)
+to backport security fixes to even more monthly releases of GitLab.
+This decision is made on a case-by-case basis.
 
-## Version support
+## Upgrade recommendations
 
 We encourage everyone to run the latest stable release to ensure that you can
 easily upgrade to the most secure and feature-rich GitLab experience. In order
@@ -70,7 +76,6 @@ Please see the table below for some examples:
 | -------------- | ------------ | ------------------------ | ---------------- |
 | 9.4.5   | 8.13.4   | `8.13.4` -> `8.17.7` -> `9.4.5`     | `8.17.7` is the last version in version `8` |
 | 10.1.4   | 8.13.4   | `8.13.4` -> `8.17.7` -> `9.5.8` -> `10.1.4` | `8.17.7` is the last version in version `8`, `9.5.8` is the last version in version `9` |
-|
 
 More information about the release procedures can be found in our
 [release-tools documentation][rel]. You may also want to read our
-- 
cgit v1.2.1


From 8399de0c961be75d0cd90e59a7e89fabc11025b8 Mon Sep 17 00:00:00 2001
From: Douwe Maan <douwe@selenight.nl>
Date: Tue, 31 Oct 2017 10:52:44 +0100
Subject: Normalize LDAP DN when looking up identity

---
 app/models/identity.rb                                  |  5 ++++-
 changelogs/unreleased/dm-ldap-identity-normalize-dn.yml |  5 +++++
 lib/gitlab/ldap/auth_hash.rb                            |  2 +-
 lib/gitlab/ldap/user.rb                                 |  5 +++--
 spec/lib/gitlab/ldap/authentication_spec.rb             |  4 ++--
 spec/lib/gitlab/ldap/user_spec.rb                       |  8 +++++---
 spec/lib/gitlab/o_auth/user_spec.rb                     |  2 +-
 spec/lib/gitlab/saml/user_spec.rb                       |  2 +-
 spec/models/identity_spec.rb                            | 14 +++++++++++++-
 9 files changed, 35 insertions(+), 12 deletions(-)
 create mode 100644 changelogs/unreleased/dm-ldap-identity-normalize-dn.yml

diff --git a/app/models/identity.rb b/app/models/identity.rb
index 920a25932b4..ac8094b610e 100644
--- a/app/models/identity.rb
+++ b/app/models/identity.rb
@@ -7,7 +7,10 @@ class Identity < ActiveRecord::Base
   validates :extern_uid, allow_blank: true, uniqueness: { scope: :provider }
   validates :user_id, uniqueness: { scope: :provider }
 
-  scope :with_extern_uid, ->(provider, extern_uid) { where(extern_uid: extern_uid, provider: provider) }
+  scope :with_extern_uid, ->(provider, extern_uid) do
+    extern_uid = Gitlab::LDAP::Person.normalize_dn(extern_uid) if provider.starts_with?('ldap')
+    where(extern_uid: extern_uid, provider: provider)
+  end
 
   def ldap?
     provider.starts_with?('ldap')
diff --git a/changelogs/unreleased/dm-ldap-identity-normalize-dn.yml b/changelogs/unreleased/dm-ldap-identity-normalize-dn.yml
new file mode 100644
index 00000000000..7ab25f79143
--- /dev/null
+++ b/changelogs/unreleased/dm-ldap-identity-normalize-dn.yml
@@ -0,0 +1,5 @@
+---
+title: Normalize LDAP DN when looking up identity
+merge_request:
+author:
+type: fixed
diff --git a/lib/gitlab/ldap/auth_hash.rb b/lib/gitlab/ldap/auth_hash.rb
index 3123da17fd9..1bd0965679a 100644
--- a/lib/gitlab/ldap/auth_hash.rb
+++ b/lib/gitlab/ldap/auth_hash.rb
@@ -4,7 +4,7 @@ module Gitlab
   module LDAP
     class AuthHash < Gitlab::OAuth::AuthHash
       def uid
-        Gitlab::LDAP::Person.normalize_dn(super)
+        @uid ||= Gitlab::LDAP::Person.normalize_dn(super)
       end
 
       private
diff --git a/lib/gitlab/ldap/user.rb b/lib/gitlab/ldap/user.rb
index 1793097363e..4d5c67ed892 100644
--- a/lib/gitlab/ldap/user.rb
+++ b/lib/gitlab/ldap/user.rb
@@ -9,10 +9,11 @@ module Gitlab
     class User < Gitlab::OAuth::User
       class << self
         def find_by_uid_and_provider(uid, provider)
-          # LDAP distinguished name is case-insensitive
+          uid = Gitlab::LDAP::Person.normalize_dn(uid)
+
           identity = ::Identity
             .where(provider: provider)
-            .iwhere(extern_uid: uid).last
+            .where(extern_uid: uid).last
           identity && identity.user
         end
       end
diff --git a/spec/lib/gitlab/ldap/authentication_spec.rb b/spec/lib/gitlab/ldap/authentication_spec.rb
index 01b6282af0c..9d57a46c12b 100644
--- a/spec/lib/gitlab/ldap/authentication_spec.rb
+++ b/spec/lib/gitlab/ldap/authentication_spec.rb
@@ -1,8 +1,8 @@
 require 'spec_helper'
 
 describe Gitlab::LDAP::Authentication do
-  let(:user)     { create(:omniauth_user, extern_uid: dn) }
-  let(:dn)       { 'uid=john,ou=people,dc=example,dc=com' }
+  let(:dn)       { 'uid=John Smith, ou=People, dc=example, dc=com' }
+  let(:user)     { create(:omniauth_user, extern_uid: Gitlab::LDAP::Person.normalize_dn(dn)) }
   let(:login)    { 'john' }
   let(:password) { 'password' }
 
diff --git a/spec/lib/gitlab/ldap/user_spec.rb b/spec/lib/gitlab/ldap/user_spec.rb
index 9a4705d1cee..260df6e4dae 100644
--- a/spec/lib/gitlab/ldap/user_spec.rb
+++ b/spec/lib/gitlab/ldap/user_spec.rb
@@ -44,23 +44,25 @@ describe Gitlab::LDAP::User do
   end
 
   describe '.find_by_uid_and_provider' do
+    let(:dn) { 'CN=John Åström, CN=Users, DC=Example, DC=com' }
+
     it 'retrieves the correct user' do
       special_info = {
         name: 'John Åström',
         email: 'john@example.com',
         nickname: 'jastrom'
       }
-      special_hash = OmniAuth::AuthHash.new(uid: 'CN=John Åström,CN=Users,DC=Example,DC=com', provider: 'ldapmain', info: special_info)
+      special_hash = OmniAuth::AuthHash.new(uid: dn, provider: 'ldapmain', info: special_info)
       special_chars_user = described_class.new(special_hash)
       user = special_chars_user.save
 
-      expect(described_class.find_by_uid_and_provider(special_hash.uid, special_hash.provider)).to eq user
+      expect(described_class.find_by_uid_and_provider(dn, 'ldapmain')).to eq user
     end
   end
 
   describe 'find or create' do
     it "finds the user if already existing" do
-      create(:omniauth_user, extern_uid: 'uid=John Smith,ou=People,dc=example,dc=com', provider: 'ldapmain')
+      create(:omniauth_user, extern_uid: 'uid=john smith,ou=people,dc=example,dc=com', provider: 'ldapmain')
 
       expect { ldap_user.save }.not_to change { User.count }
     end
diff --git a/spec/lib/gitlab/o_auth/user_spec.rb b/spec/lib/gitlab/o_auth/user_spec.rb
index db26e16e3b2..c7471a21fda 100644
--- a/spec/lib/gitlab/o_auth/user_spec.rb
+++ b/spec/lib/gitlab/o_auth/user_spec.rb
@@ -4,7 +4,7 @@ describe Gitlab::OAuth::User do
   let(:oauth_user) { described_class.new(auth_hash) }
   let(:gl_user) { oauth_user.gl_user }
   let(:uid) { 'my-uid' }
-  let(:dn) { 'uid=user1,ou=People,dc=example' }
+  let(:dn) { 'uid=user1,ou=people,dc=example' }
   let(:provider) { 'my-provider' }
   let(:auth_hash) { OmniAuth::AuthHash.new(uid: uid, provider: provider, info: info_hash) }
   let(:info_hash) do
diff --git a/spec/lib/gitlab/saml/user_spec.rb b/spec/lib/gitlab/saml/user_spec.rb
index 1c23fb5f285..1765980e977 100644
--- a/spec/lib/gitlab/saml/user_spec.rb
+++ b/spec/lib/gitlab/saml/user_spec.rb
@@ -7,7 +7,7 @@ describe Gitlab::Saml::User do
   let(:saml_user) { described_class.new(auth_hash) }
   let(:gl_user) { saml_user.gl_user }
   let(:uid) { 'my-uid' }
-  let(:dn) { 'uid=user1,ou=People,dc=example' }
+  let(:dn) { 'uid=user1,ou=people,dc=example' }
   let(:provider) { 'saml' }
   let(:raw_info_attr) { { 'groups' => %w(Developers Freelancers Designers) } }
   let(:auth_hash) { OmniAuth::AuthHash.new(uid: uid, provider: provider, info: info_hash, extra: { raw_info: OneLogin::RubySaml::Attributes.new(raw_info_attr) }) }
diff --git a/spec/models/identity_spec.rb b/spec/models/identity_spec.rb
index 4ca6556d0f4..3ed048744de 100644
--- a/spec/models/identity_spec.rb
+++ b/spec/models/identity_spec.rb
@@ -1,6 +1,6 @@
 require 'spec_helper'
 
-RSpec.describe Identity do
+describe Identity do
   describe 'relations' do
     it { is_expected.to belong_to(:user) }
   end
@@ -22,4 +22,16 @@ RSpec.describe Identity do
       expect(other_identity.ldap?).to be_falsey
     end
   end
+
+  describe '.with_extern_uid' do
+    context 'LDAP identity' do
+      let!(:ldap_identity) { create(:identity, provider: 'ldapmain', extern_uid: 'uid=john smith,ou=people,dc=example,dc=com') }
+
+      it 'finds the identity when the DN is formatted differently' do
+        identity = described_class.with_extern_uid('ldapmain', 'uid=John Smith, ou=People, dc=example, dc=com').first
+
+        expect(identity).to eq(ldap_identity)
+      end
+    end
+  end
 end
-- 
cgit v1.2.1


From 6dc9028fbb3856c8c7814446ed176880f7d5213f Mon Sep 17 00:00:00 2001
From: Eric Eastwood <contact@ericeastwood.com>
Date: Tue, 31 Oct 2017 16:15:03 +0000
Subject: Load participants async

---
 app/assets/javascripts/issuable_context.js         |  28 ----
 .../components/participants/participants.vue       | 125 +++++++++++++++
 .../participants/sidebar_participants.vue          |  26 +++
 .../subscriptions/sidebar_subscriptions.vue        |  45 ++++++
 .../components/subscriptions/subscriptions.vue     |  60 +++++++
 .../sidebar/services/sidebar_service.js            |   5 +
 app/assets/javascripts/sidebar/sidebar_bundle.js   |  34 ++++
 app/assets/javascripts/sidebar/sidebar_mediator.js |  16 ++
 .../javascripts/sidebar/stores/sidebar_store.js    |  22 +++
 .../services/mr_widget_service.js                  |   2 +-
 app/assets/stylesheets/pages/issuable.scss         |   6 +-
 app/controllers/projects/issues_controller.rb      |   2 +-
 .../projects/merge_requests_controller.rb          |   2 +-
 app/helpers/issuables_helper.rb                    |  23 +--
 app/models/concerns/subscribable.rb                |   2 +
 app/serializers/issuable_sidebar_entity.rb         |  16 ++
 app/serializers/issue_serializer.rb                |  15 +-
 app/serializers/issue_sidebar_entity.rb            |   3 +
 app/serializers/merge_request_basic_entity.rb      |   6 +-
 app/serializers/merge_request_serializer.rb        |   9 +-
 app/views/shared/issuable/_participants.html.haml  |  18 ---
 app/views/shared/issuable/_sidebar.html.haml       |  13 +-
 .../unreleased/23206-load-participants-async.yml   |   5 +
 features/steps/project/issues/issues.rb            |   6 +-
 .../projects/merge_requests_controller_spec.rb     |   6 +-
 spec/features/boards/boards_spec.rb                |   2 +-
 .../user_manages_subscription_spec.rb              |   2 +-
 spec/fixtures/api/schemas/entities/issue.json      |  44 ++++++
 .../api/schemas/entities/issue_sidebar.json        |  21 +++
 spec/fixtures/api/schemas/entities/label.json      |  26 +++
 .../api/schemas/entities/merge_request_basic.json  |   4 +-
 spec/fixtures/api/schemas/issue.json               |  27 +---
 spec/javascripts/issuable_context_spec.js          |  33 ----
 spec/javascripts/sidebar/mock_data.js              |   2 +
 spec/javascripts/sidebar/participants_spec.js      | 174 +++++++++++++++++++++
 spec/javascripts/sidebar/sidebar_mediator_spec.js  |  17 +-
 spec/javascripts/sidebar/sidebar_service_spec.js   |  17 +-
 spec/javascripts/sidebar/sidebar_store_spec.js     |  93 ++++++++---
 .../sidebar/sidebar_subscriptions_spec.js          |  36 +++++
 spec/javascripts/sidebar/subscriptions_spec.js     |  42 +++++
 spec/models/concerns/subscribable_spec.rb          |   6 +
 spec/serializers/issue_serializer_spec.rb          |  27 ++++
 .../merge_request_basic_serializer_spec.rb         |  10 +-
 spec/serializers/merge_request_serializer_spec.rb  |  12 +-
 .../shared/issuable/_participants.html.haml.rb     |  26 ---
 45 files changed, 911 insertions(+), 205 deletions(-)
 create mode 100644 app/assets/javascripts/sidebar/components/participants/participants.vue
 create mode 100644 app/assets/javascripts/sidebar/components/participants/sidebar_participants.vue
 create mode 100644 app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions.vue
 create mode 100644 app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue
 create mode 100644 app/serializers/issuable_sidebar_entity.rb
 create mode 100644 app/serializers/issue_sidebar_entity.rb
 delete mode 100644 app/views/shared/issuable/_participants.html.haml
 create mode 100644 changelogs/unreleased/23206-load-participants-async.yml
 create mode 100644 spec/fixtures/api/schemas/entities/issue.json
 create mode 100644 spec/fixtures/api/schemas/entities/issue_sidebar.json
 create mode 100644 spec/fixtures/api/schemas/entities/label.json
 delete mode 100644 spec/javascripts/issuable_context_spec.js
 create mode 100644 spec/javascripts/sidebar/participants_spec.js
 create mode 100644 spec/javascripts/sidebar/sidebar_subscriptions_spec.js
 create mode 100644 spec/javascripts/sidebar/subscriptions_spec.js
 create mode 100644 spec/serializers/issue_serializer_spec.rb
 delete mode 100644 spec/views/shared/issuable/_participants.html.haml.rb

diff --git a/app/assets/javascripts/issuable_context.js b/app/assets/javascripts/issuable_context.js
index 5bc7f8d9cb9..da99394ff90 100644
--- a/app/assets/javascripts/issuable_context.js
+++ b/app/assets/javascripts/issuable_context.js
@@ -2,11 +2,8 @@ import Cookies from 'js-cookie';
 import bp from './breakpoints';
 import UsersSelect from './users_select';
 
-const PARTICIPANTS_ROW_COUNT = 7;
-
 export default class IssuableContext {
   constructor(currentUser) {
-    this.initParticipants();
     this.userSelect = new UsersSelect(currentUser);
 
     $('select.select2').select2({
@@ -51,29 +48,4 @@ export default class IssuableContext {
       }
     });
   }
-
-  initParticipants() {
-    $(document).on('click', '.js-participants-more', this.toggleHiddenParticipants);
-    return $('.js-participants-author').each(function forEachAuthor(i) {
-      if (i >= PARTICIPANTS_ROW_COUNT) {
-        $(this).addClass('js-participants-hidden').hide();
-      }
-    });
-  }
-
-  toggleHiddenParticipants() {
-    const currentText = $(this).text().trim();
-    const lessText = $(this).data('less-text');
-    const originalText = $(this).data('original-text');
-
-    if (currentText === originalText) {
-      $(this).text(lessText);
-
-      if (gl.lazyLoader) gl.lazyLoader.loadCheck();
-    } else {
-      $(this).text(originalText);
-    }
-
-    $('.js-participants-hidden').toggle();
-  }
 }
diff --git a/app/assets/javascripts/sidebar/components/participants/participants.vue b/app/assets/javascripts/sidebar/components/participants/participants.vue
new file mode 100644
index 00000000000..b8510a6ce3a
--- /dev/null
+++ b/app/assets/javascripts/sidebar/components/participants/participants.vue
@@ -0,0 +1,125 @@
+<script>
+import { __, n__, sprintf } from '../../../locale';
+import loadingIcon from '../../../vue_shared/components/loading_icon.vue';
+import userAvatarImage from '../../../vue_shared/components/user_avatar/user_avatar_image.vue';
+
+export default {
+  props: {
+    loading: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    participants: {
+      type: Array,
+      required: false,
+      default: () => [],
+    },
+    numberOfLessParticipants: {
+      type: Number,
+      required: false,
+      default: 7,
+    },
+  },
+  data() {
+    return {
+      isShowingMoreParticipants: false,
+    };
+  },
+  components: {
+    loadingIcon,
+    userAvatarImage,
+  },
+  computed: {
+    lessParticipants() {
+      return this.participants.slice(0, this.numberOfLessParticipants);
+    },
+    visibleParticipants() {
+      return this.isShowingMoreParticipants ? this.participants : this.lessParticipants;
+    },
+    hasMoreParticipants() {
+      return this.participants.length > this.numberOfLessParticipants;
+    },
+    toggleLabel() {
+      let label = '';
+      if (this.isShowingMoreParticipants) {
+        label = __('- show less');
+      } else {
+        label = sprintf(__('+ %{moreCount} more'), {
+          moreCount: this.participants.length - this.numberOfLessParticipants,
+        });
+      }
+
+      return label;
+    },
+    participantLabel() {
+      return sprintf(
+        n__('%{count} participant', '%{count} participants', this.participants.length),
+        { count: this.loading ? '' : this.participantCount },
+      );
+    },
+    participantCount() {
+      return this.participants.length;
+    },
+  },
+  methods: {
+    toggleMoreParticipants() {
+      this.isShowingMoreParticipants = !this.isShowingMoreParticipants;
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <div class="sidebar-collapsed-icon">
+      <i
+        class="fa fa-users"
+        aria-hidden="true">
+      </i>
+      <loading-icon
+        v-if="loading"
+        class="js-participants-collapsed-loading-icon" />
+      <span
+        v-else
+        class="js-participants-collapsed-count">
+        {{ participantCount }}
+      </span>
+    </div>
+    <div class="title hide-collapsed">
+      <loading-icon
+        v-if="loading"
+        :inline="true"
+        class="js-participants-expanded-loading-icon" />
+      {{ participantLabel }}
+    </div>
+    <div class="participants-list hide-collapsed">
+      <div
+        v-for="participant in visibleParticipants"
+        :key="participant.id"
+        class="participants-author js-participants-author">
+        <a
+          class="author_link"
+          :href="participant.web_url">
+          <user-avatar-image
+            :lazy="true"
+            :img-src="participant.avatar_url"
+            css-classes="avatar-inline"
+            :size="24"
+            :tooltip-text="participant.name"
+            tooltip-placement="bottom" />
+        </a>
+      </div>
+    </div>
+    <div
+      v-if="hasMoreParticipants"
+      class="participants-more hide-collapsed">
+      <button
+        type="button"
+        class="btn-transparent btn-blank js-toggle-participants-button"
+        @click="toggleMoreParticipants">
+        {{ toggleLabel }}
+      </button>
+    </div>
+  </div>
+</template>
diff --git a/app/assets/javascripts/sidebar/components/participants/sidebar_participants.vue b/app/assets/javascripts/sidebar/components/participants/sidebar_participants.vue
new file mode 100644
index 00000000000..c1296b28db7
--- /dev/null
+++ b/app/assets/javascripts/sidebar/components/participants/sidebar_participants.vue
@@ -0,0 +1,26 @@
+<script>
+import Store from '../../stores/sidebar_store';
+import Mediator from '../../sidebar_mediator';
+import participants from './participants.vue';
+
+export default {
+  data() {
+    return {
+      mediator: new Mediator(),
+      store: new Store(),
+    };
+  },
+  components: {
+    participants,
+  },
+};
+</script>
+
+<template>
+  <div class="block participants">
+    <participants
+      :loading="store.isFetching.participants"
+      :participants="store.participants"
+      :number-of-less-participants="7" />
+  </div>
+</template>
diff --git a/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions.vue b/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions.vue
new file mode 100644
index 00000000000..4ad3d469f25
--- /dev/null
+++ b/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions.vue
@@ -0,0 +1,45 @@
+<script>
+import Store from '../../stores/sidebar_store';
+import Mediator from '../../sidebar_mediator';
+import eventHub from '../../event_hub';
+import Flash from '../../../flash';
+import subscriptions from './subscriptions.vue';
+
+export default {
+  data() {
+    return {
+      mediator: new Mediator(),
+      store: new Store(),
+    };
+  },
+
+  components: {
+    subscriptions,
+  },
+
+  methods: {
+    onToggleSubscription() {
+      this.mediator.toggleSubscription()
+        .catch(() => {
+          Flash('Error occurred when toggling the notification subscription');
+        });
+    },
+  },
+
+  created() {
+    eventHub.$on('toggleSubscription', this.onToggleSubscription);
+  },
+
+  beforeDestroy() {
+    eventHub.$off('toggleSubscription', this.onToggleSubscription);
+  },
+};
+</script>
+
+<template>
+  <div class="block subscriptions">
+    <subscriptions
+      :loading="store.isFetching.subscriptions"
+      :subscribed="store.subscribed" />
+  </div>
+</template>
diff --git a/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue b/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue
new file mode 100644
index 00000000000..a3a8213d63a
--- /dev/null
+++ b/app/assets/javascripts/sidebar/components/subscriptions/subscriptions.vue
@@ -0,0 +1,60 @@
+<script>
+import { __ } from '../../../locale';
+import eventHub from '../../event_hub';
+import loadingButton from '../../../vue_shared/components/loading_button.vue';
+
+export default {
+  props: {
+    loading: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    subscribed: {
+      type: Boolean,
+      required: false,
+    },
+  },
+  components: {
+    loadingButton,
+  },
+  computed: {
+    buttonLabel() {
+      let label;
+      if (this.subscribed === false) {
+        label = __('Subscribe');
+      } else if (this.subscribed === true) {
+        label = __('Unsubscribe');
+      }
+
+      return label;
+    },
+  },
+  methods: {
+    toggleSubscription() {
+      eventHub.$emit('toggleSubscription');
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <div class="sidebar-collapsed-icon">
+      <i
+        class="fa fa-rss"
+        aria-hidden="true">
+      </i>
+    </div>
+    <span class="issuable-header-text hide-collapsed pull-left">
+      {{ __('Notifications') }}
+    </span>
+    <loading-button
+      ref="loadingButton"
+      class="btn btn-default pull-right hide-collapsed js-issuable-subscribe-button"
+      :loading="loading"
+      :label="buttonLabel"
+      @click="toggleSubscription"
+    />
+  </div>
+</template>
diff --git a/app/assets/javascripts/sidebar/services/sidebar_service.js b/app/assets/javascripts/sidebar/services/sidebar_service.js
index 604648407a4..37c97225bfd 100644
--- a/app/assets/javascripts/sidebar/services/sidebar_service.js
+++ b/app/assets/javascripts/sidebar/services/sidebar_service.js
@@ -7,6 +7,7 @@ export default class SidebarService {
   constructor(endpointMap) {
     if (!SidebarService.singleton) {
       this.endpoint = endpointMap.endpoint;
+      this.toggleSubscriptionEndpoint = endpointMap.toggleSubscriptionEndpoint;
       this.moveIssueEndpoint = endpointMap.moveIssueEndpoint;
       this.projectsAutocompleteEndpoint = endpointMap.projectsAutocompleteEndpoint;
 
@@ -36,6 +37,10 @@ export default class SidebarService {
     });
   }
 
+  toggleSubscription() {
+    return Vue.http.post(this.toggleSubscriptionEndpoint);
+  }
+
   moveIssue(moveToProjectId) {
     return Vue.http.post(this.moveIssueEndpoint, {
       move_to_project_id: moveToProjectId,
diff --git a/app/assets/javascripts/sidebar/sidebar_bundle.js b/app/assets/javascripts/sidebar/sidebar_bundle.js
index 09b9d75c02d..2650bb725d4 100644
--- a/app/assets/javascripts/sidebar/sidebar_bundle.js
+++ b/app/assets/javascripts/sidebar/sidebar_bundle.js
@@ -4,6 +4,8 @@ import SidebarAssignees from './components/assignees/sidebar_assignees';
 import ConfidentialIssueSidebar from './components/confidential/confidential_issue_sidebar.vue';
 import SidebarMoveIssue from './lib/sidebar_move_issue';
 import LockIssueSidebar from './components/lock/lock_issue_sidebar.vue';
+import sidebarParticipants from './components/participants/sidebar_participants.vue';
+import sidebarSubscriptions from './components/subscriptions/sidebar_subscriptions.vue';
 import Translate from '../vue_shared/translate';
 
 import Mediator from './sidebar_mediator';
@@ -49,6 +51,36 @@ function mountLockComponent(mediator) {
   }).$mount(el);
 }
 
+function mountParticipantsComponent() {
+  const el = document.querySelector('.js-sidebar-participants-entry-point');
+
+  if (!el) return;
+
+  // eslint-disable-next-line no-new
+  new Vue({
+    el,
+    components: {
+      sidebarParticipants,
+    },
+    render: createElement => createElement('sidebar-participants', {}),
+  });
+}
+
+function mountSubscriptionsComponent() {
+  const el = document.querySelector('.js-sidebar-subscriptions-entry-point');
+
+  if (!el) return;
+
+  // eslint-disable-next-line no-new
+  new Vue({
+    el,
+    components: {
+      sidebarSubscriptions,
+    },
+    render: createElement => createElement('sidebar-subscriptions', {}),
+  });
+}
+
 function domContentLoaded() {
   const sidebarOptions = JSON.parse(document.querySelector('.js-sidebar-options').innerHTML);
   const mediator = new Mediator(sidebarOptions);
@@ -63,6 +95,8 @@ function domContentLoaded() {
 
   mountConfidentialComponent(mediator);
   mountLockComponent(mediator);
+  mountParticipantsComponent();
+  mountSubscriptionsComponent();
 
   new SidebarMoveIssue(
     mediator,
diff --git a/app/assets/javascripts/sidebar/sidebar_mediator.js b/app/assets/javascripts/sidebar/sidebar_mediator.js
index ede3a0de144..2bda5a47791 100644
--- a/app/assets/javascripts/sidebar/sidebar_mediator.js
+++ b/app/assets/javascripts/sidebar/sidebar_mediator.js
@@ -8,6 +8,7 @@ export default class SidebarMediator {
       this.store = new Store(options);
       this.service = new Service({
         endpoint: options.endpoint,
+        toggleSubscriptionEndpoint: options.toggleSubscriptionEndpoint,
         moveIssueEndpoint: options.moveIssueEndpoint,
         projectsAutocompleteEndpoint: options.projectsAutocompleteEndpoint,
       });
@@ -39,10 +40,25 @@ export default class SidebarMediator {
       .then((data) => {
         this.store.setAssigneeData(data);
         this.store.setTimeTrackingData(data);
+        this.store.setParticipantsData(data);
+        this.store.setSubscriptionsData(data);
       })
       .catch(() => new Flash('Error occurred when fetching sidebar data'));
   }
 
+  toggleSubscription() {
+    this.store.setFetchingState('subscriptions', true);
+    return this.service.toggleSubscription()
+      .then(() => {
+        this.store.setSubscribedState(!this.store.subscribed);
+        this.store.setFetchingState('subscriptions', false);
+      })
+      .catch((err) => {
+        this.store.setFetchingState('subscriptions', false);
+        throw err;
+      });
+  }
+
   fetchAutocompleteProjects(searchTerm) {
     return this.service.getProjectsAutocomplete(searchTerm)
       .then(response => response.json())
diff --git a/app/assets/javascripts/sidebar/stores/sidebar_store.js b/app/assets/javascripts/sidebar/stores/sidebar_store.js
index d5d04103f3f..3150221b685 100644
--- a/app/assets/javascripts/sidebar/stores/sidebar_store.js
+++ b/app/assets/javascripts/sidebar/stores/sidebar_store.js
@@ -12,10 +12,14 @@ export default class SidebarStore {
       this.assignees = [];
       this.isFetching = {
         assignees: true,
+        participants: true,
+        subscriptions: true,
       };
       this.autocompleteProjects = [];
       this.moveToProjectId = 0;
       this.isLockDialogOpen = false;
+      this.participants = [];
+      this.subscribed = null;
 
       SidebarStore.singleton = this;
     }
@@ -37,6 +41,20 @@ export default class SidebarStore {
     this.humanTotalTimeSpent = data.human_total_time_spent;
   }
 
+  setParticipantsData(data) {
+    this.isFetching.participants = false;
+    this.participants = data.participants || [];
+  }
+
+  setSubscriptionsData(data) {
+    this.isFetching.subscriptions = false;
+    this.subscribed = data.subscribed || false;
+  }
+
+  setFetchingState(key, value) {
+    this.isFetching[key] = value;
+  }
+
   addAssignee(assignee) {
     if (!this.findAssignee(assignee)) {
       this.assignees.push(assignee);
@@ -61,6 +79,10 @@ export default class SidebarStore {
     this.autocompleteProjects = projects;
   }
 
+  setSubscribedState(subscribed) {
+    this.subscribed = subscribed;
+  }
+
   setMoveToProjectId(moveToProjectId) {
     this.moveToProjectId = moveToProjectId;
   }
diff --git a/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js b/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js
index 79c3d335679..99f5c305df5 100644
--- a/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js
+++ b/app/assets/javascripts/vue_merge_request_widget/services/mr_widget_service.js
@@ -11,7 +11,7 @@ export default class MRWidgetService {
     this.removeWIPResource = Vue.resource(endpoints.removeWIPPath);
     this.removeSourceBranchResource = Vue.resource(endpoints.sourceBranchPath);
     this.deploymentsResource = Vue.resource(endpoints.ciEnvironmentsStatusPath);
-    this.pollResource = Vue.resource(`${endpoints.statusPath}?basic=true`);
+    this.pollResource = Vue.resource(`${endpoints.statusPath}?serializer=basic`);
     this.mergeActionsContentResource = Vue.resource(endpoints.mergeActionsContentPath);
   }
 
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 48532503263..88600a0e6d3 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -542,7 +542,9 @@
 }
 
 .participants-list {
-  margin: -5px;
+  display: flex;
+  flex-wrap: wrap;
+  margin: -7px;
 }
 
 
@@ -553,7 +555,7 @@
 
 .participants-author {
   display: inline-block;
-  padding: 5px;
+  padding: 7px;
 
   &:nth-of-type(7n) {
     padding-right: 0;
diff --git a/app/controllers/projects/issues_controller.rb b/app/controllers/projects/issues_controller.rb
index fe1334c0cfe..6a5e4538717 100644
--- a/app/controllers/projects/issues_controller.rb
+++ b/app/controllers/projects/issues_controller.rb
@@ -74,7 +74,7 @@ class Projects::IssuesController < Projects::ApplicationController
     respond_to do |format|
       format.html
       format.json do
-        render json: serializer.represent(@issue)
+        render json: serializer.represent(@issue, serializer: params[:serializer])
       end
     end
   end
diff --git a/app/controllers/projects/merge_requests_controller.rb b/app/controllers/projects/merge_requests_controller.rb
index c5204080333..2b0294c8387 100644
--- a/app/controllers/projects/merge_requests_controller.rb
+++ b/app/controllers/projects/merge_requests_controller.rb
@@ -83,7 +83,7 @@ class Projects::MergeRequestsController < Projects::MergeRequests::ApplicationCo
       format.json do
         Gitlab::PollingInterval.set_header(response, interval: 10_000)
 
-        render json: serializer.represent(@merge_request, basic: params[:basic])
+        render json: serializer.represent(@merge_request, serializer: params[:serializer])
       end
 
       format.patch  do
diff --git a/app/helpers/issuables_helper.rb b/app/helpers/issuables_helper.rb
index baa2d6e375e..d0069cd48cf 100644
--- a/app/helpers/issuables_helper.rb
+++ b/app/helpers/issuables_helper.rb
@@ -33,15 +33,17 @@ module IssuablesHelper
   end
 
   def serialize_issuable(issuable)
-    case issuable
-    when Issue
-      IssueSerializer.new(current_user: current_user, project: issuable.project).represent(issuable).to_json
-    when MergeRequest
-      MergeRequestSerializer
-        .new(current_user: current_user, project: issuable.project)
-        .represent(issuable)
-        .to_json
-    end
+    serializer_klass = case issuable
+                       when Issue
+                         IssueSerializer
+                       when MergeRequest
+                         MergeRequestSerializer
+                       end
+
+    serializer_klass
+      .new(current_user: current_user, project: issuable.project)
+      .represent(issuable)
+      .to_json
   end
 
   def template_dropdown_tag(issuable, &block)
@@ -357,7 +359,8 @@ module IssuablesHelper
 
   def issuable_sidebar_options(issuable, can_edit_issuable)
     {
-      endpoint: "#{issuable_json_path(issuable)}?basic=true",
+      endpoint: "#{issuable_json_path(issuable)}?serializer=sidebar",
+      toggleSubscriptionEndpoint: toggle_subscription_path(issuable),
       moveIssueEndpoint: move_namespace_project_issue_path(namespace_id: issuable.project.namespace.to_param, project_id: issuable.project, id: issuable),
       projectsAutocompleteEndpoint: autocomplete_projects_path(project_id: @project.id),
       editable: can_edit_issuable,
diff --git a/app/models/concerns/subscribable.rb b/app/models/concerns/subscribable.rb
index 274b38a7708..f478c8ede18 100644
--- a/app/models/concerns/subscribable.rb
+++ b/app/models/concerns/subscribable.rb
@@ -13,6 +13,8 @@ module Subscribable
   end
 
   def subscribed?(user, project = nil)
+    return false unless user
+
     if subscription = subscriptions.find_by(user: user, project: project)
       subscription.subscribed
     else
diff --git a/app/serializers/issuable_sidebar_entity.rb b/app/serializers/issuable_sidebar_entity.rb
new file mode 100644
index 00000000000..ff23d8bf0c7
--- /dev/null
+++ b/app/serializers/issuable_sidebar_entity.rb
@@ -0,0 +1,16 @@
+class IssuableSidebarEntity < Grape::Entity
+  include RequestAwareEntity
+
+  expose :participants, using: ::API::Entities::UserBasic do |issuable|
+    issuable.participants(request.current_user)
+  end
+
+  expose :subscribed do |issuable|
+    issuable.subscribed?(request.current_user, issuable.project)
+  end
+
+  expose :time_estimate
+  expose :total_time_spent
+  expose :human_time_estimate
+  expose :human_total_time_spent
+end
diff --git a/app/serializers/issue_serializer.rb b/app/serializers/issue_serializer.rb
index 4fff54a9126..2555595379b 100644
--- a/app/serializers/issue_serializer.rb
+++ b/app/serializers/issue_serializer.rb
@@ -1,3 +1,16 @@
 class IssueSerializer < BaseSerializer
-  entity IssueEntity
+  # This overrided method takes care of which entity should be used
+  # to serialize the `issue` based on `basic` key in `opts` param.
+  # Hence, `entity` doesn't need to be declared on the class scope.
+  def represent(merge_request, opts = {})
+    entity =
+      case opts[:serializer]
+      when 'sidebar'
+        IssueSidebarEntity
+      else
+        IssueEntity
+      end
+
+    super(merge_request, opts, entity)
+  end
 end
diff --git a/app/serializers/issue_sidebar_entity.rb b/app/serializers/issue_sidebar_entity.rb
new file mode 100644
index 00000000000..6c823dbfe95
--- /dev/null
+++ b/app/serializers/issue_sidebar_entity.rb
@@ -0,0 +1,3 @@
+class IssueSidebarEntity < IssuableSidebarEntity
+  expose :assignees, using: API::Entities::UserBasic
+end
diff --git a/app/serializers/merge_request_basic_entity.rb b/app/serializers/merge_request_basic_entity.rb
index 8461f158bb5..d54a6516aed 100644
--- a/app/serializers/merge_request_basic_entity.rb
+++ b/app/serializers/merge_request_basic_entity.rb
@@ -1,11 +1,7 @@
-class MergeRequestBasicEntity < Grape::Entity
+class MergeRequestBasicEntity < IssuableSidebarEntity
   expose :assignee_id
   expose :merge_status
   expose :merge_error
   expose :state
   expose :source_branch_exists?, as: :source_branch_exists
-  expose :time_estimate
-  expose :total_time_spent
-  expose :human_time_estimate
-  expose :human_total_time_spent
 end
diff --git a/app/serializers/merge_request_serializer.rb b/app/serializers/merge_request_serializer.rb
index f67034ce47a..e9d98d8baca 100644
--- a/app/serializers/merge_request_serializer.rb
+++ b/app/serializers/merge_request_serializer.rb
@@ -3,7 +3,14 @@ class MergeRequestSerializer < BaseSerializer
   # to serialize the `merge_request` based on `basic` key in `opts` param.
   # Hence, `entity` doesn't need to be declared on the class scope.
   def represent(merge_request, opts = {})
-    entity = opts[:basic] ? MergeRequestBasicEntity : MergeRequestEntity
+    entity =
+      case opts[:serializer]
+      when 'basic', 'sidebar'
+        MergeRequestBasicEntity
+      else
+        MergeRequestEntity
+      end
+
     super(merge_request, opts, entity)
   end
 end
diff --git a/app/views/shared/issuable/_participants.html.haml b/app/views/shared/issuable/_participants.html.haml
deleted file mode 100644
index 3f553c9fede..00000000000
--- a/app/views/shared/issuable/_participants.html.haml
+++ /dev/null
@@ -1,18 +0,0 @@
-- participants_row = 7
-- participants_size = participants.size
-- participants_extra = participants_size - participants_row
-.block.participants
-  .sidebar-collapsed-icon
-    = icon('users')
-    %span
-      = participants.count
-  .title.hide-collapsed
-    = pluralize participants.count, "participant"
-  .hide-collapsed.participants-list
-    - participants.each do |participant|
-      .participants-author.js-participants-author
-        = link_to_member(@project, participant, name: false, size: 24, lazy_load: true)
-  - if participants_extra > 0
-    .hide-collapsed.participants-more
-      %button.btn-transparent.btn-blank.js-participants-more{ type: 'button', data: { original_text: "+ #{participants_size - 7} more", less_text: "- show less" } }
-        + #{participants_extra} more
diff --git a/app/views/shared/issuable/_sidebar.html.haml b/app/views/shared/issuable/_sidebar.html.haml
index 7b7411b1e23..e0009a35b9f 100644
--- a/app/views/shared/issuable/_sidebar.html.haml
+++ b/app/views/shared/issuable/_sidebar.html.haml
@@ -123,17 +123,10 @@
         %script#js-lock-issue-data{ type: "application/json" }= { is_locked: issuable.discussion_locked?, is_editable: can_edit_issuable }.to_json.html_safe
         #js-lock-entry-point
 
-      = render "shared/issuable/participants", participants: issuable.participants(current_user)
+      .js-sidebar-participants-entry-point
+
       - if current_user
-        - subscribed = issuable.subscribed?(current_user, @project)
-        .block.light.subscription{ data: { url: toggle_subscription_path(issuable) } }
-          .sidebar-collapsed-icon
-            = icon('rss', 'aria-hidden': 'true')
-          %span.issuable-header-text.hide-collapsed.pull-left
-            Notifications
-          - subscribtion_status = subscribed ? 'subscribed' : 'unsubscribed'
-          %button.btn.btn-default.pull-right.js-subscribe-button.issuable-subscribe-button.hide-collapsed{ type: "button" }
-            %span= subscribed ? 'Unsubscribe' : 'Subscribe'
+        .js-sidebar-subscriptions-entry-point
 
       - project_ref = cross_project_reference(@project, issuable)
       .block.project-reference
diff --git a/changelogs/unreleased/23206-load-participants-async.yml b/changelogs/unreleased/23206-load-participants-async.yml
new file mode 100644
index 00000000000..12ab43fb88f
--- /dev/null
+++ b/changelogs/unreleased/23206-load-participants-async.yml
@@ -0,0 +1,5 @@
+---
+title: Update participants and subscriptions button in issuable sidebar to be async
+merge_request: 14836
+author:
+type: changed
diff --git a/features/steps/project/issues/issues.rb b/features/steps/project/issues/issues.rb
index 2c3ef2efd52..3843374678c 100644
--- a/features/steps/project/issues/issues.rb
+++ b/features/steps/project/issues/issues.rb
@@ -20,11 +20,13 @@ class Spinach::Features::ProjectIssues < Spinach::FeatureSteps
   end
 
   step 'I should see that I am subscribed' do
-    expect(find('.issuable-subscribe-button span')).to have_content 'Unsubscribe'
+    wait_for_requests
+    expect(find('.js-issuable-subscribe-button span')).to have_content 'Unsubscribe'
   end
 
   step 'I should see that I am unsubscribed' do
-    expect(find('.issuable-subscribe-button span')).to have_content 'Subscribe'
+    wait_for_requests
+    expect(find('.js-issuable-subscribe-button span')).to have_content 'Subscribe'
   end
 
   step 'I click link "Closed"' do
diff --git a/spec/controllers/projects/merge_requests_controller_spec.rb b/spec/controllers/projects/merge_requests_controller_spec.rb
index b7cccddefdd..52ef8c6a589 100644
--- a/spec/controllers/projects/merge_requests_controller_spec.rb
+++ b/spec/controllers/projects/merge_requests_controller_spec.rb
@@ -83,15 +83,15 @@ describe Projects::MergeRequestsController do
     end
 
     describe 'as json' do
-      context 'with basic param' do
+      context 'with basic serializer param' do
         it 'renders basic MR entity as json' do
-          go(basic: true, format: :json)
+          go(serializer: 'basic', format: :json)
 
           expect(response).to match_response_schema('entities/merge_request_basic')
         end
       end
 
-      context 'without basic param' do
+      context 'without basic serializer param' do
         it 'renders the merge request in the json format' do
           go(format: :json)
 
diff --git a/spec/features/boards/boards_spec.rb b/spec/features/boards/boards_spec.rb
index 60ed17c0c81..ebe6939df4c 100644
--- a/spec/features/boards/boards_spec.rb
+++ b/spec/features/boards/boards_spec.rb
@@ -538,7 +538,7 @@ describe 'Issue Boards', :js do
     end
 
     it 'does not show create new list' do
-      expect(page).not_to have_selector('.js-new-board-list')
+      expect(page).not_to have_button('.js-new-board-list')
     end
 
     it 'does not allow dragging' do
diff --git a/spec/features/projects/merge_requests/user_manages_subscription_spec.rb b/spec/features/projects/merge_requests/user_manages_subscription_spec.rb
index 30a80f8e652..4ca435491cb 100644
--- a/spec/features/projects/merge_requests/user_manages_subscription_spec.rb
+++ b/spec/features/projects/merge_requests/user_manages_subscription_spec.rb
@@ -13,7 +13,7 @@ describe 'User manages subscription', :js do
   end
 
   it 'toggles subscription' do
-    subscribe_button = find('.issuable-subscribe-button span')
+    subscribe_button = find('.js-issuable-subscribe-button')
 
     expect(subscribe_button).to have_content('Subscribe')
 
diff --git a/spec/fixtures/api/schemas/entities/issue.json b/spec/fixtures/api/schemas/entities/issue.json
new file mode 100644
index 00000000000..3d3329a3406
--- /dev/null
+++ b/spec/fixtures/api/schemas/entities/issue.json
@@ -0,0 +1,44 @@
+{
+  "type": "object",
+  "properties" : {
+    "id": { "type": "integer" },
+    "iid": { "type": "integer" },
+    "author_id": { "type": "integer" },
+    "description": { "type": ["string", "null"] },
+    "lock_version": { "type": ["string", "null"] },
+    "milestone_id": { "type": ["string", "null"] },
+    "title": { "type": "string" },
+    "moved_to_id": { "type": ["integer", "null"] },
+    "project_id": { "type": "integer" },
+    "web_url": { "type": "string" },
+    "state": { "type": "string" },
+    "create_note_path": { "type": "string" },
+    "preview_note_path": { "type": "string" },
+    "current_user": {
+      "type": "object",
+      "properties": {
+        "can_create_note": { "type": "boolean" },
+        "can_update": { "type": "boolean" }
+      }
+    },
+    "created_at": { "type": "date-time" },
+    "updated_at": { "type": "date-time" },
+    "branch_name": { "type": ["string", "null"] },
+    "due_date": { "type": "date" },
+    "confidential": { "type": "boolean" },
+    "discussion_locked": { "type": ["boolean", "null"] },
+    "updated_by_id": { "type": ["string", "null"] },
+    "deleted_at": { "type": ["string", "null"] },
+    "time_estimate": { "type": "integer" },
+    "total_time_spent": { "type": "integer" },
+    "human_time_estimate": { "type": ["integer", "null"] },
+    "human_total_time_spent": { "type": ["integer", "null"] },
+    "milestone": { "type": ["object", "null"] },
+    "labels": {
+      "type": "array",
+      "items": { "$ref": "label.json" }
+    },
+    "assignees": { "type": ["array", "null"] }
+  },
+  "additionalProperties": false
+}
diff --git a/spec/fixtures/api/schemas/entities/issue_sidebar.json b/spec/fixtures/api/schemas/entities/issue_sidebar.json
new file mode 100644
index 00000000000..682e345d5f5
--- /dev/null
+++ b/spec/fixtures/api/schemas/entities/issue_sidebar.json
@@ -0,0 +1,21 @@
+{
+  "type": "object",
+  "properties" : {
+    "id": { "type": "integer" },
+    "iid": { "type": "integer" },
+    "subscribed": { "type": "boolean" },
+    "time_estimate": { "type": "integer" },
+    "total_time_spent": { "type": "integer" },
+    "human_time_estimate": { "type": ["integer", "null"] },
+    "human_total_time_spent": { "type": ["integer", "null"] },
+    "participants": {
+      "type": "array",
+      "items": { "$ref": "../public_api/v4/user/basic.json" }
+    },
+    "assignees": {
+      "type": "array",
+      "items": { "$ref": "../public_api/v4/user/basic.json" }
+    }
+  },
+  "additionalProperties": false
+}
diff --git a/spec/fixtures/api/schemas/entities/label.json b/spec/fixtures/api/schemas/entities/label.json
new file mode 100644
index 00000000000..40dff764c17
--- /dev/null
+++ b/spec/fixtures/api/schemas/entities/label.json
@@ -0,0 +1,26 @@
+{
+  "type": "object",
+  "required": [
+    "id",
+    "color",
+    "description",
+    "title",
+    "priority"
+  ],
+  "properties": {
+    "id": { "type": "integer" },
+    "color": {
+      "type": "string",
+      "pattern": "^#[0-9A-Fa-f]{3}{1,2}$"
+    },
+    "description": { "type": ["string", "null"] },
+    "text_color": {
+      "type": "string",
+      "pattern": "^#[0-9A-Fa-f]{3}{1,2}$"
+    },
+    "type": { "type": "string" },
+    "title": { "type": "string" },
+    "priority": { "type": ["integer", "null"] }
+  },
+  "additionalProperties": false
+}
\ No newline at end of file
diff --git a/spec/fixtures/api/schemas/entities/merge_request_basic.json b/spec/fixtures/api/schemas/entities/merge_request_basic.json
index 6b14188582a..995f13381ad 100644
--- a/spec/fixtures/api/schemas/entities/merge_request_basic.json
+++ b/spec/fixtures/api/schemas/entities/merge_request_basic.json
@@ -9,7 +9,9 @@
     "human_time_estimate": { "type": ["string", "null"] },
     "human_total_time_spent": { "type": ["string", "null"] },
     "merge_error": { "type": ["string", "null"] },
-    "assignee_id": { "type": ["integer", "null"] }
+    "assignee_id": { "type": ["integer", "null"] },
+    "subscribed": { "type": ["boolean", "null"] },
+    "participants": { "type": "array" }
   },
   "additionalProperties": false
 }
diff --git a/spec/fixtures/api/schemas/issue.json b/spec/fixtures/api/schemas/issue.json
index e1f62508933..a55ecaa5697 100644
--- a/spec/fixtures/api/schemas/issue.json
+++ b/spec/fixtures/api/schemas/issue.json
@@ -19,32 +19,7 @@
     },
     "labels": {
       "type": "array",
-      "items": {
-        "type": "object",
-        "required": [
-          "id",
-          "color",
-          "description",
-          "title",
-          "priority"
-        ],
-        "properties": {
-          "id": { "type": "integer" },
-          "color": {
-            "type": "string",
-            "pattern": "^#[0-9A-Fa-f]{3}{1,2}+$"
-          },
-          "description": { "type": ["string", "null"] },
-          "text_color": {
-            "type": "string",
-            "pattern": "^#[0-9A-Fa-f]{3}{1,2}+$"
-          },
-          "type": { "type": "string" },
-          "title": { "type": "string" },
-          "priority": { "type": ["integer", "null"] }
-        },
-        "additionalProperties": false
-      }
+      "items": { "$ref": "entities/label.json" }
     },
     "assignee": {
       "id": { "type": "integet" },
diff --git a/spec/javascripts/issuable_context_spec.js b/spec/javascripts/issuable_context_spec.js
deleted file mode 100644
index f266209027a..00000000000
--- a/spec/javascripts/issuable_context_spec.js
+++ /dev/null
@@ -1,33 +0,0 @@
-import $ from 'jquery';
-import IssuableContext from '~/issuable_context';
-
-describe('IssuableContext', () => {
-  describe('toggleHiddenParticipants', () => {
-    const event = jasmine.createSpyObj('event', ['preventDefault']);
-
-    beforeEach(() => {
-      spyOn($.fn, 'data').and.returnValue('data');
-      spyOn($.fn, 'text').and.returnValue('data');
-    });
-
-    afterEach(() => {
-      gl.lazyLoader = undefined;
-    });
-
-    it('calls loadCheck if lazyLoader is set', () => {
-      gl.lazyLoader = jasmine.createSpyObj('lazyLoader', ['loadCheck']);
-
-      IssuableContext.prototype.toggleHiddenParticipants(event);
-
-      expect(gl.lazyLoader.loadCheck).toHaveBeenCalled();
-    });
-
-    it('does not throw if lazyLoader is not defined', () => {
-      gl.lazyLoader = undefined;
-
-      const toggle = IssuableContext.prototype.toggleHiddenParticipants.bind(null, event);
-
-      expect(toggle).not.toThrow();
-    });
-  });
-});
diff --git a/spec/javascripts/sidebar/mock_data.js b/spec/javascripts/sidebar/mock_data.js
index e2b6bcabc98..0682b463043 100644
--- a/spec/javascripts/sidebar/mock_data.js
+++ b/spec/javascripts/sidebar/mock_data.js
@@ -109,12 +109,14 @@ const sidebarMockData = {
       labels: [],
       web_url: '/root/some-project/issues/5',
     },
+    '/gitlab-org/gitlab-shell/issues/5/toggle_subscription': {},
   },
 };
 
 export default {
   mediator: {
     endpoint: '/gitlab-org/gitlab-shell/issues/5.json',
+    toggleSubscriptionEndpoint: '/gitlab-org/gitlab-shell/issues/5/toggle_subscription',
     moveIssueEndpoint: '/gitlab-org/gitlab-shell/issues/5/move',
     projectsAutocompleteEndpoint: '/autocomplete/projects?project_id=15',
     editable: true,
diff --git a/spec/javascripts/sidebar/participants_spec.js b/spec/javascripts/sidebar/participants_spec.js
new file mode 100644
index 00000000000..30cc549c7c0
--- /dev/null
+++ b/spec/javascripts/sidebar/participants_spec.js
@@ -0,0 +1,174 @@
+import Vue from 'vue';
+import participants from '~/sidebar/components/participants/participants.vue';
+import mountComponent from '../helpers/vue_mount_component_helper';
+
+const PARTICIPANT = {
+  id: 1,
+  state: 'active',
+  username: 'marcene',
+  name: 'Allie Will',
+  web_url: 'foo.com',
+  avatar_url: 'gravatar.com/avatar/xxx',
+};
+
+const PARTICIPANT_LIST = [
+  PARTICIPANT,
+  { ...PARTICIPANT, id: 2 },
+  { ...PARTICIPANT, id: 3 },
+];
+
+describe('Participants', function () {
+  let vm;
+  let Participants;
+
+  beforeEach(() => {
+    Participants = Vue.extend(participants);
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  describe('collapsed sidebar state', () => {
+    it('shows loading spinner when loading', () => {
+      vm = mountComponent(Participants, {
+        loading: true,
+      });
+
+      expect(vm.$el.querySelector('.js-participants-collapsed-loading-icon')).toBeDefined();
+    });
+
+    it('shows participant count when given', () => {
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+      });
+      const countEl = vm.$el.querySelector('.js-participants-collapsed-count');
+
+      expect(countEl.textContent.trim()).toBe(`${PARTICIPANT_LIST.length}`);
+    });
+
+    it('shows full participant count when there are hidden participants', () => {
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+        numberOfLessParticipants: 1,
+      });
+      const countEl = vm.$el.querySelector('.js-participants-collapsed-count');
+
+      expect(countEl.textContent.trim()).toBe(`${PARTICIPANT_LIST.length}`);
+    });
+  });
+
+  describe('expanded sidebar state', () => {
+    it('shows loading spinner when loading', () => {
+      vm = mountComponent(Participants, {
+        loading: true,
+      });
+
+      expect(vm.$el.querySelector('.js-participants-expanded-loading-icon')).toBeDefined();
+    });
+
+    it('when only showing visible participants, shows an avatar only for each participant under the limit', (done) => {
+      const numberOfLessParticipants = 2;
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+        numberOfLessParticipants,
+      });
+      vm.isShowingMoreParticipants = false;
+
+      Vue.nextTick()
+        .then(() => {
+          const participantEls = vm.$el.querySelectorAll('.js-participants-author');
+
+          expect(participantEls.length).toBe(numberOfLessParticipants);
+        })
+        .then(done)
+        .catch(done.fail);
+    });
+
+    it('when only showing all participants, each has an avatar', (done) => {
+      const numberOfLessParticipants = 2;
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+        numberOfLessParticipants,
+      });
+      vm.isShowingMoreParticipants = true;
+
+      Vue.nextTick()
+        .then(() => {
+          const participantEls = vm.$el.querySelectorAll('.js-participants-author');
+
+          expect(participantEls.length).toBe(PARTICIPANT_LIST.length);
+        })
+        .then(done)
+        .catch(done.fail);
+    });
+
+    it('does not have more participants link when they can all be shown', () => {
+      const numberOfLessParticipants = 100;
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+        numberOfLessParticipants,
+      });
+      const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
+
+      expect(PARTICIPANT_LIST.length).toBeLessThan(numberOfLessParticipants);
+      expect(moreParticipantLink).toBeNull();
+    });
+
+    it('when too many participants, has more participants link to show more', (done) => {
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+        numberOfLessParticipants: 2,
+      });
+      vm.isShowingMoreParticipants = false;
+
+      Vue.nextTick()
+        .then(() => {
+          const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
+
+          expect(moreParticipantLink.textContent.trim()).toBe('+ 1 more');
+        })
+        .then(done)
+        .catch(done.fail);
+    });
+
+    it('when too many participants and already showing them, has more participants link to show less', (done) => {
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+        numberOfLessParticipants: 2,
+      });
+      vm.isShowingMoreParticipants = true;
+
+      Vue.nextTick()
+        .then(() => {
+          const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
+
+          expect(moreParticipantLink.textContent.trim()).toBe('- show less');
+        })
+        .then(done)
+        .catch(done.fail);
+    });
+
+    it('clicking more participants link emits event', () => {
+      vm = mountComponent(Participants, {
+        loading: false,
+        participants: PARTICIPANT_LIST,
+        numberOfLessParticipants: 2,
+      });
+      const moreParticipantLink = vm.$el.querySelector('.js-toggle-participants-button');
+
+      expect(vm.isShowingMoreParticipants).toBe(false);
+
+      moreParticipantLink.click();
+
+      expect(vm.isShowingMoreParticipants).toBe(true);
+    });
+  });
+});
diff --git a/spec/javascripts/sidebar/sidebar_mediator_spec.js b/spec/javascripts/sidebar/sidebar_mediator_spec.js
index 3aa8ca5db0d..7deb1fd2118 100644
--- a/spec/javascripts/sidebar/sidebar_mediator_spec.js
+++ b/spec/javascripts/sidebar/sidebar_mediator_spec.js
@@ -57,8 +57,8 @@ describe('Sidebar mediator', () => {
       .then(() => {
         expect(this.mediator.service.getProjectsAutocomplete).toHaveBeenCalledWith(searchTerm);
         expect(this.mediator.store.setAutocompleteProjects).toHaveBeenCalled();
-        done();
       })
+      .then(done)
       .catch(done.fail);
   });
 
@@ -72,8 +72,21 @@ describe('Sidebar mediator', () => {
       .then(() => {
         expect(this.mediator.service.moveIssue).toHaveBeenCalledWith(moveToProjectId);
         expect(gl.utils.visitUrl).toHaveBeenCalledWith('/root/some-project/issues/5');
-        done();
       })
+      .then(done)
+      .catch(done.fail);
+  });
+
+  it('toggle subscription', (done) => {
+    this.mediator.store.setSubscribedState(false);
+    spyOn(this.mediator.service, 'toggleSubscription').and.callThrough();
+
+    this.mediator.toggleSubscription()
+      .then(() => {
+        expect(this.mediator.service.toggleSubscription).toHaveBeenCalled();
+        expect(this.mediator.store.subscribed).toEqual(true);
+      })
+      .then(done)
       .catch(done.fail);
   });
 });
diff --git a/spec/javascripts/sidebar/sidebar_service_spec.js b/spec/javascripts/sidebar/sidebar_service_spec.js
index a4bd8ba8d88..7324d34d84a 100644
--- a/spec/javascripts/sidebar/sidebar_service_spec.js
+++ b/spec/javascripts/sidebar/sidebar_service_spec.js
@@ -7,6 +7,7 @@ describe('Sidebar service', () => {
     Vue.http.interceptors.push(Mock.sidebarMockInterceptor);
     this.service = new SidebarService({
       endpoint: '/gitlab-org/gitlab-shell/issues/5.json',
+      toggleSubscriptionEndpoint: '/gitlab-org/gitlab-shell/issues/5/toggle_subscription',
       moveIssueEndpoint: '/gitlab-org/gitlab-shell/issues/5/move',
       projectsAutocompleteEndpoint: '/autocomplete/projects?project_id=15',
     });
@@ -23,6 +24,7 @@ describe('Sidebar service', () => {
         expect(resp).toBeDefined();
         done();
       })
+      .then(done)
       .catch(done.fail);
   });
 
@@ -30,8 +32,8 @@ describe('Sidebar service', () => {
     this.service.update('issue[assignee_ids]', [1])
       .then((resp) => {
         expect(resp).toBeDefined();
-        done();
       })
+      .then(done)
       .catch(done.fail);
   });
 
@@ -39,8 +41,8 @@ describe('Sidebar service', () => {
     this.service.getProjectsAutocomplete()
       .then((resp) => {
         expect(resp).toBeDefined();
-        done();
       })
+      .then(done)
       .catch(done.fail);
   });
 
@@ -48,8 +50,17 @@ describe('Sidebar service', () => {
     this.service.moveIssue(123)
       .then((resp) => {
         expect(resp).toBeDefined();
-        done();
       })
+      .then(done)
+      .catch(done.fail);
+  });
+
+  it('toggles the subscription', (done) => {
+    this.service.toggleSubscription()
+      .then((resp) => {
+        expect(resp).toBeDefined();
+      })
+      .then(done)
       .catch(done.fail);
   });
 });
diff --git a/spec/javascripts/sidebar/sidebar_store_spec.js b/spec/javascripts/sidebar/sidebar_store_spec.js
index 69eb3839d67..51dee64fb93 100644
--- a/spec/javascripts/sidebar/sidebar_store_spec.js
+++ b/spec/javascripts/sidebar/sidebar_store_spec.js
@@ -2,21 +2,36 @@ import SidebarStore from '~/sidebar/stores/sidebar_store';
 import Mock from './mock_data';
 import UsersMockHelper from '../helpers/user_mock_data_helper';
 
-describe('Sidebar store', () => {
-  const assignee = {
-    id: 2,
-    name: 'gitlab user 2',
-    username: 'gitlab2',
-    avatar_url: 'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
-  };
-
-  const anotherAssignee = {
-    id: 3,
-    name: 'gitlab user 3',
-    username: 'gitlab3',
-    avatar_url: 'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
-  };
+const ASSIGNEE = {
+  id: 2,
+  name: 'gitlab user 2',
+  username: 'gitlab2',
+  avatar_url: 'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+};
+
+const ANOTHER_ASSINEE = {
+  id: 3,
+  name: 'gitlab user 3',
+  username: 'gitlab3',
+  avatar_url: 'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon',
+};
+
+const PARTICIPANT = {
+  id: 1,
+  state: 'active',
+  username: 'marcene',
+  name: 'Allie Will',
+  web_url: 'foo.com',
+  avatar_url: 'gravatar.com/avatar/xxx',
+};
+
+const PARTICIPANT_LIST = [
+  PARTICIPANT,
+  { ...PARTICIPANT, id: 2 },
+  { ...PARTICIPANT, id: 3 },
+];
 
+describe('Sidebar store', () => {
   beforeEach(() => {
     this.store = new SidebarStore({
       currentUser: {
@@ -40,23 +55,23 @@ describe('Sidebar store', () => {
   });
 
   it('adds a new assignee', () => {
-    this.store.addAssignee(assignee);
+    this.store.addAssignee(ASSIGNEE);
     expect(this.store.assignees.length).toEqual(1);
   });
 
   it('removes an assignee', () => {
-    this.store.removeAssignee(assignee);
+    this.store.removeAssignee(ASSIGNEE);
     expect(this.store.assignees.length).toEqual(0);
   });
 
   it('finds an existent assignee', () => {
     let foundAssignee;
 
-    this.store.addAssignee(assignee);
-    foundAssignee = this.store.findAssignee(assignee);
+    this.store.addAssignee(ASSIGNEE);
+    foundAssignee = this.store.findAssignee(ASSIGNEE);
     expect(foundAssignee).toBeDefined();
-    expect(foundAssignee).toEqual(assignee);
-    foundAssignee = this.store.findAssignee(anotherAssignee);
+    expect(foundAssignee).toEqual(ASSIGNEE);
+    foundAssignee = this.store.findAssignee(ANOTHER_ASSINEE);
     expect(foundAssignee).toBeUndefined();
   });
 
@@ -65,6 +80,28 @@ describe('Sidebar store', () => {
     expect(this.store.assignees.length).toEqual(0);
   });
 
+  it('sets participants data', () => {
+    expect(this.store.participants.length).toEqual(0);
+
+    this.store.setParticipantsData({
+      participants: PARTICIPANT_LIST,
+    });
+
+    expect(this.store.isFetching.participants).toEqual(false);
+    expect(this.store.participants.length).toEqual(PARTICIPANT_LIST.length);
+  });
+
+  it('sets subcriptions data', () => {
+    expect(this.store.subscribed).toEqual(null);
+
+    this.store.setSubscriptionsData({
+      subscribed: true,
+    });
+
+    expect(this.store.isFetching.subscriptions).toEqual(false);
+    expect(this.store.subscribed).toEqual(true);
+  });
+
   it('set assigned data', () => {
     const users = {
       assignees: UsersMockHelper.createNumberRandomUsers(3),
@@ -75,6 +112,14 @@ describe('Sidebar store', () => {
     expect(this.store.assignees.length).toEqual(3);
   });
 
+  it('sets fetching state', () => {
+    expect(this.store.isFetching.participants).toEqual(true);
+
+    this.store.setFetchingState('participants', false);
+
+    expect(this.store.isFetching.participants).toEqual(false);
+  });
+
   it('set time tracking data', () => {
     this.store.setTimeTrackingData(Mock.time);
     expect(this.store.timeEstimate).toEqual(Mock.time.time_estimate);
@@ -90,6 +135,14 @@ describe('Sidebar store', () => {
     expect(this.store.autocompleteProjects).toEqual(projects);
   });
 
+  it('sets subscribed state', () => {
+    expect(this.store.subscribed).toEqual(null);
+
+    this.store.setSubscribedState(true);
+
+    expect(this.store.subscribed).toEqual(true);
+  });
+
   it('set move to project ID', () => {
     const projectId = 7;
     this.store.setMoveToProjectId(projectId);
diff --git a/spec/javascripts/sidebar/sidebar_subscriptions_spec.js b/spec/javascripts/sidebar/sidebar_subscriptions_spec.js
new file mode 100644
index 00000000000..7adf22b0f1f
--- /dev/null
+++ b/spec/javascripts/sidebar/sidebar_subscriptions_spec.js
@@ -0,0 +1,36 @@
+import Vue from 'vue';
+import sidebarSubscriptions from '~/sidebar/components/subscriptions/sidebar_subscriptions.vue';
+import SidebarMediator from '~/sidebar/sidebar_mediator';
+import SidebarService from '~/sidebar/services/sidebar_service';
+import SidebarStore from '~/sidebar/stores/sidebar_store';
+import eventHub from '~/sidebar/event_hub';
+import mountComponent from '../helpers/vue_mount_component_helper';
+import Mock from './mock_data';
+
+describe('Sidebar Subscriptions', function () {
+  let vm;
+  let SidebarSubscriptions;
+
+  beforeEach(() => {
+    SidebarSubscriptions = Vue.extend(sidebarSubscriptions);
+    // Setup the stores, services, etc
+    // eslint-disable-next-line no-new
+    new SidebarMediator(Mock.mediator);
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+    SidebarService.singleton = null;
+    SidebarStore.singleton = null;
+    SidebarMediator.singleton = null;
+  });
+
+  it('calls the mediator toggleSubscription on event', () => {
+    spyOn(SidebarMediator.prototype, 'toggleSubscription').and.returnValue(Promise.resolve());
+    vm = mountComponent(SidebarSubscriptions, {});
+
+    eventHub.$emit('toggleSubscription');
+
+    expect(SidebarMediator.prototype.toggleSubscription).toHaveBeenCalled();
+  });
+});
diff --git a/spec/javascripts/sidebar/subscriptions_spec.js b/spec/javascripts/sidebar/subscriptions_spec.js
new file mode 100644
index 00000000000..9b33dd02fb9
--- /dev/null
+++ b/spec/javascripts/sidebar/subscriptions_spec.js
@@ -0,0 +1,42 @@
+import Vue from 'vue';
+import subscriptions from '~/sidebar/components/subscriptions/subscriptions.vue';
+import mountComponent from '../helpers/vue_mount_component_helper';
+
+describe('Subscriptions', function () {
+  let vm;
+  let Subscriptions;
+
+  beforeEach(() => {
+    Subscriptions = Vue.extend(subscriptions);
+  });
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  it('shows loading spinner when loading', () => {
+    vm = mountComponent(Subscriptions, {
+      loading: true,
+      subscribed: undefined,
+    });
+
+    expect(vm.$refs.loadingButton.loading).toBe(true);
+    expect(vm.$refs.loadingButton.label).toBeUndefined();
+  });
+
+  it('has "Subscribe" text when currently not subscribed', () => {
+    vm = mountComponent(Subscriptions, {
+      subscribed: false,
+    });
+
+    expect(vm.$refs.loadingButton.label).toBe('Subscribe');
+  });
+
+  it('has "Unsubscribe" text when currently not subscribed', () => {
+    vm = mountComponent(Subscriptions, {
+      subscribed: true,
+    });
+
+    expect(vm.$refs.loadingButton.label).toBe('Unsubscribe');
+  });
+});
diff --git a/spec/models/concerns/subscribable_spec.rb b/spec/models/concerns/subscribable_spec.rb
index 28ff8158e0e..45dfb136aea 100644
--- a/spec/models/concerns/subscribable_spec.rb
+++ b/spec/models/concerns/subscribable_spec.rb
@@ -6,6 +6,12 @@ describe Subscribable, 'Subscribable' do
   let(:user_1)   { create(:user) }
 
   describe '#subscribed?' do
+    context 'without user' do
+      it 'returns false' do
+        expect(resource.subscribed?(nil, project)).to be_falsey
+      end
+    end
+
     context 'without project' do
       it 'returns false when no subscription exists' do
         expect(resource.subscribed?(user_1)).to be_falsey
diff --git a/spec/serializers/issue_serializer_spec.rb b/spec/serializers/issue_serializer_spec.rb
new file mode 100644
index 00000000000..75578816e75
--- /dev/null
+++ b/spec/serializers/issue_serializer_spec.rb
@@ -0,0 +1,27 @@
+require 'spec_helper'
+
+describe IssueSerializer do
+  let(:resource) { create(:issue) }
+  let(:user)     { create(:user) }
+  let(:json_entity) do
+    described_class.new(current_user: user)
+      .represent(resource, serializer: serializer)
+      .with_indifferent_access
+  end
+
+  context 'non-sidebar issue serialization' do
+    let(:serializer) { nil }
+
+    it 'matches issue json schema' do
+      expect(json_entity).to match_schema('entities/issue')
+    end
+  end
+
+  context 'sidebar issue serialization' do
+    let(:serializer) { 'sidebar' }
+
+    it 'matches sidebar issue json schema' do
+      expect(json_entity).to match_schema('entities/issue_sidebar')
+    end
+  end
+end
diff --git a/spec/serializers/merge_request_basic_serializer_spec.rb b/spec/serializers/merge_request_basic_serializer_spec.rb
index 4daf5a59d0c..1fad8e6bc5d 100644
--- a/spec/serializers/merge_request_basic_serializer_spec.rb
+++ b/spec/serializers/merge_request_basic_serializer_spec.rb
@@ -4,9 +4,13 @@ describe MergeRequestBasicSerializer do
   let(:resource) { create(:merge_request) }
   let(:user)     { create(:user) }
 
-  subject { described_class.new.represent(resource) }
+  let(:json_entity) do
+    described_class.new(current_user: user)
+      .represent(resource, serializer: 'basic')
+      .with_indifferent_access
+  end
 
-  it 'has important MergeRequest attributes' do
-    expect(subject).to include(:merge_status)
+  it 'matches basic merge request json' do
+    expect(json_entity).to match_schema('entities/merge_request_basic')
   end
 end
diff --git a/spec/serializers/merge_request_serializer_spec.rb b/spec/serializers/merge_request_serializer_spec.rb
index 73fbecc153d..e3abefa6d63 100644
--- a/spec/serializers/merge_request_serializer_spec.rb
+++ b/spec/serializers/merge_request_serializer_spec.rb
@@ -9,11 +9,11 @@ describe MergeRequestSerializer do
   end
 
   describe '#represent' do
-    let(:opts) { { basic: basic } }
-    subject { serializer.represent(merge_request, basic: basic) }
+    let(:opts) { { serializer: serializer_entity } }
+    subject { serializer.represent(merge_request, serializer: serializer_entity) }
 
-    context 'when basic param is truthy' do
-      let(:basic) { true }
+    context 'when passing basic serializer param' do
+      let(:serializer_entity) { 'basic' }
 
       it 'calls super class #represent with correct params' do
         expect_any_instance_of(BaseSerializer).to receive(:represent)
@@ -23,8 +23,8 @@ describe MergeRequestSerializer do
       end
     end
 
-    context 'when basic param is falsy' do
-      let(:basic) { false }
+    context 'when serializer param is falsy' do
+      let(:serializer_entity) { nil }
 
       it 'calls super class #represent with correct params' do
         expect_any_instance_of(BaseSerializer).to receive(:represent)
diff --git a/spec/views/shared/issuable/_participants.html.haml.rb b/spec/views/shared/issuable/_participants.html.haml.rb
deleted file mode 100644
index 51059d4c0d7..00000000000
--- a/spec/views/shared/issuable/_participants.html.haml.rb
+++ /dev/null
@@ -1,26 +0,0 @@
-require 'spec_helper'
-require 'nokogiri'
-
-describe 'shared/issuable/_participants.html.haml' do
-  let(:project) { create(:project) }
-  let(:participants)  { create_list(:user, 100) }
-
-  before do
-    allow(view).to receive_messages(project: project,
-                                    participants: participants)
-  end
-
-  it 'renders lazy loaded avatars' do
-    render 'shared/issuable/participants'
-
-    html = Nokogiri::HTML(rendered)
-
-    avatars = html.css('.participants-author img')
-
-    avatars.each do |avatar|
-      expect(avatar[:class]).to include('lazy')
-      expect(avatar[:src]).to eql(LazyImageTagHelper.placeholder_image)
-      expect(avatar[:"data-src"]).to match('http://www.gravatar.com/avatar/')
-    end
-  end
-end
-- 
cgit v1.2.1


From 964cbb67da78dc89dbe32c113c5bee8f805d2784 Mon Sep 17 00:00:00 2001
From: Ahmad Sherif <me@ahmadsherif.com>
Date: Thu, 19 Oct 2017 16:18:26 +0200
Subject: Migrate Gitlab::Git::Wiki#page to Gitaly

Closes gitaly#677
---
 lib/gitlab/git/wiki.rb                   | 31 ++++++++++++++++-----
 lib/gitlab/gitaly_client/wiki_page.rb    | 25 +++++++++++++++++
 lib/gitlab/gitaly_client/wiki_service.rb | 33 +++++++++++++++++++++++
 spec/models/project_wiki_spec.rb         | 46 +++++++++++++++++++-------------
 4 files changed, 110 insertions(+), 25 deletions(-)
 create mode 100644 lib/gitlab/gitaly_client/wiki_page.rb

diff --git a/lib/gitlab/git/wiki.rb b/lib/gitlab/git/wiki.rb
index 9b387a19388..549d22adde5 100644
--- a/lib/gitlab/git/wiki.rb
+++ b/lib/gitlab/git/wiki.rb
@@ -58,14 +58,13 @@ module Gitlab
       end
 
       def page(title:, version: nil, dir: nil)
-        if version
-          version = Gitlab::Git::Commit.find(@repository, version).id
+        @repository.gitaly_migrate(:wiki_find_page) do |is_enabled|
+          if is_enabled
+            gitaly_find_page(title: title, version: version, dir: dir)
+          else
+            gollum_find_page(title: title, version: version, dir: dir)
+          end
         end
-
-        gollum_page = gollum_wiki.page(title, version, dir)
-        return unless gollum_page
-
-        new_page(gollum_page)
       end
 
       def file(name, version)
@@ -146,6 +145,17 @@ module Gitlab
         nil
       end
 
+      def gollum_find_page(title:, version: nil, dir: nil)
+        if version
+          version = Gitlab::Git::Commit.find(@repository, version).id
+        end
+
+        gollum_page = gollum_wiki.page(title, version, dir)
+        return unless gollum_page
+
+        new_page(gollum_page)
+      end
+
       def gitaly_write_page(name, format, content, commit_details)
         gitaly_wiki_client.write_page(name, format, content, commit_details)
       end
@@ -153,6 +163,13 @@ module Gitlab
       def gitaly_delete_page(page_path, commit_details)
         gitaly_wiki_client.delete_page(page_path, commit_details)
       end
+
+      def gitaly_find_page(title:, version: nil, dir: nil)
+        wiki_page, version = gitaly_wiki_client.find_page(title: title, version: version, dir: dir)
+        return unless wiki_page
+
+        Gitlab::Git::WikiPage.new(wiki_page, version)
+      end
     end
   end
 end
diff --git a/lib/gitlab/gitaly_client/wiki_page.rb b/lib/gitlab/gitaly_client/wiki_page.rb
new file mode 100644
index 00000000000..8226278d5f6
--- /dev/null
+++ b/lib/gitlab/gitaly_client/wiki_page.rb
@@ -0,0 +1,25 @@
+module Gitlab
+  module GitalyClient
+    class WikiPage
+      FIELDS = %i(title format url_path path name historical raw_data).freeze
+
+      attr_accessor(*FIELDS)
+
+      def initialize(params)
+        params = params.with_indifferent_access
+
+        FIELDS.each do |field|
+          instance_variable_set("@#{field}", params[field])
+        end
+      end
+
+      def historical?
+        @historical
+      end
+
+      def format
+        @format.to_sym
+      end
+    end
+  end
+end
diff --git a/lib/gitlab/gitaly_client/wiki_service.rb b/lib/gitlab/gitaly_client/wiki_service.rb
index b7407dc1cc1..5d7930f5ff9 100644
--- a/lib/gitlab/gitaly_client/wiki_service.rb
+++ b/lib/gitlab/gitaly_client/wiki_service.rb
@@ -47,6 +47,39 @@ module Gitlab
         GitalyClient.call(@repository.storage, :wiki_service, :wiki_delete_page, request)
       end
 
+      def find_page(title:, version: nil, dir: nil)
+        request = Gitaly::WikiFindPageRequest.new(
+          repository: @gitaly_repo,
+          title: GitalyClient.encode(title),
+          revision: GitalyClient.encode(version),
+          directory: GitalyClient.encode(dir)
+        )
+
+        response = GitalyClient.call(@repository.storage, :wiki_service, :wiki_find_page, request)
+        wiki_page = version = nil
+
+        response.each do |message|
+          page = message.page
+          next unless page
+
+          if wiki_page
+            wiki_page.raw_data << page.raw_data
+          else
+            wiki_page = GitalyClient::WikiPage.new(page.to_h)
+            # All gRPC strings in a response are frozen, so we get
+            # an unfrozen version here so appending in the else clause below doesn't blow up.
+            wiki_page.raw_data = wiki_page.raw_data.dup
+
+            version = Gitlab::Git::WikiPageVersion.new(
+              Gitlab::Git::Commit.decorate(@repository, page.version.commit),
+              page.version.format
+            )
+          end
+        end
+
+        [wiki_page, version]
+      end
+
       private
 
       def gitaly_commit_details(commit_details)
diff --git a/spec/models/project_wiki_spec.rb b/spec/models/project_wiki_spec.rb
index 95d58b96f33..52a2b4b2850 100644
--- a/spec/models/project_wiki_spec.rb
+++ b/spec/models/project_wiki_spec.rb
@@ -117,31 +117,41 @@ describe ProjectWiki do
   end
 
   describe "#find_page" do
-    before do
-      create_page("index page", "This is an awesome Gollum Wiki")
-    end
+    shared_examples 'finding a wiki page' do
+      before do
+        create_page("index page", "This is an awesome Gollum Wiki")
+      end
 
-    after do
-      destroy_page(subject.pages.first.page)
-    end
+      after do
+        destroy_page(subject.pages.first.page)
+      end
 
-    it "returns the latest version of the page if it exists" do
-      page = subject.find_page("index page")
-      expect(page.title).to eq("index page")
-    end
+      it "returns the latest version of the page if it exists" do
+        page = subject.find_page("index page")
+        expect(page.title).to eq("index page")
+      end
+
+      it "returns nil if the page does not exist" do
+        expect(subject.find_page("non-existant")).to eq(nil)
+      end
+
+      it "can find a page by slug" do
+        page = subject.find_page("index-page")
+        expect(page.title).to eq("index page")
+      end
 
-    it "returns nil if the page does not exist" do
-      expect(subject.find_page("non-existant")).to eq(nil)
+      it "returns a WikiPage instance" do
+        page = subject.find_page("index page")
+        expect(page).to be_a WikiPage
+      end
     end
 
-    it "can find a page by slug" do
-      page = subject.find_page("index-page")
-      expect(page.title).to eq("index page")
+    context 'when Gitaly wiki_find_page is enabled' do
+      it_behaves_like 'finding a wiki page'
     end
 
-    it "returns a WikiPage instance" do
-      page = subject.find_page("index page")
-      expect(page).to be_a WikiPage
+    context 'when Gitaly wiki_find_page is disabled', :skip_gitaly_mock do
+      it_behaves_like 'finding a wiki page'
     end
   end
 
-- 
cgit v1.2.1