Re-use notifications dropdown/modal for user profile

8 files changed, 78 insertions, 37 deletions

diff --git a/app/views/notifications/buttons/_notifications.html.haml b/app/views/notifications/buttons/_notifications.html.haml
new file mode 100644
index 00000000000..03740f2587b
--- /dev/null
+++ b/app/views/notifications/buttons/_notifications.html.haml
@@ -0,0 +1,24 @@
+- if notification_setting
+  .dropdown.notification-dropdown.pull-right
+    = form_for notification_setting, remote: true, html: { class: "inline", id: "notification-form" } do |f|
+      = hidden_setting_source_input(notification_setting)
+      = f.hidden_field :level, class: "notification_setting_level"
+      .js-notification-toggle-btns
+        .btn-group
+          - if notification_setting.custom?
+            %button.dropdown-new.btn.btn-default.notifications-btn#notifications-button{ type: "button", data: { toggle: "modal", target: "#" + notifications_menu_identifier("modal", notification_setting) } }
+              = icon("bell", class: "js-notification-loading")
+              = notification_title(notification_setting.level)
+            %button.btn.dropdown-toggle{ data: { toggle: "dropdown", target: notifications_menu_identifier("dropdown", notification_setting) } }
+              %span.caret
+              .sr-only Toggle dropdown
+          - else
+            %button.dropdown-new.btn.btn-default.notifications-btn#notifications-button{ type: "button", data: { toggle: "dropdown", target: notifications_menu_identifier("dropdown", notification_setting) } }
+              = icon("bell", class: "js-notification-loading")
+              = notification_title(notification_setting.level)
+              = icon("caret-down")
+
+          = render "shared/notifications/notification_dropdown", notification_setting: notification_setting
+
+          = content_for :scripts_body do
+            = render "shared/notifications/custom_notifications", notification_setting: notification_setting
diff --git a/app/views/profiles/notifications/_group_settings.html.haml b/app/views/profiles/notifications/_group_settings.html.haml
index f0cf82afe83..04becd5d860 100644
--- a/app/views/profiles/notifications/_group_settings.html.haml
+++ b/app/views/profiles/notifications/_group_settings.html.haml
@@ -9,5 +9,4 @@
     = link_to group.name, group_path(group)
 
   .pull-right
-    = form_for [group, setting], remote: true, html: { class: 'update-notifications' } do |f|
-      = f.select :level, NotificationSetting.levels.keys, {}, class: 'form-control trigger-submit'
+    = render 'notifications/buttons/notifications', notification_setting: setting
diff --git a/app/views/profiles/notifications/_project_settings.html.haml b/app/views/profiles/notifications/_project_settings.html.haml
index e0fad555c09..664a17418db 100644
--- a/app/views/profiles/notifications/_project_settings.html.haml
+++ b/app/views/profiles/notifications/_project_settings.html.haml
@@ -9,5 +9,4 @@
     = link_to_project(project)
 
   .pull-right
-    = form_for [project.namespace.becomes(Namespace), project, setting], remote: true, html: { class: 'update-notifications' } do |f|
-      = f.select :level, NotificationSetting.levels.keys, {}, class: 'form-control trigger-submit'
+    = render 'notifications/buttons/notifications', notification_setting: setting
diff --git a/app/views/profiles/notifications/show.html.haml b/app/views/profiles/notifications/show.html.haml
index f2659ac14b5..646dd244596 100644
--- a/app/views/profiles/notifications/show.html.haml
+++ b/app/views/profiles/notifications/show.html.haml
@@ -24,12 +24,15 @@
         .form-group
           = f.label :notification_email, class: "label-light"
           = f.select :notification_email, @user.all_emails, { include_blank: false }, class: "select2"
-        .form-group
-          = f.label :notification_level, class: 'label-light'
-          = notification_level_radio_buttons
 
