setup to allow editing assignee from sidebar

app/assets/javascripts/boards/components/board_sidebar.js

@@ -10,6 +10,7 @@ import eventHub from '../../sidebar/event_hub';
 import AssigneeTitle from '../../sidebar/components/assignees/assignee_title';
 import Assignees from '../../sidebar/components/assignees/assignees';
 import './sidebar/remove_issue';
+import UsersSelect from '../../users_select';
 
 const Store = gl.issueBoards.BoardsStore;
 
@@ -58,6 +59,7 @@ gl.issueBoards.BoardSidebar = Vue.extend({
         this.list = this.detail.list;
 
         this.$nextTick(() => {
+          new UsersSelect();
           this.endpoint = this.$refs.assigneeDropdown.dataset.issueUpdate;
         });
       },

app/assets/javascripts/boards/models/issue.js

@@ -18,6 +18,9 @@ class ListIssue {
     this.selected = false;
     this.position = obj.relative_position || Infinity;
     this.milestone_id = obj.milestone_id;
+    this.updateUrl = obj.update_url;
+    this.canEdit = obj.can_edit;
+    this.projectId = obj.project_id;
 
     if (obj.milestone) {
       this.milestone = new ListMilestone(obj.milestone);
@@ -88,7 +91,7 @@ class ListIssue {
       data.issue.label_ids = [''];
     }
 
-    return Vue.http.patch(url, data);
+    return Vue.http.patch(this.updateUrl, data);
   }
 }
 

app/helpers/boards_helper.rb

@@ -65,4 +65,20 @@ module BoardsHelper
       group_path: @group&.try(:path) # Same here
     }
   end
+
+  def board_sidebar_user_data
+    dropdown_options = issue_assignees_dropdown_options
+
+    {
+      toggle: 'dropdown',
+      field_name: 'issue[assignee_ids][]',
+      first_user: current_user&.username,
+      current_user: 'true',
+      project_id: @project&.try(:id),
+      null_user: 'true',
+      multi_select: 'true',
+      'dropdown-header': dropdown_options[:data][:'dropdown-header'],
+      'max-select': dropdown_options[:data][:'max-select']
+    }
+  end
 end

app/helpers/form_helper.rb

@@ -29,7 +29,7 @@ module FormHelper
         first_user: current_user&.username,
         null_user: true,
         current_user: true,
-        project_id: @project.id,
+        project_id: @project&.try(:id),
         field_name: "issue[assignee_ids][]",
         default_label: 'Unassigned',
         'max-select': 1,

app/views/shared/boards/_show.html.haml

@@ -5,7 +5,7 @@
 
 - if show_new_nav?
   - content_for :sub_title_before do
-    %li= link_to "Issues", project_issues_path(@project)
+    %li= link_to "Issues", @issues_path
 
 - content_for :page_specific_javascripts do
   = webpack_bundle_tag 'common_vue'

app/views/shared/boards/components/sidebar/_assignee.html.haml

@@ -2,13 +2,13 @@
   %template{ "v-if" => "issue.assignees" }
     %assignee-title{ ":number-of-assignees" => "issue.assignees.length",
       ":loading" => "loadingAssignees",
-      ":editable" => can?(current_user, :admin_issue, @project) }
+      ":editable" => "issue.canEdit" }
     %assignees.value{ "root-path" => "#{root_url}",
       ":users" => "issue.assignees",
-      ":editable" => can?(current_user, :admin_issue, @project),
+      ":editable" => "issue.canEdit",
       "@assign-self" => "assignSelf" }
 
-  - if can?(current_user, :admin_issue, @project)
+  %template{ "v-if" => "issue.canEdit" }
     .selectbox.hide-collapsed
       %input.js-vue{ type: "hidden",
         name: "issue[assignee_ids][]",
@@ -20,9 +20,9 @@
         ":data-username" => "assignee.username" }
       .dropdown
         - dropdown_options = issue_assignees_dropdown_options
