Merge branch '343993-implement-ux-designs-for-rate-limited-webhooks' into 'master'

Add alert and badge for rate-limited webhooks

See merge request gitlab-org/gitlab!76743

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

 - @content_class = 'limit-container-width' unless fluid_layout
-- add_to_breadcrumbs _('Webhook Settings'), namespace_project_hooks_path
+- add_to_breadcrumbs _('Webhook Settings'), project_hooks_path(@project)
 - page_title _('Webhook')
 
+- if @hook.rate_limited?
+  - placeholders = { strong_start: '<strong>'.html_safe,
+    strong_end: '</strong>'.html_safe,
+    limit: @hook.rate_limit,
+    support_link_start: '<a href="https://support.gitlab.com/hc/en-us/requests/new">'.html_safe,
+    support_link_end: '</a>'.html_safe }
+  = render 'shared/global_alert',
+    title: s_('Webhooks|Webhook was automatically disabled'),
+    variant: :danger,
+    is_contained: true,
+    close_button_class: 'js-close' do
+    .gl-alert-body
+      = s_('Webhooks|The webhook was triggered more than %{limit} times per minute and is now disabled. To re-enable this webhook, fix the problems shown in %{strong_start}Recent events%{strong_end}, then re-test your settings. %{support_link_start}Contact Support%{support_link_end} if you need help re-enabling your webhook.').html_safe % placeholders
+
 .row.gl-mt-3
   .col-lg-3
     = render 'shared/web_hooks/title_and_docs', hook: @hook

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

 %li
   .row
     .col-md-8.col-lg-7
-      %strong.light-header= hook.url
+      %strong.light-header
+        = hook.url
+        - if hook.rate_limited?
+          %span.gl-badge.badge-danger.badge-pill.sm= _('Disabled')
+
       %div
         - hook.class.triggers.each_value do |trigger|
           - if hook.public_send(trigger)

locale/gitlab.pot

@@ -39427,6 +39427,9 @@ msgstr ""
 msgid "Webhooks|Tag push events"
 msgstr ""
 
+msgid "Webhooks|The webhook was triggered more than %{limit} times per minute and is now disabled. To re-enable this webhook, fix the problems shown in %{strong_start}Recent events%{strong_end}, then re-test your settings. %{support_link_start}Contact Support%{support_link_end} if you need help re-enabling your webhook."
+msgstr ""
+
 msgid "Webhooks|Trigger"
 msgstr ""
 
@@ -39484,6 +39487,9 @@ msgstr ""
 msgid "Webhooks|Use this token to validate received payloads. It is sent with the request in the X-Gitlab-Token HTTP header."
 msgstr ""
 
+msgid "Webhooks|Webhook was automatically disabled"
+msgstr ""
+
 msgid "Webhooks|Wiki page events"
 msgstr ""
 

spec/views/projects/hooks/edit.html.haml_spec.rb

+# frozen_string_literal: true
+
+require 'spec_helper'
+
+RSpec.describe 'projects/hooks/edit' do
+  let(:hook) { create(:project_hook, project: project) }
+
+  let_it_be_with_refind(:project) { create(:project) }
+
+  before do
+    assign :project, project
+    assign :hook, hook
+  end
+
+  it 'renders webhook page with "Recent events"' do
+    render
+
+    expect(rendered).to have_css('h4', text: _('Webhook'))
+    expect(rendered).to have_text(_('Recent events'))
+  end
+
+  context 'webhook is rate limited' do
+    before do
+      allow(hook).to receive(:rate_limited?).and_return(true)
+    end
+
+    it 'renders alert' do
+      render
+
+      expect(rendered).to have_text(s_('Webhooks|Webhook was automatically disabled'))
+    end
+  end
+end

spec/views/projects/hooks/index.html.haml_spec.rb

+# frozen_string_literal: true
+
+require 'spec_helper'
+
+RSpec.describe 'projects/hooks/index' do
+  let(:existing_hook) { create(:project_hook, project: project) }
+  let(:new_hook) { ProjectHook.new }
+
+  let_it_be_with_refind(:project) { create(:project) }
+
+  before do
+    assign :project, project
+    assign :hooks, [existing_hook]
+    assign :hook, new_hook
+  end
+
+  it 'renders webhooks page with "Project Hooks"' do
+    render
+
+    expect(rendered).to have_css('h4', text: _('Webhooks'))
+    expect(rendered).to have_text('Project Hooks')
+    expect(rendered).not_to have_css('.gl-badge', text: _('Disabled'))
+  end
+
+  context 'webhook is rate limited' do
+    before do
+      allow(existing_hook).to receive(:rate_limited?).and_return(true)
+    end
+
+    it 'renders "Disabled" badge' do
+      render
+
+      expect(rendered).to have_css('.gl-badge', text: _('Disabled'))
+    end
+  end
+end