-        .prepend-top-default
-          = f.submit 'Update settings', class: "btn btn-create"
+        = label_tag :global_notification_level, "Global notification level", class: "label-light"
+        %br
+        .clearfix
+        .form-group.pull-left
+          = render 'notifications/buttons/notifications', notification_setting: @global_notification_setting
+
+      .clearfix
+
       %hr
       %h5
         Groups (#{@group_notifications.count})
diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml
index 2b19ee93eea..df725d81a39 100644
--- a/app/views/projects/_home_panel.html.haml
+++ b/app/views/projects/_home_panel.html.haml
@@ -29,13 +29,10 @@
           .project-clone-holder
             = render "shared/clone_panel"
 
-      .project-repo-buttons.project-right-buttons
-        - if current_user
-          = render 'shared/members/access_request_buttons', source: @project
-        .btn-group
-          = render "projects/buttons/download"
-          = render 'projects/buttons/dropdown'
-          = render 'projects/buttons/notifications'
+      .project-repo-buttons.btn-group.project-right-buttons
+        = render "projects/buttons/download"
+        = render 'projects/buttons/dropdown'
+        = render 'notifications/buttons/notifications', notification_setting: @notification_setting
 
 :javascript
   new Star();
diff --git a/app/views/projects/buttons/_notifications.html.haml b/app/views/projects/buttons/_notifications.html.haml
deleted file mode 100644
index 4c2eafbd7df..00000000000
--- a/app/views/projects/buttons/_notifications.html.haml
+++ /dev/null
@@ -1,21 +0,0 @@
-- if @notification_setting
-  .dropdown.notification-dropdown.pull-right
-    = form_for @notification_setting, url: namespace_project_notification_setting_path(@project.namespace.becomes(Namespace), @project), method: :patch, remote: true, html: { class: "inline", id: "notification-form" } do |f|
-      = f.hidden_field :level
-      .js-notification-toggle-btns
-        - if @notification_setting.custom?
-          .btn-group
-            %button.dropdown-new.btn.btn-default.notifications-btn#notifications-button{ type: "button", data: { toggle: "modal", target: "#custom-notifications-modal" } }
-              = icon("bell", class: "js-notification-loading")
-              = notification_title(@notification_setting.level)
-            %button.btn.btn-danger.dropdown-toggle{ data: { toggle: "dropdown", target: ".notification-dropdown" } }
-              %span.caret
-              .sr-only Toggle dropdown
-        - else
-          %button.dropdown-new.btn.btn-default.notifications-btn#notifications-button{ type: "button", data: { toggle: "dropdown", target: ".notification-dropdown" } }
-            = icon("bell", class: "js-notification-loading")
-            = notification_title(@notification_setting.level)
-            = icon("caret-down")
-      = render "shared/projects/notification_dropdown"
-  = content_for :scripts_body do
-    = render "shared/projects/custom_notifications"
diff --git a/app/views/shared/notifications/_custom_notifications.html.haml b/app/views/shared/notifications/_custom_notifications.html.haml
new file mode 100644
index 00000000000..f0b46c7a4c0
--- /dev/null
+++ b/app/views/shared/notifications/_custom_notifications.html.haml
@@ -0,0 +1,28 @@
+.modal.fade{ tabindex: "-1", role: "dialog", id: notifications_menu_identifier("modal", notification_setting), aria: { labelledby: "custom-notifications-title" } }
+  .modal-dialog
+    .modal-content
+      .modal-header
+        %button.close{ type: "button", data: { dismiss: "modal" }, aria: { label: "close" } }
+          %span{ aria: { hidden: "true" } } ×
+        %h4#custom-notifications-title.modal-title
+          Custom notification events
+
+      .modal-body
+        .container-fluid
+          = form_for notification_setting, html: { class: "custom-notifications-form" } do |f|
+            = hidden_setting_source_input(notification_setting)
+            .row
+              .col-lg-3
+                %h4.prepend-top-0
+                  Notification events
+              .col-lg-9
+                - NotificationSetting::EMAIL_EVENTS.each do |event, index|
+                  = index
+                  .form-group
+                    .checkbox{ class: ("prepend-top-0" if index == 0) }
+                      %label{ for: "events_#{event}" }
+                        = check_box("", event, { name: "notification_setting[#{event}]", class: "js-custom-notification-event", checked: notification_setting.events[event] })
+
+                        %strong
+                          = event.to_s.humanize
+                          = icon("spinner spin", class: "custom-notification-event-loading")
diff --git a/app/views/shared/notifications/_notification_dropdown.html.haml b/app/views/shared/notifications/_notification_dropdown.html.haml
new file mode 100644
index 00000000000..e6e04b98c82
--- /dev/null
+++ b/app/views/shared/notifications/_notification_dropdown.html.haml
@@ -0,0 +1,12 @@
+%ul.dropdown-menu.dropdown-menu-no-wrap.dropdown-menu-align-right.dropdown-menu-selectable.dropdown-menu-large{ role: "menu", class: notifications_menu_identifier("dropdown", notification_setting) }
+  - NotificationSetting.levels.each_key do |level|
+    - next if level == "custom"
+    - next if level == "global" && notification_setting.source.nil?
+
+    = notification_list_item(level, notification_setting)
+
+  - unless notification_setting.custom?
+    %li.divider
+    %li
+      %a.update-notification{ href: "#", role: "button", data: { toggle: "modal", target: "#" + notifications_menu_identifier("modal", notification_setting), notification_level: "custom", notification_title: "Custom" } }
+        Custom