Create expandable container component
What does this MR do?
Adds an ExpandableSection component, for #233521 (closed), part of &3635 (closed).
It may be worth extracting this to GitLab UI in a future iteration. For now, it exists only in the SAST Configuration subdirectory. This was discussed previously.
Screenshot/Video
As this component isn't consumed anywhere, this screenshot was created by applying this patch and taking a screenshot of that.
Patch to consume component for screenshot
diff --git b/ee/app/assets/javascripts/security_configuration/sast/components/configuration_form.vue a/ee/app/assets/javascripts/security_configuration/sast/components/configuration_form.vue
index e83bf0af4c6..3a2fc316a25 100644
--- b/ee/app/assets/javascripts/security_configuration/sast/components/configuration_form.vue
+++ a/ee/app/assets/javascripts/security_configuration/sast/components/configuration_form.vue
@@ -1,18 +1,22 @@
<script>
-import { GlAlert, GlButton } from '@gitlab/ui';
+import { GlAlert, GlButton, GlIcon, GlLink } from '@gitlab/ui';
import * as Sentry from '@sentry/browser';
import { cloneDeep } from 'lodash';
import { __, s__ } from '~/locale';
import axios from '~/lib/utils/axios_utils';
import { redirectTo } from '~/lib/utils/url_utility';
import DynamicFields from './dynamic_fields.vue';
+import ExpandableSection from './expandable_section.vue';
import { isValidConfigurationEntity } from './utils';
export default {
components: {
DynamicFields,
+ ExpandableSection,
GlAlert,
GlButton,
+ GlIcon,
+ GlLink,
},
inject: {
createSastMergeRequestPath: {
@@ -68,6 +72,11 @@ export default {
},
},
i18n: {
+ analyzerSubheading: s__(
+ `SecurityConfiguration|By default, analyzers are applied in order to cover
+ all languages across your project, and only run if the language is detected
+ in the MR.`,
+ ),
submissionError: s__(
'SecurityConfiguration|An error occurred while creating the merge request.',
),
@@ -81,7 +90,22 @@ export default {
<form @submit.prevent="onSubmit">
<dynamic-fields v-model="formEntities" />
- <hr />
+ <expandable-section class="gl-mb-6">
+ <template #heading>
+ {{ s__('SecurityConfiguration|SAST Analyzers') }}
+ <gl-link
+ target="_blank"
+ href="sastDocumentationPath"
+ :aria-label="s__('SecurityConfiguration|SAST Analyzers help')"
+ >
+ <gl-icon name="question" class="gl-vertical-align-baseline!" />
+ </gl-link>
+ </template>
+
+ <template #subheading>{{ $options.i18n.analyzerSubheading }}</template>
+
+ {{ $options.i18n.analyzerSubheading }}
+ </expandable-section>
<gl-alert v-if="hasSubmissionError" class="gl-mb-5" variant="danger" :dismissible="false">{{
$options.i18n.submissionError
Does this MR meet the acceptance criteria?
Conformity
- [-] Changelog entry
- [-] Documentation (if required)
-
Code review guidelines - [-] Merge request performance guidelines
-
Style guides - [-] Database guides
-
Separation of EE specific content
Availability and Testing
-
Review and add/update tests for this feature/bug. Consider all test levels. See the Test Planning Process. - [-] Tested in all supported browsers
- [-] Informed Infrastructure department of a default or new setting change, if applicable per definition of done
Edited by Mark Florian
Merge request reports
Activity
Filter activity
Please register or sign in to reply