Hide reference path on project board cards

Previous to the refactor of boards (:graphql_board_lists), only the
issue number was shown on cards. Now we show the full path. It's
redundant and adds clutter to the view.

Changelog: fixed

app/assets/javascripts/boards/components/board_card_inner.vue

@@ -65,7 +65,7 @@ export default {
   },
   computed: {
     ...mapState(['isShowingLabels', 'issuableType', 'allowSubEpics']),
-    ...mapGetters(['isEpicBoard']),
+    ...mapGetters(['isEpicBoard', 'isProjectBoard']),
     cappedAssignees() {
       // e.g. maxRender is 4,
       // Render up to all 4 assignees if there are only 4 assigness
@@ -144,6 +144,9 @@ export default {
     totalProgress() {
       return Math.round((this.item.descendantWeightSum.closedIssues / this.totalWeight) * 100);
     },
+    showReferencePath() {
+      return !this.isProjectBoard && this.itemReferencePath;
+    },
   },
   methods: {
     ...mapActions(['performSearch', 'setError']),
@@ -247,7 +250,7 @@ export default {
           :class="{ 'gl-font-base': isEpicBoard }"
         >
           <tooltip-on-truncate
-            v-if="itemReferencePath"
+            v-if="showReferencePath"
             :title="itemReferencePath"
             placement="bottom"
             class="board-item-path gl-text-truncate gl-font-weight-bold"

spec/frontend/boards/board_card_inner_spec.js

@@ -9,7 +9,7 @@ import { issuableTypes } from '~/boards/constants';
 import eventHub from '~/boards/eventhub';
 import defaultStore from '~/boards/stores';
 import { updateHistory } from '~/lib/utils/url_utility';
-import { mockLabelList, mockIssue } from './mock_data';
+import { mockLabelList, mockIssue, mockIssueFullPath } from './mock_data';
 
 jest.mock('~/lib/utils/url_utility');
 jest.mock('~/boards/eventhub');
@@ -45,7 +45,7 @@ describe('Board card component', () => {
   const findEpicCountablesTotalWeight = () => wrapper.findByTestId('epic-countables-total-weight');
   const findEpicProgressTooltip = () => wrapper.findByTestId('epic-progress-tooltip-content');
 
-  const createStore = ({ isEpicBoard = false } = {}) => {
+  const createStore = ({ isEpicBoard = false, isProjectBoard = false } = {}) => {
     store = new Vuex.Store({
       ...defaultStore,
       state: {
@@ -55,7 +55,7 @@ describe('Board card component', () => {
       getters: {
         isGroupBoard: () => true,
         isEpicBoard: () => isEpicBoard,
-        isProjectBoard: () => false,
+        isProjectBoard: () => isProjectBoard,
       },
     });
   };
@@ -134,6 +134,17 @@ describe('Board card component', () => {
     expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false);
   });
 
+  it('does not render item reference path', () => {
+    createStore({ isProjectBoard: true });
+    createWrapper();
+
+    expect(wrapper.find('.board-card-number').text()).not.toContain(mockIssueFullPath);
+  });
+
+  it('renders item reference path', () => {
+    expect(wrapper.find('.board-card-number').text()).toContain(mockIssueFullPath);
+  });
+
   describe('blocked', () => {
     it('renders blocked icon if issue is blocked', async () => {
       createWrapper({

spec/frontend/boards/components/board_card_spec.js

@@ -31,6 +31,7 @@ describe('Board card', () => {
       actions: mockActions,
       getters: {
         isEpicBoard: () => false,
+        isProjectBoard: () => false,
       },
     });
   };