debian-mirror-gitlab/app/assets/javascripts/access_tokens/components/tokens_app.vue
2022-01-26 12:08:38 +05:30

111 lines
4.2 KiB
Vue

<script>
import { GlSprintf, GlLink } from '@gitlab/ui';
import { pickBy } from 'lodash';
import { s__ } from '~/locale';
import { FEED_TOKEN, INCOMING_EMAIL_TOKEN, STATIC_OBJECT_TOKEN } from '../constants';
import Token from './token.vue';
export default {
i18n: {
canNotAccessOtherData: s__('AccessTokens|It cannot be used to access any other data.'),
[FEED_TOKEN]: {
label: s__('AccessTokens|Feed token'),
copyButtonTitle: s__('AccessTokens|Copy feed token'),
description: s__(
'AccessTokens|Your feed token authenticates you when your RSS reader loads a personalized RSS feed or when your calendar application loads a personalized calendar. It is visible in those feed URLs.',
),
inputDescription: s__(
'AccessTokens|Keep this token secret. Anyone who has it can read activity and issue RSS feeds or your calendar feed as if they were you. If that happens, %{linkStart}reset this token%{linkEnd}.',
),
resetConfirmMessage: s__(
'AccessTokens|Are you sure? Any RSS or calendar URLs currently in use will stop working.',
),
},
[INCOMING_EMAIL_TOKEN]: {
label: s__('AccessTokens|Incoming email token'),
copyButtonTitle: s__('AccessTokens|Copy incoming email token'),
description: s__(
'AccessTokens|Your incoming email token authenticates you when you create a new issue by email, and is included in your personal project-specific email addresses.',
),
inputDescription: s__(
'AccessTokens|Keep this token secret. Anyone who has it can create issues as if they were you. If that happens, %{linkStart}reset this token%{linkEnd}.',
),
resetConfirmMessage: s__(
'AccessTokens|Are you sure? Any issue email addresses currently in use will stop working.',
),
},
[STATIC_OBJECT_TOKEN]: {
label: s__('AccessTokens|Static object token'),
copyButtonTitle: s__('AccessTokens|Copy static object token'),
description: s__(
'AccessTokens|Your static object token authenticates you when repository static objects (such as archives or blobs) are served from an external storage.',
),
inputDescription: s__(
'AccessTokens|Keep this token secret. Anyone who has it can access repository static objects as if they were you. If that ever happens, %{linkStart}reset this token%{linkEnd}.',
),
resetConfirmMessage: s__('AccessTokens|Are you sure?'),
},
},
htmlAttributes: {
[FEED_TOKEN]: {
inputId: 'feed_token',
containerTestId: 'feed-token-container',
},
[INCOMING_EMAIL_TOKEN]: {
inputId: 'incoming_email_token',
containerTestId: 'incoming-email-token-container',
},
[STATIC_OBJECT_TOKEN]: {
inputId: 'static_object_token',
containerTestId: 'static-object-token-container',
},
},
components: { Token, GlSprintf, GlLink },
inject: ['tokenTypes'],
computed: {
enabledTokenTypes() {
return pickBy(this.tokenTypes, (tokenData, tokenType) => {
return (
tokenData?.enabled &&
this.$options.i18n[tokenType] &&
this.$options.htmlAttributes[tokenType]
);
});
},
},
};
</script>
<template>
<div>
<token
v-for="(tokenData, tokenType) in enabledTokenTypes"
:key="tokenType"
:token="tokenData.token"
:input-id="$options.htmlAttributes[tokenType].inputId"
:input-label="$options.i18n[tokenType].label"
:copy-button-title="$options.i18n[tokenType].copyButtonTitle"
:data-testid="$options.htmlAttributes[tokenType].containerTestId"
>
<template #title>{{ $options.i18n[tokenType].label }}</template>
<template #description>
<p>{{ $options.i18n[tokenType].description }}</p>
<p>{{ $options.i18n.canNotAccessOtherData }}</p>
</template>
<template #input-description>
<gl-sprintf :message="$options.i18n[tokenType].inputDescription">
<template #link="{ content }">
<gl-link
:href="tokenData.resetPath"
:data-confirm="$options.i18n[tokenType].resetConfirmMessage"
data-method="put"
>{{ content }}</gl-link
>
</template>
</gl-sprintf>
</template>
</token>
</div>
</template>