Commit bad32044 authored by Natalia Tepluhina's avatar Natalia Tepluhina Committed by Fatih Acet

Resolve "Design view: Download single issue design image"

parent 11726288
---
title: 'Resolve Design view: Download single issue design image'
merge_request: 20703
author:
type: added
......@@ -2,6 +2,7 @@
import { __, sprintf } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue';
import timeagoMixin from '~/vue_shared/mixins/timeago';
import { GlButton } from '@gitlab/ui';
import Pagination from './pagination.vue';
import DeleteButton from '../delete_button.vue';
import permissionsQuery from '../../graphql/queries/permissions.query.graphql';
......@@ -12,6 +13,7 @@ export default {
Icon,
Pagination,
DeleteButton,
GlButton,
},
mixins: [timeagoMixin],
props: {
......@@ -23,7 +25,7 @@ export default {
type: Boolean,
required: true,
},
name: {
filename: {
type: String,
required: false,
default: '',
......@@ -42,6 +44,10 @@ export default {
type: Boolean,
required: true,
},
image: {
type: String,
required: true,
},
},
data() {
return {
......@@ -99,10 +105,13 @@ export default {
<icon :size="18" name="close" />
</router-link>
<div class="overflow-hidden d-flex align-items-center">
<h2 class="m-0 str-truncated-100">{{ name }}</h2>
<h2 class="m-0 str-truncated-100">{{ filename }}</h2>
<small v-if="updatedAt" class="text-secondary">{{ updatedText }}</small>
</div>
<pagination :id="id" class="ml-auto flex-shrink-0" />
<gl-button :href="image" class="mr-2">
<icon :size="18" name="download" />
</gl-button>
<delete-button
v-if="isLatestVersion && canDeleteDesign"
:is-deleting="isDeleting"
......
......@@ -200,10 +200,8 @@ export default {
<toolbar
:id="id"
:is-deleting="loading"
:name="design.filename"
:updated-at="design.updatedAt"
:updated-by="design.updatedBy"
:is-latest-version="isLatestVersion"
v-bind="design"
@delete="mutate()"
/>
</template>
......
......@@ -35,6 +35,16 @@ exports[`Design management toolbar component renders design and updated data 1`]
id="1"
/>
<glbutton-stub
class="mr-2"
href="/-/designs/306/7f747adcd4693afadbe968d7ba7d983349b9012d"
>
<icon-stub
name="download"
size="18"
/>
</glbutton-stub>
<deletebutton-stub
buttonclass=""
buttonvariant="danger"
......
......@@ -2,6 +2,7 @@ import { createLocalVue, shallowMount } from '@vue/test-utils';
import VueRouter from 'vue-router';
import Toolbar from 'ee/design_management/components/toolbar/index.vue';
import DeleteButton from 'ee/design_management/components/delete_button.vue';
import { GlButton } from '@gitlab/ui';
const localVue = createLocalVue();
localVue.use(VueRouter);
......@@ -34,11 +35,12 @@ describe('Design management toolbar component', () => {
isLatestVersion: true,
isLoading,
isDeleting: false,
name: 'test.jpg',
filename: 'test.jpg',
updatedAt: updatedAt.toString(),
updatedBy: {
name: 'Test Name',
},
image: '/-/designs/306/7f747adcd4693afadbe968d7ba7d983349b9012d',
...props,
},
stubs: {
......@@ -110,4 +112,10 @@ describe('Design management toolbar component', () => {
expect(wrapper.emitted().delete).toBeTruthy();
});
});
it('renders download button with correct link', () => {
expect(wrapper.find(GlButton).attributes('href')).toBe(
'/-/designs/306/7f747adcd4693afadbe968d7ba7d983349b9012d',
);
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment