Add latest changes from gitlab-org/gitlab@master

6 files changed, 33 insertions, 21 deletions

diff --git a/app/assets/javascripts/boards/components/board_app.vue b/app/assets/javascripts/boards/components/board_app.vue
index 858aabb0f05..af753151be8 100644
--- a/app/assets/javascripts/boards/components/board_app.vue
+++ b/app/assets/javascripts/boards/components/board_app.vue
@@ -1,5 +1,6 @@
 <script>
-import { mapActions, mapGetters } from 'vuex';
+import { mapGetters } from 'vuex';
+import { refreshCurrentPage } from '~/lib/utils/url_utility';
 import BoardContent from '~/boards/components/board_content.vue';
 import BoardSettingsSidebar from '~/boards/components/board_settings_sidebar.vue';
 import BoardTopBar from '~/boards/components/board_top_bar.vue';
@@ -14,11 +15,11 @@ export default {
   computed: {
     ...mapGetters(['isSidebarOpen']),
   },
-  mounted() {
-    this.performSearch();
+  created() {
+    window.addEventListener('popstate', refreshCurrentPage);
   },
-  methods: {
-    ...mapActions(['performSearch']),
+  destroyed() {
+    window.removeEventListener('popstate', refreshCurrentPage);
   },
 };
 </script>
diff --git a/app/assets/javascripts/boards/components/boards_selector.vue b/app/assets/javascripts/boards/components/boards_selector.vue
index d7edaaa02d8..eaf3facb450 100644
--- a/app/assets/javascripts/boards/components/boards_selector.vue
+++ b/app/assets/javascripts/boards/components/boards_selector.vue
@@ -14,6 +14,8 @@ import { mapActions, mapGetters, mapState } from 'vuex';
 import BoardForm from 'ee_else_ce/boards/components/board_form.vue';
 
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
+import { isMetaKey } from '~/lib/utils/common_utils';
+import { updateHistory } from '~/lib/utils/url_utility';
 import { s__ } from '~/locale';
 
 import eventHub from '../eventhub';
@@ -21,6 +23,7 @@ import groupBoardsQuery from '../graphql/group_boards.query.graphql';
 import projectBoardsQuery from '../graphql/project_boards.query.graphql';
 import groupRecentBoardsQuery from '../graphql/group_recent_boards.query.graphql';
 import projectRecentBoardsQuery from '../graphql/project_recent_boards.query.graphql';
+import { fullBoardId } from '../boards_util';
 
 const MIN_BOARDS_TO_VIEW_RECENT = 10;
 
@@ -112,6 +115,9 @@ export default {
       this.scrollFadeInitialized = false;
       this.$nextTick(this.setScrollFade);
     },
+    board(newBoard) {
+      document.title = newBoard.name;
+    },
   },
   created() {
     eventHub.$on('showBoardModal', this.showPage);
@@ -120,7 +126,7 @@ export default {
     eventHub.$off('showBoardModal', this.showPage);
   },
   methods: {
-    ...mapActions(['setError', 'setBoardConfig']),
+    ...mapActions(['setError', 'fetchBoard', 'unsetActiveId']),
     showPage(page) {
       this.currentPage = page;
     },
@@ -196,6 +202,22 @@ export default {
 
       this.hasScrollFade = this.isScrolledUp();
     },
+    fetchCurrentBoard(boardId) {
+      this.fetchBoard({
+        fullPath: this.fullPath,
+        fullBoardId: fullBoardId(boardId),
+        boardType: this.boardType,
+      });
+    },
+    async switchBoard(boardId, e) {
+      if (isMetaKey(e)) {
+        window.open(`${this.boardBaseUrl}/${boardId}`, '_blank');
+      } else {
+        this.unsetActiveId();
+        this.fetchCurrentBoard(boardId);
+        updateHistory({ url: `${this.boardBaseUrl}/${boardId}` });
+      }
+    },
   },
   i18n: {
     errorFetchingBoard: s__('Board|An error occurred while fetching the board, please try again.'),
@@ -242,8 +264,8 @@ export default {
             <gl-dropdown-item
               v-for="recentBoard in recentBoards"
               :key="`recent-${recentBoard.id}`"
-              :href="`${boardBaseUrl}/${recentBoard.id}`"
               data-testid="dropdown-item"
+              @click.prevent="switchBoard(recentBoard.id, $event)"
             >
               {{ recentBoard.name }}
             </gl-dropdown-item>
@@ -258,8 +280,8 @@ export default {
           <gl-dropdown-item
             v-for="otherBoard in filteredBoards"
             :key="otherBoard.id"
-            :href="`${boardBaseUrl}/${otherBoard.id}`"
             data-testid="dropdown-item"
+            @click.prevent="switchBoard(otherBoard.id, $event)"
           >
             {{ otherBoard.name }}
           </gl-dropdown-item>
diff --git a/app/assets/javascripts/boards/stores/actions.js b/app/assets/javascripts/boards/stores/actions.js
index d319e659ac0..791182af806 100644
--- a/app/assets/javascripts/boards/stores/actions.js
+++ b/app/assets/javascripts/boards/stores/actions.js
@@ -68,8 +68,7 @@ export default {
           commit(types.RECEIVE_BOARD_FAILURE);
         } else {
           const board = data.workspace?.board;
-          commit(types.RECEIVE_BOARD_SUCCESS, board);
-          dispatch('setBoardConfig', board);
+          dispatch('setBoard', board);
         }
       })
       .catch(() => commit(types.RECEIVE_BOARD_FAILURE));
@@ -420,9 +419,6 @@ export default {
   fetchItemsForList: ({ state, commit }, { listId, fetchNext = false }) => {
     if (!listId) return null;
 
-    if (!fetchNext) {
-      commit(types.RESET_ITEMS_FOR_LIST, listId);
-    }
     commit(types.REQUEST_ITEMS_FOR_LIST, { listId, fetchNext });
 
     const { fullPath, fullBoardId, boardType, filterParams } = state;
@@ -444,6 +440,7 @@ export default {
           isSingleRequest: true,
         },
         variables,
+        ...(!fetchNext ? { fetchPolicy: fetchPolicies.NO_CACHE } : {}),
       })
       .then(({ data }) => {
         const { lists } = data[boardType].board;
diff --git a/app/assets/javascripts/boards/stores/mutation_types.js b/app/assets/javascripts/boards/stores/mutation_types.js
index 96ab302c98f..43268f21f96 100644
--- a/app/assets/javascripts/boards/stores/mutation_types.js
+++ b/app/assets/javascripts/boards/stores/mutation_types.js
@@ -18,7 +18,6 @@ export const MOVE_LISTS = 'MOVE_LISTS';
 export const TOGGLE_LIST_COLLAPSED = 'TOGGLE_LIST_COLLAPSED';
 export const REMOVE_LIST = 'REMOVE_LIST';
 export const REMOVE_LIST_FAILURE = 'REMOVE_LIST_FAILURE';
-export const RESET_ITEMS_FOR_LIST = 'RESET_ITEMS_FOR_LIST';
 export const REQUEST_ITEMS_FOR_LIST = 'REQUEST_ITEMS_FOR_LIST';
 export const RECEIVE_ITEMS_FOR_LIST_FAILURE = 'RECEIVE_ITEMS_FOR_LIST_FAILURE';
 export const RECEIVE_ITEMS_FOR_LIST_SUCCESS = 'RECEIVE_ITEMS_FOR_LIST_SUCCESS';
diff --git a/app/assets/javascripts/boards/stores/mutations.js b/app/assets/javascripts/boards/stores/mutations.js
index 6dda0e2af8b..04e7d3643e7 100644
--- a/app/assets/javascripts/boards/stores/mutations.js
+++ b/app/assets/javascripts/boards/stores/mutations.js
@@ -145,11 +145,6 @@ export default {
     state.boardLists = listsBackup;
   },
 
-  [mutationTypes.RESET_ITEMS_FOR_LIST]: (state, listId) => {
-    Vue.set(state, 'backupItemsList', state.boardItemsByListId[listId]);
-    Vue.set(state.boardItemsByListId, listId, []);
-  },
-
   [mutationTypes.REQUEST_ITEMS_FOR_LIST]: (state, { listId, fetchNext }) => {
     Vue.set(state.listsFlags, listId, { [fetchNext ? 'isLoadingMore' : 'isLoading']: true });
   },
@@ -185,7 +180,6 @@ export default {
       'Boards|An error occurred while fetching the board issues. Please reload the page.',
     );
     Vue.set(state.listsFlags, listId, { isLoading: false, isLoadingMore: false });
-    Vue.set(state.boardItemsByListId, listId, state.backupItemsList);
   },
 
   [mutationTypes.RESET_ISSUES]: (state) => {
diff --git a/app/assets/javascripts/boards/stores/state.js b/app/assets/javascripts/boards/stores/state.js
index 02275e40703..b62c032b921 100644
--- a/app/assets/javascripts/boards/stores/state.js
+++ b/app/assets/javascripts/boards/stores/state.js
@@ -13,7 +13,6 @@ export default () => ({
   boardLists: {},
   listsFlags: {},
   boardItemsByListId: {},
-  backupItemsList: [],
   isSettingAssignees: false,
   pageInfoByListId: {},
   boardItems: {},