2020-03-13 15:44:24 +05:30
< script >
2020-07-28 23:09:34 +05:30
import { GlEmptyState , GlSprintf , GlLink , GlFormInputGroup , GlFormInput } from '@gitlab/ui' ;
2020-04-22 19:07:51 +05:30
import { mapState , mapGetters } from 'vuex' ;
import { s _ _ } from '~/locale' ;
2020-03-13 15:44:24 +05:30
import ClipboardButton from '~/vue_shared/components/clipboard_button.vue' ;
2020-06-23 00:09:42 +05:30
import {
COPY _LOGIN _TITLE ,
COPY _BUILD _TITLE ,
COPY _PUSH _TITLE ,
QUICK _START ,
} from '../../constants/index' ;
2020-03-13 15:44:24 +05:30
export default {
name : 'ProjectEmptyState' ,
components : {
ClipboardButton ,
GlEmptyState ,
GlSprintf ,
GlLink ,
2020-07-28 23:09:34 +05:30
GlFormInputGroup ,
GlFormInput ,
2020-03-13 15:44:24 +05:30
} ,
2020-04-22 19:07:51 +05:30
i18n : {
quickStart : QUICK _START ,
copyLoginTitle : COPY _LOGIN _TITLE ,
copyBuildTitle : COPY _BUILD _TITLE ,
copyPushTitle : COPY _PUSH _TITLE ,
introText : s _ _ (
` ContainerRegistry|With the Container Registry, every project can have its own space to store its Docker images. %{docLinkStart}More Information%{docLinkEnd} ` ,
) ,
notLoggedInMessage : s _ _ (
` ContainerRegistry|If you are not already logged in, you need to authenticate to the Container Registry by using your GitLab username and password. If you have %{twofaDocLinkStart}Two-Factor Authentication%{twofaDocLinkEnd} enabled, use a %{personalAccessTokensDocLinkStart}Personal Access Token%{personalAccessTokensDocLinkEnd} instead of a password. ` ,
) ,
addImageText : s _ _ (
'ContainerRegistry|You can add an image to this registry with the following commands:' ,
) ,
} ,
2020-03-13 15:44:24 +05:30
computed : {
... mapState ( [ 'config' ] ) ,
2020-04-22 19:07:51 +05:30
... mapGetters ( [ 'dockerBuildCommand' , 'dockerPushCommand' , 'dockerLoginCommand' ] ) ,
2020-03-13 15:44:24 +05:30
} ,
} ;
< / script >
< template >
< gl-empty-state
: title = "s__('ContainerRegistry|There are no container images stored for this project')"
: svg - path = "config.noContainersImage"
>
< template # description >
2020-07-28 23:09:34 +05:30
< p >
2020-04-22 19:07:51 +05:30
< gl-sprintf :message = "$options.i18n.introText" >
2020-03-13 15:44:24 +05:30
< template # docLink = "{content}" >
< gl-link :href = "config.helpPagePath" target = "_blank" > { { content } } < / gl-link >
< / template >
< / gl-sprintf >
< / p >
2020-04-22 19:07:51 +05:30
< h5 > { { $options . i18n . quickStart } } < / h5 >
2020-07-28 23:09:34 +05:30
< p >
2020-04-22 19:07:51 +05:30
< gl-sprintf :message = "$options.i18n.notLoggedInMessage" >
2020-03-13 15:44:24 +05:30
< template # twofaDocLink = "{content}" >
< gl-link :href = "config.twoFactorAuthHelpLink" target = "_blank" > { { content } } < / gl-link >
< / template >
< template # personalAccessTokensDocLink = "{content}" >
< gl-link :href = "config.personalAccessTokensHelpLink" target = "_blank" > { {
content
} } < / gl-link >
< / template >
< / gl-sprintf >
< / p >
2020-07-28 23:09:34 +05:30
< gl-form-input-group class = "gl-mb-4" >
< gl-form-input
: value = "dockerLoginCommand"
readonly
type = "text"
class = "gl-font-monospace!"
/ >
< template # append >
2020-03-13 15:44:24 +05:30
< clipboard-button
: text = "dockerLoginCommand"
2020-04-22 19:07:51 +05:30
: title = "$options.i18n.copyLoginTitle"
2020-07-28 23:09:34 +05:30
class = "gl-m-0!"
2020-03-13 15:44:24 +05:30
/ >
2020-07-28 23:09:34 +05:30
< / template >
< / gl-form-input-group >
< p class = "gl-mb-4" >
2020-04-22 19:07:51 +05:30
{ { $options . i18n . addImageText } }
2020-03-13 15:44:24 +05:30
< / p >
2020-07-28 23:09:34 +05:30
< gl-form-input-group class = "gl-mb-4 " >
< gl-form-input
: value = "dockerBuildCommand"
readonly
type = "text"
class = "gl-font-monospace!"
/ >
< template # append >
2020-03-13 15:44:24 +05:30
< clipboard-button
: text = "dockerBuildCommand"
2020-04-22 19:07:51 +05:30
: title = "$options.i18n.copyBuildTitle"
2020-07-28 23:09:34 +05:30
class = "gl-m-0!"
2020-03-13 15:44:24 +05:30
/ >
2020-07-28 23:09:34 +05:30
< / template >
< / gl-form-input-group >
< gl-form-input-group >
< gl-form-input :value = "dockerPushCommand" readonly type = "text" class = "gl-font-monospace!" / >
< template # append >
2020-03-13 15:44:24 +05:30
< clipboard-button
: text = "dockerPushCommand"
2020-04-22 19:07:51 +05:30
: title = "$options.i18n.copyPushTitle"
2020-07-28 23:09:34 +05:30
class = "gl-m-0!"
2020-03-13 15:44:24 +05:30
/ >
2020-07-28 23:09:34 +05:30
< / template >
< / gl-form-input-group >
2020-03-13 15:44:24 +05:30
< / template >
< / gl-empty-state >
< / template >