Merge branch...

Merge branch '207367-change-link-icons-on-security-configuration-page-to-follow-design-system' into 'master'

Follow pajamas on security configuration (link icons)

See merge request gitlab-org/gitlab!26340

changelogs/unreleased/207367-change-link-icons-on-security-configuration-page-to-follow-design-.yml

+---
+title: Resolve Change link-icons on security configuration page to follow design system
+merge_request: 26340
+author:
+type: other

doc/user/application_security/configuration/index.md

@@ -11,7 +11,7 @@ type: reference, howto
 The security configuration page displays the configuration state of each of the security
 features and can be accessed through a project's sidebar nav.
 
-![Screenshot of security configuration page](../img/security_configuration_page_v12_6.png)
+![Screenshot of security configuration page](../img/security_configuration_page_v12_9.png)
 
 The page uses the project's latest default branch [CI pipeline](../../../ci/pipelines.md) to determine the configuration
 state of each feature. If a job with the expected security report artifact exists in the pipeline,

ee/app/assets/javascripts/security_configuration/components/app.vue

 <script>
 import { GlLink } from '@gitlab/ui';
-import { __, sprintf } from '~/locale';
+import { s__, __, sprintf } from '~/locale';
 import Icon from '~/vue_shared/components/icon.vue';
 
 export default {
@@ -71,6 +71,13 @@ export default {
       return sprintf(body, { linkStart, linkEnd }, false);
     },
   },
+  methods: {
+    getFeatureDocumentationLinkLabel(featureName) {
+      return sprintf(s__('SecurityConfiguration|Feature documentation for %{featureName}'), {
+        featureName,
+      });
+    },
+  },
 };
 </script>
 
@@ -119,16 +126,15 @@ export default {
                 <div class="text-2 gl-text-gray-900">
                   {{ feature.name }}
                 </div>
-                <gl-link
-                  class="d-inline-flex ml-1"
-                  target="_blank"
-                  :href="feature.link"
-                  :aria-label="s__('SecurityConfiguration|Feature documentation')"
-                  ><icon name="external-link"
-                /></gl-link>
               </div>
               <div class="text-secondary">
                 {{ feature.description }}
+                <gl-link
+                  target="_blank"
+                  :href="feature.link"
+                  :aria-label="getFeatureDocumentationLinkLabel(feature.name)"
+                  >{{ __('More information') }}</gl-link
+                >
               </div>
             </div>
           </div>

ee/app/presenters/projects/security/configuration_presenter.rb

@@ -8,11 +8,11 @@ module Projects
       presents :project
 
       SCAN_DESCRIPTIONS = {
-        container_scanning: _('Check your Docker images for known vulnerabilities'),
+        container_scanning: _('Check your Docker images for known vulnerabilities.'),
         dast: _('Analyze a review version of your web application.'),
-        dependency_scanning: _('Analyze your dependencies for known vulnerabilities'),
-        license_management: _('Search your project dependencies for their licenses and apply policies'),
-        sast: _('Analyze your source code for known vulnerabilities')
+        dependency_scanning: _('Analyze your dependencies for known vulnerabilities.'),
+        license_management: _('Search your project dependencies for their licenses and apply policies.'),
+        sast: _('Analyze your source code for known vulnerabilities.')
       }.freeze
 
       SCAN_DOCS = {

ee/spec/frontend/security_configuration/components/__snapshots__/app_spec.js.snap

@@ -54,18 +54,6 @@ exports[`Security Configuration App features table displays a given feature 1`]
                 name-feature-0
               
             </div>
-             
-            <gl-link-stub
-              aria-label="Feature documentation"
-              class="d-inline-flex ml-1"
-              href="link-feature-0"
-              target="_blank"
-            >
-              <icon-stub
-                name="external-link"
-                size="16"
-              />
-            </gl-link-stub>
           </div>
            
           <div
@@ -73,7 +61,14 @@ exports[`Security Configuration App features table displays a given feature 1`]
           >
             
               description-feature-0
-            
+              
+            <gl-link-stub
+              aria-label="Feature documentation for name-feature-0"
+              href="link-feature-0"
+              target="_blank"
+            >
+              More information
+            </gl-link-stub>
           </div>
         </div>
       </div>

locale/gitlab.pot

@@ -2026,10 +2026,10 @@ msgstr ""
 msgid "Analyze a review version of your web application."
 msgstr ""
 
-msgid "Analyze your dependencies for known vulnerabilities"
+msgid "Analyze your dependencies for known vulnerabilities."
 msgstr ""
 
-msgid "Analyze your source code for known vulnerabilities"
+msgid "Analyze your source code for known vulnerabilities."
 msgstr ""
 
 msgid "Ancestors"
@@ -3463,7 +3463,7 @@ msgstr ""
 msgid "Check your .gitlab-ci.yml"
 msgstr ""
 
-msgid "Check your Docker images for known vulnerabilities"
+msgid "Check your Docker images for known vulnerabilities."
 msgstr ""
 
 msgid "Checking %{text} availability…"
@@ -17091,7 +17091,7 @@ msgstr ""
 msgid "Search users or groups"
 msgstr ""
 
-msgid "Search your project dependencies for their licenses and apply policies"
+msgid "Search your project dependencies for their licenses and apply policies."
 msgstr ""
 
 msgid "Search your projects"
@@ -17317,7 +17317,7 @@ msgstr ""
 msgid "SecurityConfiguration|Feature"
 msgstr ""
 
-msgid "SecurityConfiguration|Feature documentation"
+msgid "SecurityConfiguration|Feature documentation for %{featureName}"
 msgstr ""
 
 msgid "SecurityConfiguration|Not yet configured"