From b4a154fd92a806fabbd18f198b69c05a73587899 Mon Sep 17 00:00:00 2001 From: Chaoyue Zhao Date: Thu, 1 May 2025 17:51:47 -0400 Subject: [PATCH 1/3] Add messaging to redirect users to Branch rules section Now that Branch rules have been released, having the Repository Settings > Protected branches section may be unnecessary and even confusing to users. This MR adds an alert which redirects users from Protected branches to Branch rules. Changelog: added --- app/views/protected_branches/shared/_index.html.haml | 9 +++++++++ locale/gitlab.pot | 9 +++++++++ 2 files changed, 18 insertions(+) diff --git a/app/views/protected_branches/shared/_index.html.haml b/app/views/protected_branches/shared/_index.html.haml index 63bf5b6335437e..8ef6b1330803a3 100644 --- a/app/views/protected_branches/shared/_index.html.haml +++ b/app/views/protected_branches/shared/_index.html.haml @@ -1,5 +1,7 @@ - can_admin_entity = protected_branch_can_admin_entity?(protected_branch_entity) - expanded = expanded_by_default? +- branch_rules_link_url = help_page_path('user/project/repository/branches/branch_rules.md') +- branch_rules_link = link_to "", branch_rules_link_url, target: '_blank', rel: 'noopener noreferrer' = render ::Layouts::SettingsBlockComponent.new(s_("ProtectedBranch|Protected branches"), id: 'js-protected-branches-settings', @@ -11,6 +13,13 @@ - c.with_body do .js-alert-protected-branch-created-container.gl-mt-5 + = render Pajamas::AlertComponent.new(alert_options: { class: 'gl-mb-5' }, dismissible: false) do |c| + - c.with_body do + = safe_format(s_("ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}branch rules%{branch_rules_link_end}."), + tag_pair(branch_rules_link, :branch_rules_link_start, :branch_rules_link_end)) + = s_("ProtectedBranch|You can now manage branch protections, approval rules, and status checks in one place.") + = link_to s_("ProtectedBranch|How do I use branch rules?"), branch_rules_link_url, target: '_blank', rel: 'noopener noreferrer' + = render Pajamas::AlertComponent.new(variant: :warning, alert_options: { class: 'gl-mb-5' }, dismissible: false) do |c| diff --git a/locale/gitlab.pot b/locale/gitlab.pot index e3602281c094eb..6d840dcad9ee78 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -49008,6 +49008,9 @@ msgstr "" msgid "ProtectedBranch|Giving merge rights to a protected branch also gives elevated permissions for certain CI/CD features." msgstr "" +msgid "ProtectedBranch|How do I use branch rules?" +msgstr "" + msgid "ProtectedBranch|Inherited - This setting can be changed at the group level" msgstr "" @@ -49047,6 +49050,9 @@ msgstr "" msgid "ProtectedBranch|Protected branches" msgstr "" +msgid "ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}branch rules%{branch_rules_link_end}." +msgstr "" + msgid "ProtectedBranch|Reject code pushes that change files listed in the CODEOWNERS file." msgstr "" @@ -49095,6 +49101,9 @@ msgstr "" msgid "ProtectedBranch|You can add only groups that have this project shared. %{learn_more_link}" msgstr "" +msgid "ProtectedBranch|You can now manage branch protections, approval rules, and status checks in one place." +msgstr "" + msgid "ProtectedBranch|default" msgstr "" -- GitLab From 9842f28fb1b6e7031a2f1ffa37855723a4a74769 Mon Sep 17 00:00:00 2001 From: Chaoyue Zhao Date: Mon, 5 May 2025 15:19:41 -0400 Subject: [PATCH 2/3] UX review feedback - move alert to description so it shows when section is collapsed - update branch rules link to the branch rules section --- .../protected_branches/shared/_index.html.haml | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/app/views/protected_branches/shared/_index.html.haml b/app/views/protected_branches/shared/_index.html.haml index 8ef6b1330803a3..e16488063bb64f 100644 --- a/app/views/protected_branches/shared/_index.html.haml +++ b/app/views/protected_branches/shared/_index.html.haml @@ -1,7 +1,8 @@ - can_admin_entity = protected_branch_can_admin_entity?(protected_branch_entity) - expanded = expanded_by_default? -- branch_rules_link_url = help_page_path('user/project/repository/branches/branch_rules.md') -- branch_rules_link = link_to "", branch_rules_link_url, target: '_blank', rel: 'noopener noreferrer' +- branch_rules_docs_link_url = help_page_path('user/project/repository/branches/branch_rules.md') +- branch_rules_link_url = project_settings_repository_path(@project, anchor: 'branch-rules') +- branch_rules_link_start = ''.html_safe % { url: branch_rules_link_url } = render ::Layouts::SettingsBlockComponent.new(s_("ProtectedBranch|Protected branches"), id: 'js-protected-branches-settings', @@ -10,15 +11,16 @@ - c.with_description do = s_("ProtectedBranch|Keep stable branches secure and force developers to use merge requests.") = link_to s_("ProtectedBranch|What are protected branches?"), help_page_path("user/project/repository/branches/protected.md") - - c.with_body do - .js-alert-protected-branch-created-container.gl-mt-5 + .gl-mt-5 = render Pajamas::AlertComponent.new(alert_options: { class: 'gl-mb-5' }, dismissible: false) do |c| - c.with_body do - = safe_format(s_("ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}branch rules%{branch_rules_link_end}."), - tag_pair(branch_rules_link, :branch_rules_link_start, :branch_rules_link_end)) + = s_("ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}branch rules%{branch_rules_link_end}.").html_safe % { branch_rules_link_start: branch_rules_link_start, branch_rules_link_end: ''.html_safe } = s_("ProtectedBranch|You can now manage branch protections, approval rules, and status checks in one place.") - = link_to s_("ProtectedBranch|How do I use branch rules?"), branch_rules_link_url, target: '_blank', rel: 'noopener noreferrer' + = link_to s_("ProtectedBranch|How do I use branch rules?"), branch_rules_docs_link_url, target: '_blank', rel: 'noopener noreferrer' + + - c.with_body do + .js-alert-protected-branch-created-container.gl-mt-5 = render Pajamas::AlertComponent.new(variant: :warning, alert_options: { class: 'gl-mb-5' }, -- GitLab From ad440dc36fcead6cbe7686355d4e2ad884190720 Mon Sep 17 00:00:00 2001 From: Chaoyue Zhao Date: Tue, 6 May 2025 15:10:45 -0400 Subject: [PATCH 3/3] Address more UX review feedback - Reduce the spacing between two alerts - Make sure both alerts are the same width - Hide alert on group settings page --- .../layouts/settings_block_component.haml | 8 ++++-- .../shared/_index.html.haml | 25 ++++++++++--------- locale/gitlab.pot | 2 +- 3 files changed, 20 insertions(+), 15 deletions(-) diff --git a/app/components/layouts/settings_block_component.haml b/app/components/layouts/settings_block_component.haml index 0f4798b7f593f9..11973c17d4ff79 100644 --- a/app/components/layouts/settings_block_component.haml +++ b/app/components/layouts/settings_block_component.haml @@ -9,8 +9,12 @@ %h2{ class: title_classes, data: { 'settings-block-title': '' } } = heading || @heading - if description || @description - %p.gl-text-subtle.gl-m-0 - = description || @description + - if description.is_a?(String) || @description.is_a?(String) + %p.gl-text-subtle.gl-m-0 + = description || @description + - else + .gl-text-subtle.gl-m-0 + = description || @description .settings-content .gl-pl-7.sm:gl-pl-8.gl-mt-5 = body diff --git a/app/views/protected_branches/shared/_index.html.haml b/app/views/protected_branches/shared/_index.html.haml index e16488063bb64f..9663a6bdb7fbc5 100644 --- a/app/views/protected_branches/shared/_index.html.haml +++ b/app/views/protected_branches/shared/_index.html.haml @@ -1,8 +1,5 @@ - can_admin_entity = protected_branch_can_admin_entity?(protected_branch_entity) - expanded = expanded_by_default? -- branch_rules_docs_link_url = help_page_path('user/project/repository/branches/branch_rules.md') -- branch_rules_link_url = project_settings_repository_path(@project, anchor: 'branch-rules') -- branch_rules_link_start = ''.html_safe % { url: branch_rules_link_url } = render ::Layouts::SettingsBlockComponent.new(s_("ProtectedBranch|Protected branches"), id: 'js-protected-branches-settings', @@ -12,21 +9,25 @@ = s_("ProtectedBranch|Keep stable branches secure and force developers to use merge requests.") = link_to s_("ProtectedBranch|What are protected branches?"), help_page_path("user/project/repository/branches/protected.md") - .gl-mt-5 - = render Pajamas::AlertComponent.new(alert_options: { class: 'gl-mb-5' }, dismissible: false) do |c| - - c.with_body do - = s_("ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}branch rules%{branch_rules_link_end}.").html_safe % { branch_rules_link_start: branch_rules_link_start, branch_rules_link_end: ''.html_safe } - = s_("ProtectedBranch|You can now manage branch protections, approval rules, and status checks in one place.") - = link_to s_("ProtectedBranch|How do I use branch rules?"), branch_rules_docs_link_url, target: '_blank', rel: 'noopener noreferrer' + - if @project.present? + - branch_rules_docs_link_url = help_page_path('user/project/repository/branches/branch_rules.md') + - branch_rules_link_url = project_settings_repository_path(@project, anchor: 'js-branch-rules') + - branch_rules_link_start = ''.html_safe % { url: branch_rules_link_url } - - c.with_body do - .js-alert-protected-branch-created-container.gl-mt-5 + = render Pajamas::AlertComponent.new( alert_options: { class: 'gl-mr-7 gl-mt-5' }, + dismissible: false) do |c| + - c.with_body do + = s_("ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}Branch rules%{branch_rules_link_end}.").html_safe % { branch_rules_link_start: branch_rules_link_start, branch_rules_link_end: ''.html_safe } + = s_("ProtectedBranch|You can now manage branch protections, approval rules, and status checks in one place.") + = link_to s_("ProtectedBranch|How do I use branch rules?"), branch_rules_docs_link_url, target: '_blank', rel: 'noopener noreferrer' + - c.with_body do + .js-alert-protected-branch-created-container = render Pajamas::AlertComponent.new(variant: :warning, alert_options: { class: 'gl-mb-5' }, dismissible: false) do |c| - c.with_body do - = s_("ProtectedBranch|Giving merge rights to a protected branch also gives elevated permissions for certain CI/CD features.") + = s_("ProtectedBranch|Giving merge rights to a protected branch also gives elevated permissions for certain CI/CD features.") = link_to s_("ProtectedBranch|What are the security implications?"), help_page_path('ci/pipelines/_index.md', anchor: 'pipeline-security-on-protected-branches'), target: '_blank', rel: 'noopener noreferrer' = render ::Layouts::CrudComponent.new(s_("ProtectedBranch|Protected branches"), diff --git a/locale/gitlab.pot b/locale/gitlab.pot index 6d840dcad9ee78..d56714d6d1c6f5 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -49050,7 +49050,7 @@ msgstr "" msgid "ProtectedBranch|Protected branches" msgstr "" -msgid "ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}branch rules%{branch_rules_link_end}." +msgid "ProtectedBranch|Protected branches is moving to %{branch_rules_link_start}Branch rules%{branch_rules_link_end}." msgstr "" msgid "ProtectedBranch|Reject code pushes that change files listed in the CODEOWNERS file." -- GitLab