2019-12-13 18:08:06 +00:00
< script >
2022-02-26 00:14:54 +00:00
import { GlAlert , GlLoadingIcon } from '@gitlab/ui' ;
2021-02-14 18:09:20 +00:00
import eventHub from '~/blob/components/eventhub' ;
2020-10-05 15:08:56 +00:00
import {
SNIPPET _MARK _VIEW _APP _START ,
SNIPPET _MEASURE _BLOBS _CONTENT ,
2020-11-05 21:08:51 +00:00
} from '~/performance/constants' ;
import { performanceMarkAndMeasure } from '~/performance/utils' ;
2021-02-14 18:09:20 +00:00
import { SNIPPET _VISIBILITY _PUBLIC } from '~/snippets/constants' ;
import CloneDropdownButton from '~/vue_shared/components/clone_dropdown.vue' ;
2019-12-13 18:08:06 +00:00
2020-04-14 15:09:44 +00:00
import { getSnippetMixin } from '../mixins/snippets' ;
2020-10-05 15:08:56 +00:00
import { markBlobPerformance } from '../utils/blob' ;
2021-02-14 18:09:20 +00:00
import EmbedDropdown from './embed_dropdown.vue' ;
2021-02-01 15:08:56 +00:00
import SnippetBlob from './snippet_blob_view.vue' ;
import SnippetHeader from './snippet_header.vue' ;
2021-02-14 18:09:20 +00:00
import SnippetTitle from './snippet_title.vue' ;
2020-04-14 15:09:44 +00:00
2020-10-05 15:08:56 +00:00
eventHub . $on ( SNIPPET _MEASURE _BLOBS _CONTENT , markBlobPerformance ) ;
2020-07-31 21:10:12 +00:00
2019-12-13 18:08:06 +00:00
export default {
2019-12-17 18:07:48 +00:00
components : {
2020-08-25 21:10:30 +00:00
EmbedDropdown ,
2019-12-17 18:07:48 +00:00
SnippetHeader ,
2019-12-18 15:08:03 +00:00
SnippetTitle ,
2022-02-26 00:14:54 +00:00
GlAlert ,
2019-12-17 18:07:48 +00:00
GlLoadingIcon ,
2020-01-31 15:08:42 +00:00
SnippetBlob ,
2020-07-24 12:09:34 +00:00
CloneDropdownButton ,
2019-12-17 18:07:48 +00:00
} ,
2020-04-14 15:09:44 +00:00
mixins : [ getSnippetMixin ] ,
2020-07-01 00:09:02 +00:00
computed : {
embeddable ( ) {
return this . snippet . visibilityLevel === SNIPPET _VISIBILITY _PUBLIC ;
} ,
2020-07-24 12:09:34 +00:00
canBeCloned ( ) {
return Boolean ( this . snippet . sshUrlToRepo || this . snippet . httpUrlToRepo ) ;
} ,
2022-02-26 00:14:54 +00:00
hasUnretrievableBlobs ( ) {
return this . snippet . hasUnretrievableBlobs ;
} ,
2020-07-01 00:09:02 +00:00
} ,
2020-07-31 21:10:12 +00:00
beforeCreate ( ) {
2020-10-05 15:08:56 +00:00
performanceMarkAndMeasure ( { mark : SNIPPET _MARK _VIEW _APP _START } ) ;
2020-07-31 21:10:12 +00:00
} ,
2019-12-13 18:08:06 +00:00
} ;
< / script >
< template >
2019-12-17 18:07:48 +00:00
< div class = "js-snippet-view" >
< gl -loading -icon
v - if = "isLoading"
: label = "__('Loading snippet')"
2020-04-14 15:09:44 +00:00
size = "lg"
2020-08-21 00:10:44 +00:00
class = "loading-animation prepend-top-20 gl-mb-6"
2019-12-17 18:07:48 +00:00
/ >
2019-12-18 15:08:03 +00:00
< template v-else >
< snippet -header :snippet ="snippet" / >
< snippet -title :snippet ="snippet" / >
2020-07-24 12:09:34 +00:00
< div class = "gl-display-flex gl-justify-content-end gl-mb-5" >
2020-09-09 09:08:40 +00:00
< embed -dropdown
v - if = "embeddable"
: url = "snippet.webUrl"
data - qa - selector = "snippet_embed_dropdown"
/ >
2020-07-24 12:09:34 +00:00
< clone -dropdown -button
v - if = "canBeCloned"
class = "gl-ml-3"
: ssh - link = "snippet.sshUrlToRepo"
: http - link = "snippet.httpUrlToRepo"
data - qa - selector = "clone_button"
/ >
< / div >
2022-02-26 00:14:54 +00:00
< gl -alert v-if ="hasUnretrievableBlobs" variant="danger" class="gl-mb-3" :dismissible ="false" >
{ {
_ _ (
'WARNING: This snippet contains hidden files which might be used to mask malicious behavior. Exercise caution if cloning and executing code from this snippet.' ,
)
} }
< / g l - a l e r t >
2021-10-28 18:14:18 +00:00
< snippet -blob
v - for = "blob in blobs"
: key = "blob.path"
: snippet = "snippet"
: blob = "blob"
class = "project-highlight-puc"
/ >
2019-12-18 15:08:03 +00:00
< / template >
2019-12-17 18:07:48 +00:00
< / div >
2019-12-13 18:08:06 +00:00
< / template >