diff options
Diffstat (limited to 'app/assets/javascripts/blob/components')
4 files changed, 64 insertions, 6 deletions
diff --git a/app/assets/javascripts/blob/components/blob_header.vue b/app/assets/javascripts/blob/components/blob_header.vue index 1645469a218..c5ab28e6ec5 100644 --- a/app/assets/javascripts/blob/components/blob_header.vue +++ b/app/assets/javascripts/blob/components/blob_header.vue @@ -42,6 +42,11 @@ export default { required: false, default: false, }, + showPath: { + type: Boolean, + required: false, + default: true, + }, }, data() { return { @@ -55,6 +60,9 @@ export default { showDefaultActions() { return !this.hideDefaultActions; }, + isEmpty() { + return this.blob.rawSize === 0; + }, }, watch: { viewer(newVal, oldVal) { @@ -74,7 +82,7 @@ export default { <div class="js-file-title file-title-flex-parent"> <div class="gl-display-flex"> <table-of-contents class="gl-pr-2" /> - <blob-filepath :blob="blob"> + <blob-filepath :blob="blob" :show-path="showPath"> <template #filepath-prepend> <slot name="prepend"></slot> </template> @@ -88,10 +96,13 @@ export default { <default-actions v-if="showDefaultActions" - :raw-path="blob.rawPath" + :raw-path="blob.externalStorageUrl || blob.rawPath" :active-viewer="viewer" :has-render-error="hasRenderError" :is-binary="isBinary" + :environment-name="blob.environmentFormattedExternalUrl" + :environment-path="blob.environmentExternalUrlForRouteMap" + :is-empty="isEmpty" @copy="proxyCopyRequest" /> </div> diff --git a/app/assets/javascripts/blob/components/blob_header_default_actions.vue b/app/assets/javascripts/blob/components/blob_header_default_actions.vue index 2798a918b15..12bcb24b0cc 100644 --- a/app/assets/javascripts/blob/components/blob_header_default_actions.vue +++ b/app/assets/javascripts/blob/components/blob_header_default_actions.vue @@ -1,5 +1,6 @@ <script> import { GlButton, GlButtonGroup, GlTooltipDirective } from '@gitlab/ui'; +import { sprintf, s__ } from '~/locale'; import { BTN_COPY_CONTENTS_TITLE, BTN_DOWNLOAD_TITLE, @@ -37,6 +38,21 @@ export default { required: false, default: false, }, + environmentName: { + type: String, + required: false, + default: null, + }, + environmentPath: { + type: String, + required: false, + default: null, + }, + isEmpty: { + type: Boolean, + required: false, + default: false, + }, }, computed: { downloadUrl() { @@ -51,6 +67,11 @@ export default { showCopyButton() { return !this.hasRenderError && !this.isBinary; }, + environmentTitle() { + return sprintf(s__('BlobViewer|View on %{environmentName}'), { + environmentName: this.environmentName, + }); + }, }, BTN_COPY_CONTENTS_TITLE, BTN_DOWNLOAD_TITLE, @@ -71,6 +92,7 @@ export default { icon="copy-to-clipboard" category="primary" variant="default" + class="js-copy-blob-source-btn" /> <gl-button v-if="!isBinary" @@ -84,6 +106,7 @@ export default { variant="default" /> <gl-button + v-if="!isEmpty" v-gl-tooltip.hover :aria-label="$options.BTN_DOWNLOAD_TITLE" :title="$options.BTN_DOWNLOAD_TITLE" @@ -93,5 +116,17 @@ export default { category="primary" variant="default" /> + <gl-button + v-if="environmentName && environmentPath" + v-gl-tooltip.hover + :aria-label="environmentTitle" + :title="environmentTitle" + :href="environmentPath" + data-testid="environment" + target="_blank" + icon="external-link" + category="primary" + variant="default" + /> </gl-button-group> </template> diff --git a/app/assets/javascripts/blob/components/blob_header_filepath.vue b/app/assets/javascripts/blob/components/blob_header_filepath.vue index 90d01358451..62355306655 100644 --- a/app/assets/javascripts/blob/components/blob_header_filepath.vue +++ b/app/assets/javascripts/blob/components/blob_header_filepath.vue @@ -15,6 +15,11 @@ export default { type: Object, required: true, }, + showPath: { + type: Boolean, + required: false, + default: true, + }, }, computed: { blobSize() { @@ -26,6 +31,13 @@ export default { showLfsBadge() { return this.blob.storedExternally && this.blob.externalStorage === 'lfs'; }, + fileName() { + if (this.showPath) { + return this.blob.path; + } + + return this.blob.name; + }, }, }; </script> @@ -33,12 +45,12 @@ export default { <div class="file-header-content d-flex align-items-center lh-100"> <slot name="filepath-prepend"></slot> - <template v-if="blob.path"> - <file-icon :file-name="blob.path" :size="16" aria-hidden="true" css-classes="mr-2" /> + <template v-if="fileName"> + <file-icon :file-name="fileName" :size="16" aria-hidden="true" css-classes="mr-2" /> <strong class="file-title-name mr-1 js-blob-header-filepath" data-qa-selector="file_title_content" - >{{ blob.path }}</strong + >{{ fileName }}</strong > </template> diff --git a/app/assets/javascripts/blob/components/constants.js b/app/assets/javascripts/blob/components/constants.js index a129c537fa5..adac4d6408d 100644 --- a/app/assets/javascripts/blob/components/constants.js +++ b/app/assets/javascripts/blob/components/constants.js @@ -42,7 +42,7 @@ export const BLOB_RENDER_ERRORS = { id: 'load', text: __('load it anyway'), conjunction: __('or'), - href: '#', + href: '?expanded=true&viewer=simple', target: '', event: BLOB_RENDER_EVENT_LOAD, }, |