diff options
Diffstat (limited to 'app/assets/javascripts/security_configuration/components/redesigned_app.vue')
| -rw-r--r-- | app/assets/javascripts/security_configuration/components/redesigned_app.vue | 82 |
1 files changed, 57 insertions, 25 deletions
diff --git a/app/assets/javascripts/security_configuration/components/redesigned_app.vue b/app/assets/javascripts/security_configuration/components/redesigned_app.vue index d8a12f4a792..915da378a4f 100644 --- a/app/assets/javascripts/security_configuration/components/redesigned_app.vue +++ b/app/assets/javascripts/security_configuration/components/redesigned_app.vue @@ -2,18 +2,22 @@ import { GlTab, GlTabs, GlSprintf, GlLink } from '@gitlab/ui'; import { __, s__ } from '~/locale'; import UserCalloutDismisser from '~/vue_shared/components/user_callout_dismisser.vue'; +import AutoDevOpsAlert from './auto_dev_ops_alert.vue'; import FeatureCard from './feature_card.vue'; import SectionLayout from './section_layout.vue'; import UpgradeBanner from './upgrade_banner.vue'; export const i18n = { compliance: s__('SecurityConfiguration|Compliance'), + configurationHistory: s__('SecurityConfiguration|Configuration history'), securityTesting: s__('SecurityConfiguration|Security testing'), - securityTestingDescription: s__( + latestPipelineDescription: s__( `SecurityConfiguration|The status of the tools only applies to the - default branch and is based on the %{linkStart}latest pipeline%{linkEnd}. - Once you've enabled a scan for the default branch, any subsequent feature - branch you create will include the scan.`, + default branch and is based on the %{linkStart}latest pipeline%{linkEnd}.`, + ), + description: s__( + `SecurityConfiguration|Once you've enabled a scan for the default branch, + any subsequent feature branch you create will include the scan.`, ), securityConfiguration: __('Security Configuration'), }; @@ -28,6 +32,7 @@ export default { FeatureCard, SectionLayout, UpgradeBanner, + AutoDevOpsAlert, UserCalloutDismisser, }, props: { @@ -44,6 +49,16 @@ export default { required: false, default: false, }, + autoDevopsEnabled: { + type: Boolean, + required: false, + default: false, + }, + canEnableAutoDevops: { + type: Boolean, + required: false, + default: false, + }, gitlabCiHistoryPath: { type: String, required: false, @@ -64,16 +79,26 @@ export default { canViewCiHistory() { return Boolean(this.gitlabCiPresent && this.gitlabCiHistoryPath); }, + shouldShowDevopsAlert() { + return !this.autoDevopsEnabled && !this.gitlabCiPresent && this.canEnableAutoDevops; + }, }, }; </script> <template> <article> + <user-callout-dismisser + v-if="shouldShowDevopsAlert" + feature-name="security_configuration_devops_alert" + > + <template #default="{ dismiss, shouldShowCallout }"> + <auto-dev-ops-alert v-if="shouldShowCallout" class="gl-mt-3" @dismiss="dismiss" /> + </template> + </user-callout-dismisser> <header> <h1 class="gl-font-size-h1">{{ $options.i18n.securityConfiguration }}</h1> </header> - <user-callout-dismisser v-if="canUpgrade" feature-name="security_configuration_upgrade_banner"> <template #default="{ dismiss, shouldShowCallout }"> <upgrade-banner v-if="shouldShowCallout" @close="dismiss" /> @@ -84,16 +109,19 @@ export default { <gl-tab data-testid="security-testing-tab" :title="$options.i18n.securityTesting"> <section-layout :heading="$options.i18n.securityTesting"> <template #description> - <p - v-if="latestPipelinePath" - data-testid="latest-pipeline-info-security" - class="gl-line-height-20" - > - <gl-sprintf :message="$options.i18n.securityTestingDescription"> - <template #link="{ content }"> - <gl-link :href="latestPipelinePath">{{ content }}</gl-link> - </template> - </gl-sprintf> + <p> + <span data-testid="latest-pipeline-info-security"> + <gl-sprintf + v-if="latestPipelinePath" + :message="$options.i18n.latestPipelineDescription" + > + <template #link="{ content }"> + <gl-link :href="latestPipelinePath">{{ content }}</gl-link> + </template> + </gl-sprintf> + </span> + + {{ $options.i18n.description }} </p> <p v-if="canViewCiHistory"> <gl-link data-testid="security-view-history-link" :href="gitlabCiHistoryPath">{{ @@ -106,6 +134,7 @@ export default { <feature-card v-for="feature in augmentedSecurityFeatures" :key="feature.type" + data-testid="security-testing-card" :feature="feature" class="gl-mb-6" /> @@ -115,16 +144,19 @@ export default { <gl-tab data-testid="compliance-testing-tab" :title="$options.i18n.compliance"> <section-layout :heading="$options.i18n.compliance"> <template #description> - <p - v-if="latestPipelinePath" - class="gl-line-height-20" - data-testid="latest-pipeline-info-compliance" - > - <gl-sprintf :message="$options.i18n.securityTestingDescription"> - <template #link="{ content }"> - <gl-link :href="latestPipelinePath">{{ content }}</gl-link> - </template> - </gl-sprintf> + <p> + <span data-testid="latest-pipeline-info-compliance"> + <gl-sprintf + v-if="latestPipelinePath" + :message="$options.i18n.latestPipelineDescription" + > + <template #link="{ content }"> + <gl-link :href="latestPipelinePath">{{ content }}</gl-link> + </template> + </gl-sprintf> + </span> + + {{ $options.i18n.description }} </p> <p v-if="canViewCiHistory"> <gl-link data-testid="compliance-view-history-link" :href="gitlabCiHistoryPath">{{ |