diff options
Diffstat (limited to 'app/assets/javascripts/releases/components/release_block_assets.vue')
| -rw-r--r-- | app/assets/javascripts/releases/components/release_block_assets.vue | 137 |
1 files changed, 44 insertions, 93 deletions
diff --git a/app/assets/javascripts/releases/components/release_block_assets.vue b/app/assets/javascripts/releases/components/release_block_assets.vue index 8824cbefd7e..eb83d8657c0 100644 --- a/app/assets/javascripts/releases/components/release_block_assets.vue +++ b/app/assets/javascripts/releases/components/release_block_assets.vue @@ -1,7 +1,6 @@ <script> import { GlTooltipDirective, GlLink, GlButton, GlCollapse, GlIcon, GlBadge } from '@gitlab/ui'; import { difference, get } from 'lodash'; -import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import { ASSET_LINK_TYPE } from '../constants'; import { __, s__, sprintf } from '~/locale'; @@ -17,7 +16,6 @@ export default { directives: { GlTooltip: GlTooltipDirective, }, - mixins: [glFeatureFlagsMixin()], props: { assets: { type: Object, @@ -30,9 +28,6 @@ export default { }; }, computed: { - hasAssets() { - return Boolean(this.assets.count); - }, imageLinks() { return this.linksForType(ASSET_LINK_TYPE.IMAGE); }, @@ -95,94 +90,50 @@ export default { <template> <div class="card-text gl-mt-3"> - <template v-if="glFeatures.releaseAssetLinkType"> - <gl-button - data-testid="accordion-button" - variant="link" - class="gl-font-weight-bold" - @click="toggleAssetsExpansion" - > - <gl-icon - name="chevron-right" - class="gl-transition-medium" - :class="{ 'gl-rotate-90': isAssetsExpanded }" - /> - {{ __('Assets') }} - <gl-badge size="sm" variant="neutral" class="gl-display-inline-block">{{ - assets.count - }}</gl-badge> - </gl-button> - <gl-collapse v-model="isAssetsExpanded"> - <div class="gl-pl-6 gl-pt-3 js-assets-list"> - <template v-for="(section, index) in sections"> - <h5 v-if="section.title" :key="`section-header-${index}`" class="gl-mb-2"> - {{ section.title }} - </h5> - <ul :key="`section-body-${index}`" class="list-unstyled gl-m-0"> - <li v-for="link in section.links" :key="link.url"> - <gl-link - :href="link.directAssetUrl || link.url" - class="gl-display-flex gl-align-items-center gl-line-height-24" - > - <gl-icon - :name="section.iconName" - class="gl-mr-2 gl-flex-shrink-0 gl-flex-grow-0" - /> - {{ link.name }} - <gl-icon - v-if="link.external" - v-gl-tooltip - name="external-link" - :aria-label="$options.externalLinkTooltipText" - :title="$options.externalLinkTooltipText" - data-testid="external-link-indicator" - class="gl-ml-2 gl-flex-shrink-0 gl-flex-grow-0 gl-text-gray-400" - /> - </gl-link> - </li> - </ul> - </template> - </div> - </gl-collapse> - </template> - - <template v-else> - <b> - {{ __('Assets') }} - <span class="js-assets-count badge badge-pill">{{ assets.count }}</span> - </b> - - <ul v-if="assets.links.length" class="pl-0 mb-0 gl-mt-3 list-unstyled js-assets-list"> - <li v-for="link in assets.links" :key="link.name" class="gl-mb-3"> - <gl-link v-gl-tooltip.bottom :title="__('Download asset')" :href="link.directAssetUrl"> - <gl-icon name="package" class="align-middle gl-mr-2 align-text-bottom" /> - {{ link.name }} - <span v-if="link.external" data-testid="external-link-indicator">{{ - __('(external source)') - }}</span> - </gl-link> - </li> - </ul> - - <div v-if="hasAssets" class="dropdown"> - <button - type="button" - class="btn btn-link" - data-toggle="dropdown" - aria-haspopup="true" - aria-expanded="false" - > - <gl-icon name="doc-code" class="align-top gl-mr-2" /> - {{ __('Source code') }} - <gl-icon name="chevron-down" /> - </button> - - <div class="js-sources-dropdown dropdown-menu"> - <li v-for="asset in assets.sources" :key="asset.url"> - <gl-link :href="asset.url">{{ __('Download') }} {{ asset.format }}</gl-link> - </li> - </div> + <gl-button + data-testid="accordion-button" + variant="link" + class="gl-font-weight-bold" + @click="toggleAssetsExpansion" + > + <gl-icon + name="chevron-right" + class="gl-transition-medium" + :class="{ 'gl-rotate-90': isAssetsExpanded }" + /> + {{ __('Assets') }} + <gl-badge size="sm" variant="neutral" class="gl-display-inline-block">{{ + assets.count + }}</gl-badge> + </gl-button> + <gl-collapse v-model="isAssetsExpanded"> + <div class="gl-pl-6 gl-pt-3 js-assets-list"> + <template v-for="(section, index) in sections"> + <h5 v-if="section.title" :key="`section-header-${index}`" class="gl-mb-2"> + {{ section.title }} + </h5> + <ul :key="`section-body-${index}`" class="list-unstyled gl-m-0"> + <li v-for="link in section.links" :key="link.url" class="gl-display-flex"> + <gl-link + :href="link.directAssetUrl || link.url" + class="gl-display-flex gl-align-items-center gl-line-height-24" + > + <gl-icon :name="section.iconName" class="gl-mr-2 gl-flex-shrink-0 gl-flex-grow-0" /> + {{ link.name }} + <gl-icon + v-if="link.external" + v-gl-tooltip + name="external-link" + :aria-label="$options.externalLinkTooltipText" + :title="$options.externalLinkTooltipText" + data-testid="external-link-indicator" + class="gl-ml-2 gl-flex-shrink-0 gl-flex-grow-0 gl-text-gray-400" + /> + </gl-link> + </li> + </ul> + </template> </div> - </template> + </gl-collapse> </div> </template> |