Add latest changes from gitlab-org/gitlab@master

4 files changed, 23 insertions, 62 deletions

diff --git a/app/assets/javascripts/issues/dashboard/components/issues_dashboard_app.vue b/app/assets/javascripts/issues/dashboard/components/issues_dashboard_app.vue
index 4d936428ea6..14fe88b8f61 100644
--- a/app/assets/javascripts/issues/dashboard/components/issues_dashboard_app.vue
+++ b/app/assets/javascripts/issues/dashboard/components/issues_dashboard_app.vue
@@ -29,6 +29,7 @@ import {
   getSortOptions,
   isSortKey,
 } from '~/issues/list/utils';
+import { fetchPolicies } from '~/lib/graphql';
 import axios from '~/lib/utils/axios_utils';
 import { scrollUp } from '~/lib/utils/scroll_utils';
 import { getParameterByName } from '~/lib/utils/url_utility';
@@ -126,6 +127,10 @@ export default {
       update(data) {
         return data.issues.nodes ?? [];
       },
+      fetchPolicy: fetchPolicies.CACHE_AND_NETWORK,
+      // We need this for handling loading state when using frontend cache
+      // See https://gitlab.com/gitlab-org/gitlab/-/merge_requests/106004#note_1217325202 for details
+      notifyOnNetworkStatusChange: true,
       result({ data }) {
         this.pageInfo = data?.issues.pageInfo ?? {};
       },
@@ -183,6 +188,17 @@ export default {
     hasSearch() {
       return Boolean(this.searchQuery || Object.keys(this.urlFilterParams).length);
     },
+    // due to the issues with cache-and-network, we need this hack to check if there is any data for the query in the cache.
+    // if we have cached data, we disregard the loading state
+    isLoading() {
+      return (
+        this.$apollo.queries.issues.loading &&
+        !this.$apollo.provider.clients.defaultClient.readQuery({
+          query: getIssuesQuery,
+          variables: this.queryVariables,
+        })
+      );
+    },
     queryVariables() {
       return {
         hideUsers: this.isPublicVisibilityRestricted && !this.isSignedIn,
@@ -446,7 +462,7 @@ export default {
     :initial-filter-value="filterTokens"
     :initial-sort-by="sortKey"
     :issuables="renderedIssues"
-    :issuables-loading="$apollo.queries.issues.loading"
+    :issuables-loading="isLoading"
     namespace="dashboard"
     recent-searches-storage-key="issues"
     :search-input-placeholder="$options.i18n.searchPlaceholder"
diff --git a/app/assets/javascripts/issues/dashboard/index.js b/app/assets/javascripts/issues/dashboard/index.js
index 005ab5ce3b0..999f07781b2 100644
--- a/app/assets/javascripts/issues/dashboard/index.js
+++ b/app/assets/javascripts/issues/dashboard/index.js
@@ -1,10 +1,10 @@
 import Vue from 'vue';
 import VueApollo from 'vue-apollo';
-import createDefaultClient from '~/lib/graphql';
+import { gqlClient } from '~/issues/list/graphql';
 import { parseBoolean } from '~/lib/utils/common_utils';
 import IssuesDashboardApp from './components/issues_dashboard_app.vue';
 
-export function mountIssuesDashboardApp() {
+export async function mountIssuesDashboardApp() {
   const el = document.querySelector('.js-issues-dashboard');
 
   if (!el) {
@@ -34,7 +34,7 @@ export function mountIssuesDashboardApp() {
     el,
     name: 'IssuesDashboardRoot',
     apolloProvider: new VueApollo({
-      defaultClient: createDefaultClient(),
+      defaultClient: await gqlClient(),
     }),
     provide: {
       autocompleteAwardEmojisPath,
diff --git a/app/assets/javascripts/issues/dashboard/queries/get_issues.query.graphql b/app/assets/javascripts/issues/dashboard/queries/get_issues.query.graphql
index 5625e6afad3..5c331fe95e2 100644
--- a/app/assets/javascripts/issues/dashboard/queries/get_issues.query.graphql
+++ b/app/assets/javascripts/issues/dashboard/queries/get_issues.query.graphql
@@ -1,5 +1,5 @@
 #import "~/graphql_shared/fragments/page_info.fragment.graphql"
-#import "./issue.fragment.graphql"
+#import "~/issues/list/queries/issue.fragment.graphql"
 
 query getDashboardIssues(
   $hideUsers: Boolean = false
@@ -44,8 +44,9 @@ query getDashboardIssues(
     before: $beforeCursor
     first: $firstPageSize
     last: $lastPageSize
-  ) {
+  ) @persist {
     nodes {
+      __persist
       ...IssueFragment
       reference(full: true)
     }
diff --git a/app/assets/javascripts/issues/dashboard/queries/issue.fragment.graphql b/app/assets/javascripts/issues/dashboard/queries/issue.fragment.graphql
deleted file mode 100644
index 040763f2ba4..00000000000
--- a/app/assets/javascripts/issues/dashboard/queries/issue.fragment.graphql
+++ /dev/null
@@ -1,56 +0,0 @@
-fragment IssueFragment on Issue {
-  id
-  iid
-  confidential
-  createdAt
-  downvotes
-  dueDate
-  hidden
-  humanTimeEstimate
-  mergeRequestsCount
-  moved
-  state
-  title
-  updatedAt
-  closedAt
-  upvotes
-  userDiscussionsCount @include(if: $isSignedIn)
-  webPath
-  webUrl
-  type
-  assignees @skip(if: $hideUsers) {
-    nodes {
-      id
-      avatarUrl
-      name
-      username
-      webUrl
-    }
-  }
-  author @skip(if: $hideUsers) {
-    id
-    avatarUrl
-    name
-    username
-    webUrl
-  }
-  labels {
-    nodes {
-      id
-      color
-      title
-      description
-    }
-  }
-  milestone {
-    id
-    dueDate
-    startDate
-    webPath
-    title
-  }
-  taskCompletionStatus {
-    completedCount
-    count
-  }
-}