Merge branch 'issue_14904' into 'master'

Add new shortcuts

Closes #14904

- On a project: `i` To navigate to New Issue page.
- On a issuable: `l` To open Label dropdown on a issuable.
- Global: Typing `?` multiple times now toggles the modal.

See merge request !3686

CHANGELOG

@@ -118,6 +118,7 @@ v 8.7.0
   - Show number sign on external issue reference text (Florent Baldino)
   - Updated print style for issues
   - Use GitHub Issue/PR number as iid to keep references
+  - Add 'l' shortcut to open Label dropdown on issuables and 'i' to create new issue on a project
   - Import GitHub labels
   - Add option to filter by "Owned projects" on dashboard page
   - Import GitHub milestones

app/assets/javascripts/right_sidebar.js.coffee

 class @Sidebar
   constructor: (currentUser) ->
+    @sidebar = $('aside')
+
     @addEventListeners()
 
   addEventListeners: ->
-    $('aside').on('click', '.sidebar-collapsed-icon', @sidebarCollapseClicked)
-    $('.dropdown').on('hidden.gl.dropdown', @sidebarDropdownHidden)
+    @sidebar.on('click', '.sidebar-collapsed-icon', @, @sidebarCollapseClicked)
+    $('.dropdown').on('hidden.gl.dropdown', @, @onSidebarDropdownHidden)
     $('.dropdown').on('loading.gl.dropdown', @sidebarDropdownLoading)
     $('.dropdown').on('loaded.gl.dropdown', @sidebarDropdownLoaded)
 
@@ -30,26 +32,56 @@ class @Sidebar
     else
       i.show()
 
-
   sidebarCollapseClicked: (e) ->
+    sidebar = e.data
     e.preventDefault()
     $block = $(@).closest('.block')
+    sidebar.openDropdown($block);
 
-    $('aside')
-      .find('.gutter-toggle')
-      .trigger('click')
-    $editLink = $block.find('.edit-link')
+  openDropdown: (blockOrName) ->
+    $block = if _.isString(blockOrName) then @getBlock(blockOrName) else blockOrName
+
+    $block.find('.edit-link').trigger('click')
 
-    if $editLink.length
-      $editLink.trigger('click')
+    if not @isOpen()
+      @setCollapseAfterUpdate($block)
+      @toggleSidebar('open')
+
+  setCollapseAfterUpdate: ($block) ->
     $block.addClass('collapse-after-update')
     $('.page-with-sidebar').addClass('with-overlay')
 
-  sidebarDropdownHidden: (e) ->
+  onSidebarDropdownHidden: (e) ->
+    sidebar = e.data
+    e.preventDefault()
     $block = $(@).closest('.block')
+    sidebar.sidebarDropdownHidden($block)
+
+  sidebarDropdownHidden: ($block) ->
     if $block.hasClass('collapse-after-update')
       $block.removeClass('collapse-after-update')
       $('.page-with-sidebar').removeClass('with-overlay')
-      $('aside')
-        .find('.gutter-toggle')
+      @toggleSidebar('hide')
+
+  triggerOpenSidebar: ->
+    @sidebar
+      .find('.js-sidebar-toggle')
       .trigger('click')
+
+  toggleSidebar: (action = 'toggle') ->
+    if action is 'toggle'
+      @triggerOpenSidebar()
+
+    if action is 'open'
+      @triggerOpenSidebar() if not @isOpen()
+
+    if action is 'hide'
+      @triggerOpenSidebar() is @isOpen()
+
+  isOpen: ->
+    @sidebar.is('.right-sidebar-expanded')
+
+  getBlock: (name) ->
+    @sidebar.find(".block.#{name}")
+
+

app/assets/javascripts/shortcuts.js.coffee

@@ -2,25 +2,27 @@ class @Shortcuts
   constructor: ->
     @enabledHelp = []
     Mousetrap.reset()
-    Mousetrap.bind('?', @selectiveHelp)
+    Mousetrap.bind('?', @onToggleHelp)
     Mousetrap.bind('s', Shortcuts.focusSearch)
     Mousetrap.bind(['ctrl+shift+p', 'command+shift+p'], @toggleMarkdownPreview)
     Mousetrap.bind('t', -> Turbolinks.visit(findFileURL)) if findFileURL?
 
-  selectiveHelp: (e) =>
-    Shortcuts.showHelp(e, @enabledHelp)
+  onToggleHelp: (e) =>
+    e.preventDefault()
+    @toggleHelp(@enabledHelp)
 
   toggleMarkdownPreview: (e) =>
     $(document).triggerHandler('markdown-preview:toggle', [e])
 
-  @showHelp: (e, location) ->
-    if $('#modal-shortcuts').length > 0
-      $('#modal-shortcuts').modal('show')
-    else
-      url = '/help/shortcuts'
-      url = gon.relative_url_root + url if gon.relative_url_root?
+  toggleHelp: (location) ->
+    $modal = $('#modal-shortcuts')
+
+    if $modal.length
+      $modal.modal('toggle')
+      return
+
     $.ajax(
-        url: url,
+      url: gon.shortcuts_path,
       dataType: 'script',
       success: (e) ->
         if location and location.length > 0
@@ -29,7 +31,6 @@ class @Shortcuts
           $('.hidden-shortcut').show()
           $('.js-more-help-button').remove()
     )
