Backported from EE shared form for web hooks

app/views/projects/hooks/index.html.haml

-- page_title "Webhooks"
-.row.prepend-top-default
-  .col-lg-3.profile-settings-sidebar
-    %h4.prepend-top-0
-      = page_title
-    %p
-      #{link_to "Webhooks", help_page_path("web_hooks", "web_hooks")} can be
-      used for binding events when something is happening within the project.
-  .col-lg-9.append-bottom-default
-    %h5.prepend-top-0
-      Add new webhook
-    = form_for [@project.namespace.becomes(Namespace), @project, @hook], as: :hook, url: namespace_project_hooks_path(@project.namespace, @project) do |f|
-      = form_errors(@hook)
-
-      .form-group
-        = f.label :url, "URL", class: "label-light"
-        = f.text_field :url, class: "form-control", placeholder: "http://example.com/trigger-ci.json"
-      .form-group
-        = f.label :token, "Secret Token", class: 'label-light'
-        = f.text_field :token, class: "form-control", placeholder: ''
-        %p.help-block
-          Use this token to validate received payloads
-      .form-group
-        = f.label :url, "Trigger", class: "label-light"
-        %div
-          = f.check_box :push_events, class: "pull-left"
-          .prepend-left-20
-            = f.label :push_events, class: "label-light append-bottom-0" do
-              Push events
-            %p.light
-              This url will be triggered by a push to the repository
-        %div
-          = f.check_box :tag_push_events, class: "pull-left"
-          .prepend-left-20
-            = f.label :tag_push_events, class: "label-light append-bottom-0" do
-              Tag push events
-            %p.light
-              This url will be triggered when a new tag is pushed to the repository
-        %div
-          = f.check_box :note_events, class: "pull-left"
-          .prepend-left-20
-            = f.label :note_events, class: "label-light append-bottom-0" do
-              Comments
-            %p.light
-              This url will be triggered when someone adds a comment
-        %div
-          = f.check_box :issues_events, class: "pull-left"
-          .prepend-left-20
-            = f.label :issues_events, class: "label-light append-bottom-0" do
-              Issues events
-            %p.light
-              This url will be triggered when an issue is created/updated/merged
-        %div
-          = f.check_box :merge_requests_events, class: "pull-left"
-          .prepend-left-20
-            = f.label :merge_requests_events, class: "label-light append-bottom-0" do
-              Merge Request events
-            %p.light
-              This url will be triggered when a merge request is created/updated/merged
-        %div
-          = f.check_box :build_events, class: "pull-left"
-          .prepend-left-20
-            = f.label :build_events, class: "label-light append-bottom-0" do
-              Build events
-            %p.light
-              This url will be triggered when the build status changes
-        %div
-          = f.check_box :wiki_page_events, class: 'pull-left'
-          .prepend-left-20
-            = f.label :wiki_page_events, class: 'label-light append-bottom-0' do
-              Wiki Page events
-            %p.light
-              This url will be triggered when a wiki page is created/updated
-      .form-group
-        = f.label :enable_ssl_verification, "SSL verification", class: "label-light"
-        %div
-          = f.check_box :enable_ssl_verification, class: "pull-left"
-          .prepend-left-20
-            = f.label :enable_ssl_verification, class: "label-light append-bottom-0" do
-              Enable SSL verification
-      = f.submit "Add Webhook", class: "btn btn-create"
-    %hr
-    %h5.prepend-top-default
-      Webhooks (#{@hooks.count})
-    - if @hooks.any?
-      %ul.well-list
-        - @hooks.each do |hook|
-          = render "project_hook", hook: hook
-    - else
-      %p.settings-message.text-center.append-bottom-0
-        No webhooks found, add one in the form above.
+= render 'shared/web_hooks/form', hook: @hook, hooks: @hooks, url_components: [@project.namespace.becomes(Namespace), @project]

app/views/shared/web_hooks/_form.html.haml

+- page_title "Webhooks"
+- context_title = @project ? 'project' : 'group'
+
+.row.prepend-top-default
+  .col-lg-3
+    %h4.prepend-top-0
+      = page_title
+    %p
+      #{link_to "Webhooks", help_page_path("web_hooks", "web_hooks")} can be
+      used for binding events when something is happening within the project.
+  .col-lg-9.append-bottom-default
+    = form_for hook, as: :hook, url: polymorphic_path(url_components + [:hooks]) do |f|
+      = form_errors(hook)
+
+      .form-group
+        = f.label :url, "URL", class: 'label-light'
+        = f.text_field :url, class: "form-control", placeholder: 'http://example.com/trigger-ci.json'
+      .form-group
+        = f.label :token, "Secret Token", class: 'label-light'
+        = f.text_field :token, class: "form-control", placeholder: ''
+        %p.help-block
+          Use this token to validate received payloads
+      .form-group
+        = f.label :url, "Trigger", class: 'label-light'
+        %ul.list-unstyled
+          %li
+            = f.check_box :push_events, class: 'pull-left'
+            .prepend-left-20
+              = f.label :push_events, class: 'list-label' do
+                %strong Push events
+              %p.light
+                This url will be triggered by a push to the repository
+          %li
+            = f.check_box :tag_push_events, class: 'pull-left'
+            .prepend-left-20
+              = f.label :tag_push_events, class: 'list-label' do
+                %strong Tag push events
+              %p.light
+                This url will be triggered when a new tag is pushed to the repository
+          %li
+            = f.check_box :note_events, class: 'pull-left'
+            .prepend-left-20
+              = f.label :note_events, class: 'list-label' do
+                %strong Comments
+              %p.light
+                This url will be triggered when someone adds a comment
+          %li
+            = f.check_box :issues_events, class: 'pull-left'
+            .prepend-left-20
+              = f.label :issues_events, class: 'list-label' do
+                %strong Issues events
+              %p.light
+                This url will be triggered when an issue is created/updated/merged
+          %li
+            = f.check_box :merge_requests_events, class: 'pull-left'
+            .prepend-left-20
+              = f.label :merge_requests_events, class: 'list-label' do
+                %strong Merge Request events
+              %p.light
+                This url will be triggered when a merge request is created/updated/merged
+          %li
+            = f.check_box :build_events, class: 'pull-left'
+            .prepend-left-20
+              = f.label :build_events, class: 'list-label' do
+                %strong Build events
+              %p.light
+                This url will be triggered when the build status changes
+          %li
+            = f.check_box :wiki_page_events, class: 'pull-left'
+            .prepend-left-20
+              = f.label :wiki_page_events, class: 'list-label' do
+                %strong Wiki Page events
+              %p.light
+                This url will be triggered when a wiki page is created/updated
+      .form-group
+        = f.label :enable_ssl_verification, "SSL verification", class: 'label-light checkbox'
+        .checkbox
+          = f.label :enable_ssl_verification do
+            = f.check_box :enable_ssl_verification
+            %strong Enable SSL verification
+      = f.submit "Add Webhook", class: "btn btn-create"
+    %hr
+    %h5.prepend-top-default
+      Webhooks (#{hooks.count})
+    - if hooks.any?
+      %ul.well-list
+        - hooks.each do |hook|
+          = render "project_hook", hook: hook
+    - else
+      %p.settings-message.text-center.append-bottom-0
+        No webhooks found, add one in the form above.