diff options
Diffstat (limited to 'app/assets/javascripts/google_cloud/components/service_accounts_list.vue')
-rw-r--r-- | app/assets/javascripts/google_cloud/components/service_accounts_list.vue | 48 |
1 files changed, 36 insertions, 12 deletions
diff --git a/app/assets/javascripts/google_cloud/components/service_accounts_list.vue b/app/assets/javascripts/google_cloud/components/service_accounts_list.vue index b70b25a5dc3..4db84746482 100644 --- a/app/assets/javascripts/google_cloud/components/service_accounts_list.vue +++ b/app/assets/javascripts/google_cloud/components/service_accounts_list.vue @@ -1,9 +1,9 @@ <script> -import { GlButton, GlEmptyState, GlTable } from '@gitlab/ui'; +import { GlAlert, GlButton, GlEmptyState, GlLink, GlSprintf, GlTable } from '@gitlab/ui'; import { __ } from '~/locale'; export default { - components: { GlButton, GlEmptyState, GlTable }, + components: { GlAlert, GlButton, GlEmptyState, GlLink, GlSprintf, GlTable }, props: { list: { type: Array, @@ -28,6 +28,22 @@ export default { ], }; }, + i18n: { + createServiceAccount: __('Create service account'), + found: __('✔'), + notFound: __('Not found'), + noServiceAccountsTitle: __('No service accounts'), + noServiceAccountsDescription: __( + 'Service Accounts keys authorize GitLab to deploy your Google Cloud project', + ), + serviceAccountsTitle: __('Service accounts'), + serviceAccountsDescription: __( + 'Service Accounts keys authorize GitLab to deploy your Google Cloud project', + ), + secretManagersDescription: __( + 'Enhance security by storing service account keys in secret managers - learn more about %{docLinkStart}secret management with GitLab%{docLinkEnd}', + ), + }, }; </script> @@ -35,31 +51,39 @@ export default { <div> <gl-empty-state v-if="list.length === 0" - :title="__('No service accounts')" - :description=" - __('Service Accounts keys authorize GitLab to deploy your Google Cloud project') - " + :title="$options.i18n.noServiceAccountsTitle" + :description="$options.i18n.noServiceAccountsDescription" :primary-button-link="createUrl" - :primary-button-text="__('Create service account')" + :primary-button-text="$options.i18n.createServiceAccount" :svg-path="emptyIllustrationUrl" /> <div v-else> - <h2 class="gl-font-size-h2">{{ __('Service Accounts') }}</h2> - <p>{{ __('Service Accounts keys authorize GitLab to deploy your Google Cloud project') }}</p> + <h2 class="gl-font-size-h2">{{ $options.i18n.serviceAccountsTitle }}</h2> + <p>{{ $options.i18n.serviceAccountsDescription }}</p> <gl-table :items="list" :fields="tableFields"> <template #cell(service_account_exists)="{ value }"> - {{ value ? '✔' : __('Not found') }} + {{ value ? $options.i18n.found : $options.i18n.notFound }} </template> <template #cell(service_account_key_exists)="{ value }"> - {{ value ? '✔' : __('Not found') }} + {{ value ? $options.i18n.found : $options.i18n.notFound }} </template> </gl-table> <gl-button :href="createUrl" category="primary" variant="info"> - {{ __('Create service account') }} + {{ $options.i18n.createServiceAccount }} </gl-button> + + <gl-alert class="gl-mt-5" :dismissible="false" variant="tip"> + <gl-sprintf :message="$options.i18n.secretManagersDescription"> + <template #docLink="{ content }"> + <gl-link href="https://docs.gitlab.com/ee/ci/secrets/"> + {{ content }} + </gl-link> + </template> + </gl-sprintf> + </gl-alert> </div> </div> </template> |