diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2018-03-21 12:35:57 +0000 |
---|---|---|
committer | Filipa Lacerda <filipa@gitlab.com> | 2018-03-21 12:35:57 +0000 |
commit | 22fc4863d33ad68ab65cd74182741e9a7e6d316f (patch) | |
tree | c9d95c623e1f784a742977f0207f85a2cc54a5b2 | |
parent | bba6676cca17ea2e9acaa881c93c1785e7817936 (diff) | |
parent | 6202657ec722b3d3ec9edd9a1d3647050c1a561a (diff) | |
download | gitlab-ce-22fc4863d33ad68ab65cd74182741e9a7e6d316f.tar.gz |
Merge branch 'ide-project-avatar-identicon' into 'master'
Changes empty project avatar to identicon in the IDE
Closes #44298
See merge request gitlab-org/gitlab-ce!17899
3 files changed, 62 insertions, 7 deletions
diff --git a/app/assets/javascripts/ide/components/ide_project_tree.vue b/app/assets/javascripts/ide/components/ide_project_tree.vue index 220db1abfb0..a6f40286ac1 100644 --- a/app/assets/javascripts/ide/components/ide_project_tree.vue +++ b/app/assets/javascripts/ide/components/ide_project_tree.vue @@ -1,13 +1,15 @@ <script> -import projectAvatarImage from '~/vue_shared/components/project_avatar/image.vue'; -import branchesTree from './ide_project_branches_tree.vue'; -import externalLinks from './ide_external_links.vue'; +import ProjectAvatarImage from '~/vue_shared/components/project_avatar/image.vue'; +import Identicon from '../../vue_shared/components/identicon.vue'; +import BranchesTree from './ide_project_branches_tree.vue'; +import ExternalLinks from './ide_external_links.vue'; export default { components: { - branchesTree, - externalLinks, - projectAvatarImage, + BranchesTree, + ExternalLinks, + ProjectAvatarImage, + Identicon, }, props: { project: { @@ -25,7 +27,10 @@ export default { :title="project.name" :href="project.web_url" > - <div class="avatar-container s40 project-avatar"> + <div + v-if="project.avatar_url" + class="avatar-container s40 project-avatar" + > <project-avatar-image class="avatar-container project-avatar" :link-href="project.path" @@ -34,6 +39,12 @@ export default { :img-size="40" /> </div> + <identicon + v-else + size-class="s40" + :entity-id="project.id" + :entity-name="project.name" + /> <div class="sidebar-context-title"> {{ project.name }} </div> diff --git a/changelogs/unreleased/ide-project-avatar-identicon.yml b/changelogs/unreleased/ide-project-avatar-identicon.yml new file mode 100644 index 00000000000..2b8b00018a8 --- /dev/null +++ b/changelogs/unreleased/ide-project-avatar-identicon.yml @@ -0,0 +1,5 @@ +--- +title: Make project avatar in IDE consistent with the rest of GitLab +merge_request: +author: +type: changed diff --git a/spec/javascripts/ide/components/ide_project_tree_spec.js b/spec/javascripts/ide/components/ide_project_tree_spec.js new file mode 100644 index 00000000000..657682cb39c --- /dev/null +++ b/spec/javascripts/ide/components/ide_project_tree_spec.js @@ -0,0 +1,39 @@ +import Vue from 'vue'; +import ProjectTree from '~/ide/components/ide_project_tree.vue'; +import createComponent from 'spec/helpers/vue_mount_component_helper'; + +describe('IDE project tree', () => { + const Component = Vue.extend(ProjectTree); + let vm; + + beforeEach(() => { + vm = createComponent(Component, { + project: { + id: 1, + name: 'test', + web_url: gl.TEST_HOST, + avatar_url: '', + branches: [], + }, + }); + }); + + afterEach(() => { + vm.$destroy(); + }); + + it('renders identicon when projct has no avatar', () => { + expect(vm.$el.querySelector('.identicon')).not.toBeNull(); + }); + + it('renders avatar image if project has avatar', done => { + vm.project.avatar_url = gl.TEST_HOST; + + vm.$nextTick(() => { + expect(vm.$el.querySelector('.identicon')).toBeNull(); + expect(vm.$el.querySelector('img.avatar')).not.toBeNull(); + + done(); + }); + }); +}); |