-        %button.dropdown-menu-toggle.js-user-search.js-author-search.js-multiselect.js-save-user-data.js-issue-board-sidebar{ type: 'button', ref: 'assigneeDropdown', data: { toggle: 'dropdown', field_name: 'issue[assignee_ids][]', first_user: current_user&.username, current_user: 'true', project_id: @project.id, null_user: 'true', multi_select: 'true', 'dropdown-header': dropdown_options[:data][:'dropdown-header'], 'max-select': dropdown_options[:data][:'max-select'] },
+        %button.dropdown-menu-toggle.js-user-search.js-author-search.js-multiselect.js-save-user-data.js-issue-board-sidebar{ type: 'button', ref: 'assigneeDropdown', data: board_sidebar_user_data,
           ":data-issuable-id" => "issue.id",
-          ":data-issue-update" => "'#{project_issues_path(@project)}/' + issue.id + '.json'" }
+          ":data-issue-update" => "'#{@issues_path}/' + issue.id + '.json'" }
           = dropdown_options[:title]
           = icon("chevron-down")
         .dropdown-menu.dropdown-select.dropdown-menu-user.dropdown-menu-selectable.dropdown-menu-author

app/views/shared/boards/components/sidebar/_due_date.html.haml

 .block.due_date
   .title
     Due date
-    - if can?(current_user, :admin_issue, current_board_parent)
+    %template{ "v-if" => "issue.canEdit" }
       = icon("spinner spin", class: "block-loading")
       = link_to "Edit", "#", class: "edit-link pull-right"
   .value
@@ -15,7 +15,7 @@
           \-
           %a.js-remove-due-date{ href: "#", role: "button" }
             remove due date
-  - if can?(current_user, :admin_issue, current_board_parent)
+  %template{ "v-if" => "issue.canEdit" }
     .selectbox
       %input{ type: "hidden",
         name: "issue[due_date]",
@@ -23,7 +23,7 @@
       .dropdown
         %button.dropdown-menu-toggle.js-due-date-select.js-issue-boards-due-date{ type: 'button',
           data: { toggle: 'dropdown', field_name: "issue[due_date]", ability_name: "issue" },
-          ":data-issue-update" => "'#{project_issues_path(@project)}/' + issue.id + '.json'" }
+          ":data-issue-update" => "'#{@issues_path}/' + issue.id + '.json'" }
           %span.dropdown-toggle-text Due date
           = icon('chevron-down')
         .dropdown-menu.dropdown-menu-due-date

app/views/shared/boards/components/sidebar/_labels.html.haml

 .block.labels
   .title
     Labels
-    - if can?(current_user, :admin_issue, @project)
+    %template{ "v-if" => "issue.canEdit" }
       = icon("spinner spin", class: "block-loading")
       = link_to "Edit", "#", class: "edit-link pull-right"
   .value.issuable-show-labels
@@ -11,7 +11,7 @@
       "v-for" => "label in issue.labels" }
       %span.label.color-label.has-tooltip{ ":style" => "{ backgroundColor: label.color, color: label.textColor }" }
         {{ label.title }}
-  - if can?(current_user, :admin_issue, @project)
+  %template{ "v-if" => "issue.canEdit" }
     .selectbox
       %input{ type: "hidden",
         name: "issue[label_names][]",
@@ -19,8 +19,15 @@
         ":value" => "label.id" }
       .dropdown
         %button.dropdown-menu-toggle.js-label-select.js-multiselect.js-issue-board-sidebar{ type: "button",
-          data: { toggle: "dropdown", field_name: "issue[label_names][]", show_no: "true", show_any: "true", project_id: @project.id, labels: project_labels_path(@project, :json), namespace_path: @project.try(:namespace).try(:full_path), project_path: @project.try(:path) },
-          ":data-issue-update" => "'#{project_issues_path(@project)}/' + issue.id + '.json'" }
+          data: { toggle: "dropdown",
+            field_name: "issue[label_names][]",
+            show_no: "true",
+            show_any: "true",
+            project_id: @project&.try(:id),
+            labels: (project_labels_path(@project, :json) if @project),
+            namespace_path: @project.try(:namespace).try(:full_path),
+            project_path: @project.try(:path) },
+          ":data-issue-update" => "'#{@issues_path}/' + issue.id + '.json'" }
           %span.dropdown-toggle-text
             Label
           = icon('chevron-down')