Changed how the default avatar is setissue-boards-no-avatar

7 files changed, 33 insertions, 14 deletions

diff --git a/app/assets/javascripts/boards/boards_bundle.js b/app/assets/javascripts/boards/boards_bundle.js
index b6dee8177d2..8c08b2d4db3 100644
--- a/app/assets/javascripts/boards/boards_bundle.js
+++ b/app/assets/javascripts/boards/boards_bundle.js
@@ -59,7 +59,8 @@ $(() => {
       issueLinkBase: $boardApp.dataset.issueLinkBase,
       rootPath: $boardApp.dataset.rootPath,
       bulkUpdatePath: $boardApp.dataset.bulkUpdatePath,
-      detailIssue: Store.detail
+      detailIssue: Store.detail,
+      defaultAvatar: $boardApp.dataset.defaultAvatar,
     },
     computed: {
       detailIssueVisible () {
@@ -82,7 +83,7 @@ $(() => {
       gl.boardService.all()
         .then((resp) => {
           resp.json().forEach((board) => {
-            const list = Store.addList(board);
+            const list = Store.addList(board, this.defaultAvatar);
 
             if (list.type === 'closed') {
               list.position = Infinity;
diff --git a/app/assets/javascripts/boards/models/issue.js b/app/assets/javascripts/boards/models/issue.js
index d6175069e37..db783467f87 100644
--- a/app/assets/javascripts/boards/models/issue.js
+++ b/app/assets/javascripts/boards/models/issue.js
@@ -6,7 +6,7 @@
 import Vue from 'vue';
 
 class ListIssue {
-  constructor (obj) {
+  constructor (obj, defaultAvatar) {
     this.globalId = obj.id;
     this.id = obj.iid;
     this.title = obj.title;
@@ -19,7 +19,7 @@ class ListIssue {
     this.position = obj.relative_position || Infinity;
 
     if (obj.assignee) {
-      this.assignee = new ListUser(obj.assignee);
+      this.assignee = new ListUser(obj.assignee, defaultAvatar);
     }
 
     if (obj.milestone) {
diff --git a/app/assets/javascripts/boards/models/list.js b/app/assets/javascripts/boards/models/list.js
index f2b79a88a4a..bd2f62bcc1a 100644
--- a/app/assets/javascripts/boards/models/list.js
+++ b/app/assets/javascripts/boards/models/list.js
@@ -6,7 +6,7 @@ import queryData from '../utils/query_data';
 const PER_PAGE = 20;
 
 class List {
-  constructor (obj) {
+  constructor (obj, defaultAvatar) {
     this.id = obj.id;
     this._uid = this.guid();
     this.position = obj.position;
@@ -18,6 +18,7 @@ class List {
     this.loadingMore = false;
     this.issues = [];
     this.issuesSize = 0;
+    this.defaultAvatar = defaultAvatar;
 
     if (obj.label) {
       this.label = new ListLabel(obj.label);
@@ -106,7 +107,7 @@ class List {
 
   createIssues (data) {
     data.forEach((issueObj) => {
-      this.addIssue(new ListIssue(issueObj));
+      this.addIssue(new ListIssue(issueObj, this.defaultAvatar));
     });
   }
 
diff --git a/app/assets/javascripts/boards/models/user.js b/app/assets/javascripts/boards/models/user.js
index 875c21a37d3..2af583c3279 100644
--- a/app/assets/javascripts/boards/models/user.js
+++ b/app/assets/javascripts/boards/models/user.js
@@ -1,12 +1,9 @@
-/* eslint-disable no-unused-vars */
-import defaultAvatar from '../utils/default_avatar';
-
 class ListUser {
-  constructor(user) {
+  constructor(user, defaultAvatar) {
     this.id = user.id;
     this.name = user.name;
     this.username = user.username;
-    this.avatar = user.avatar_url || defaultAvatar();
+    this.avatar = user.avatar_url || defaultAvatar;
   }
 }
 
diff --git a/app/assets/javascripts/boards/stores/boards_store.js b/app/assets/javascripts/boards/stores/boards_store.js
index ccb00099215..ad9997ac334 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js
+++ b/app/assets/javascripts/boards/stores/boards_store.js
@@ -23,8 +23,8 @@ gl.issueBoards.BoardsStore = {
     this.state.lists = [];
     this.filter.path = gl.utils.getUrlParamsArray().join('&');
   },
-  addList (listObj) {
-    const list = new List(listObj);
+  addList (listObj, defaultAvatar) {
+    const list = new List(listObj, defaultAvatar);
     this.state.lists.push(list);
 
     return list;
diff --git a/app/assets/javascripts/boards/utils/default_avatar.js b/app/assets/javascripts/boards/utils/default_avatar.js
deleted file mode 100644
index 062ffec6dce..00000000000
--- a/app/assets/javascripts/boards/utils/default_avatar.js
+++ /dev/null
@@ -1 +0,0 @@
-export default () => document.getElementById('board-app').dataset.defaultAvatar;
diff --git a/spec/javascripts/boards/issue_card_spec.js b/spec/javascripts/boards/issue_card_spec.js
index 1a5e9e9fd07..ef567635d48 100644
--- a/spec/javascripts/boards/issue_card_spec.js
+++ b/spec/javascripts/boards/issue_card_spec.js
@@ -146,6 +146,27 @@ describe('Issue card component', () => {
         ).not.toBeNull();
       });
     });
+
+    describe('assignee default avatar', () => {
+      beforeEach((done) => {
+        component.issue.assignee = new ListUser({
+          id: 1,
+          name: 'testing 123',
+          username: 'test',
+        }, 'default_avatar');
+
+        Vue.nextTick(done);
+      });
+
+      it('displays defaults avatar if users avatar is null', () => {
+        expect(
+          component.$el.querySelector('.card-assignee img'),
+        ).not.toBeNull();
+        expect(
+          component.$el.querySelector('.card-assignee img').getAttribute('src'),
+        ).toBe('default_avatar');
+      });
+    });
   });
 
   describe('labels', () => {