-      e.preventDefault()
 
   @focusSearch: (e) ->
     $('#search').focus()

app/assets/javascripts/shortcuts_issuable.coffee

@@ -4,18 +4,8 @@
 class @ShortcutsIssuable extends ShortcutsNavigation
   constructor: (isMergeRequest) ->
     super()
-    Mousetrap.bind('a', ->
-      $('.block.assignee .edit-link').trigger('click')
-      return false
-    )
-    Mousetrap.bind('m', ->
-      $('.block.milestone .edit-link').trigger('click')
-      return false
-    )
-    Mousetrap.bind('r', =>
-      @replyWithSelectedText()
-      return false
-    )
+    Mousetrap.bind('a', @openSidebarDropdown.bind(@, 'assignee'))
+    Mousetrap.bind('m', @openSidebarDropdown.bind(@, 'milestone'))
     Mousetrap.bind('j', =>
       @prevIssue()
       return false
@@ -28,7 +18,7 @@ class @ShortcutsIssuable extends ShortcutsNavigation
       @editIssue()
       return false
     )
-
+    Mousetrap.bind('l', @openSidebarDropdown.bind(@, 'labels'))
 
     if isMergeRequest
       @enabledHelp.push('.hidden-shortcut.merge_requests')
@@ -71,3 +61,7 @@ class @ShortcutsIssuable extends ShortcutsNavigation
   editIssue: ->
     $editBtn = $('.issuable-edit')
     Turbolinks.visit($editBtn.attr('href'))
+
+  openSidebarDropdown: (name) ->
+    sidebar.openDropdown(name)
+    return false

app/assets/javascripts/shortcuts_navigation.coffee

@@ -14,6 +14,7 @@ class @ShortcutsNavigation extends Shortcuts
     Mousetrap.bind('g m', -> ShortcutsNavigation.findAndFollowLink('.shortcuts-merge_requests'))
     Mousetrap.bind('g w', -> ShortcutsNavigation.findAndFollowLink('.shortcuts-wiki'))
     Mousetrap.bind('g s', -> ShortcutsNavigation.findAndFollowLink('.shortcuts-snippets'))
+    Mousetrap.bind('i', -> ShortcutsNavigation.findAndFollowLink('.shortcuts-new-issue'))
     @enabledHelp.push('.hidden-shortcut.project')
 
   @findAndFollowLink: (selector) ->

app/views/help/_shortcuts.html.haml

@@ -21,7 +21,7 @@
               %tr
                 %td.shortcut
                   .key ?
-                %td Show this dialog
+                %td Show/hide this dialog
               %tr
                 %td.shortcut
                   - if browser.mac?
@@ -169,6 +169,10 @@
                 %td.shortcut
                   .key t
                 %td Go to finding file
+              %tr
+                %td.shortcut
+                  .key i
+                %td New issue
         .col-lg-4
           %table.shortcut-mappings
             %tbody{ class: 'hidden-shortcut network', style: 'display:none' }
@@ -241,6 +245,10 @@
                 %td.shortcut
                   .key e
                 %td Edit issue
+              %tr
+                %td.shortcut
+                  .key l
+                %td Change Label
             %tbody{ class: 'hidden-shortcut merge_requests', style: 'display:none' }
               %tr
                 %th
@@ -261,3 +269,7 @@
                 %td.shortcut
                   .key e
                 %td Edit merge request
+              %tr
+                %td.shortcut
+                  .key l
+                %td Change Label

app/views/layouts/nav/_project.html.haml

@@ -124,3 +124,8 @@
     %li.hidden
       = link_to namespace_project_network_path(@project.namespace, @project, current_ref), title: 'Network', class: 'shortcuts-network' do
         Network
+
+  -# Shortcut to create a new issue
+  %li.hidden
+    = link_to new_namespace_project_issue_path(@project.namespace, @project), class: 'shortcuts-new-issue' do
+      Create a new issue

app/views/shared/issuable/_sidebar.html.haml

@@ -166,5 +166,5 @@
       new LabelsSelect();
       new IssuableContext('#{escape_javascript(current_user.to_json(only: [:username, :id, :name]))}');
       new Subscription('.subscription')
-      new Sidebar();
       new DueDateSelect();
+      sidebar = new Sidebar();

lib/gitlab/gon_helper.rb

@@ -6,6 +6,7 @@ module Gitlab
       gon.default_issues_tracker = Project.new.default_issue_tracker.to_param
       gon.max_file_size          = current_application_settings.max_attachment_size
       gon.relative_url_root      = Gitlab.config.gitlab.relative_url_root
+      gon.shortcuts_path         = help_shortcuts_path
       gon.user_color_scheme      = Gitlab::ColorSchemes.for_user(current_user).css_class
 
       if current_user

spec/features/project/shortcuts_spec.rb

+require 'spec_helper'
+
+feature 'Project shortcuts', feature: true do
+  let(:project) { create(:project) }
+  let(:user) { create(:user) }
+
+  describe 'On a project', js: true do
+    before do
+      project.team << [user, :master]
+      login_as user
+      visit namespace_project_path(project.namespace, project)
+    end
+
+    describe 'pressing "i"' do
+      it 'redirects to new issue page' do
+        find('body').native.send_key('i')
+        expect(page).to have_content('New Issue')
+      end
+    end
+  end
+end