app/assets/javascripts/content_editor/extensions/copy_paste.js

@@ -162,12 +162,28 @@ export default Extension.create({
                 language: 'markdown',
               });
 
-              const contentToInsert = isMarkdownCodeBlockActive
-                ? gfmContent || textContent
-                : textContent.replace(/^\s+|\s+$/gm, '');
+              let contentToInsert;
+              if (isMarkdownCodeBlockActive) {
+                contentToInsert = gfmContent || textContent;
+              } else if (pasteRaw) {
+                contentToInsert = textContent.replace(/^\s+|\s+$/gm, '');
+              } else {
+                contentToInsert = textContent;
+              }
 
               if (!contentToInsert) return false;
 
+              if (isCodeBlockActive) contentToInsert = { type: 'text', text: contentToInsert };
+              else {
+                contentToInsert = {
+                  type: 'paragraph',
+                  content: contentToInsert
+                    .split('\n')
+                    .map((text) => [{ type: 'text', text }, { type: 'hardBreak' }])
+                    .flat(),
+                };
+              }
+
               this.editor.commands.insertContentAt({ from, to }, contentToInsert);
               return true;
             }

app/assets/javascripts/content_editor/services/serialization_helpers.js

@@ -718,7 +718,7 @@ export const link = {
       return isBracketAutoLink(mark.attrs.sourceMarkdown) ? '>' : '';
     }
 
-    const { href, title, sourceMarkdown, isReference } = mark.attrs;
+    const { href = '', title, sourceMarkdown, isReference } = mark.attrs;
 
     // eslint-disable-next-line @gitlab/require-i18n-strings
     if (href.startsWith('data:') || href.startsWith('blob:')) return '';

app/assets/javascripts/crm/contacts/components/contacts_root.vue

@@ -231,7 +231,6 @@ export default {
           sort-by="createdAt"
           show-empty
           no-local-sorting
-          sort-icon-left
           fixed
           @sort-changed="fetchSortedData"
         >

app/assets/javascripts/crm/organizations/components/organizations_root.vue

@@ -222,7 +222,6 @@ export default {
           sort-by="createdAt"
           show-empty
           no-local-sorting
-          sort-icon-left
           fixed
           @sort-changed="fetchSortedData"
         >

app/assets/javascripts/custom_emoji/components/list.vue

@@ -110,7 +110,7 @@ export default {
           <gl-table-lite
             :items="customEmojis"
             :fields="$options.fields"
-            table-class="gl-table-layout-fixed"
+            table-class="gl-table-fixed"
           >
             <template #table-colgroup="scope">
               <col

app/assets/javascripts/deploy_freeze/index.js

@@ -5,6 +5,10 @@ import createStore from './store';
 export default () => {
   const el = document.getElementById('js-deploy-freeze-table');
 
+  if (!el) {
+    return null;
+  }
+
   const { projectId, timezoneData } = el.dataset;
 
   const store = createStore({

app/assets/javascripts/design_management/components/design_notes/design_discussion.vue

@@ -146,13 +146,13 @@ export default {
       return this.discussion.notes.slice(1);
     },
     areRepliesShown() {
-      return !this.discussion.resolved || !this.areRepliesCollapsed;
+      return !this.areRepliesCollapsed;
     },
     resolveIconName() {
       return this.discussion.resolved ? 'check-circle-filled' : 'check-circle';
     },
     isRepliesWidgetVisible() {
-      return this.discussion.resolved && this.discussionReplies.length > 0;
+      return this.discussionReplies.length > 0;
     },
     isReplyPlaceholderVisible() {
       return this.areRepliesShown || !this.discussionReplies.length;

app/assets/javascripts/design_management/components/design_notes/toggle_replies_widget.vue

 <script>
-import { GlIcon, GlButton, GlLink } from '@gitlab/ui';
+import { GlButton, GlAvatar, GlAvatarLink, GlAvatarsInline, GlTooltipDirective } from '@gitlab/ui';
 import { __, n__ } from '~/locale';
-import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
 
 export default {
   name: 'ToggleNotesWidget',
   components: {
-    GlIcon,
     GlButton,
-    GlLink,
-    TimeAgoTooltip,
+    GlAvatar,
+    GlAvatarLink,
+    GlAvatarsInline,
+  },
+  directives: {
+    GlTooltip: GlTooltipDirective,
   },
   props: {
     collapsed: {
@@ -22,49 +24,68 @@ export default {
     },
   },
   computed: {
-    lastReply() {
-      return this.replies[this.replies.length - 1];
-    },
     iconName() {
       return this.collapsed ? 'chevron-right' : 'chevron-down';
     },
     toggleText() {
       return this.collapsed
-        ? `${this.replies.length} ${n__('reply', 'replies', this.replies.length)}`
+        ? n__('%d reply', '%d replies', this.replies.length)
         : __('Collapse replies');
     },
+    toggleTextColor() {
+      return this.collapsed ? 'gl-text-blue-500' : 'gl-text-gray-900';
+    },
+    authors() {
+      return [...new Set(this.replies.map((item) => item.author))];
+    },
+    authorCollapsedTooltip() {
+      if (this.authors.length > 2) {
+        return n__('%d reply', '%d replies', this.authors.length);
+      }
+      return '';
+    },
   },
 };
 </script>
 
 <template>
   <li
-    class="toggle-comments gl-bg-gray-50 gl-display-flex gl-align-items-center gl-py-3 gl-min-h-8"
+    class="toggle-comments gl-bg-gray-10 gl-display-flex gl-align-items-center gl-p-3 gl-min-h-8 gl-rounded-bottom-left-base gl-rounded-bottom-right-base"
     :class="{ expanded: !collapsed }"
     data-testid="toggle-comments-wrapper"
   >
-    <gl-icon :name="iconName" class="gl-ml-3" @click.stop="$emit('toggle')" />
     <gl-button
-      variant="link"
-      class="toggle-comments-button gl-ml-2 gl-mr-2 gl-font-sm!"
-      @click.stop="$emit('toggle')"
-    >
-      {{ toggleText }}
-    </gl-button>
+      category="tertiary"
+      data-testid="toggle-replies-button"
+      class="gl-my-2 gl-mr-3 gl-p-0!"
+      :icon="iconName"
+      @click="$emit('toggle')"
+    />
     <template v-if="collapsed">
-      <span class="gl-text-gray-500 gl-font-sm">{{ __('Last reply by') }}</span>
-      <gl-link
-        :href="lastReply.author.webUrl"
-        target="_blank"
-        class="link-inherit-color gl-text-body gl-text-decoration-none gl-font-weight-bold gl-font-sm gl-ml-2 gl-mr-2"
+      <gl-avatars-inline
+        v-if="authors.length"
+        :avatars="authors"
+        collapsed
+        :max-visible="2"
+        :avatar-size="24"
+        badge-tooltip-prop="name"
+        :badge-sr-only-text="authorCollapsedTooltip"
+        class="gl-white-space-nowrap gl-mr-3"
       >
-        {{ lastReply.author.name }}
-      </gl-link>
-      <time-ago-tooltip
-        :time="lastReply.createdAt"
-        tooltip-placement="bottom"
-        class="gl-text-gray-500 gl-font-sm"
-      />
+        <template #avatar="{ avatar }">
+          <gl-avatar-link v-gl-tooltip :href="avatar.webUrl" :title="avatar.name">
+            <gl-avatar :alt="avatar.name" :src="avatar.avatarUrl" :size="24" />
+          </gl-avatar-link>
+        </template>
+      </gl-avatars-inline>
     </template>
+    <gl-button
+      variant="link"
+      data-testid="replies-button"
+      class="toggle-comments-button"
+      @click="$emit('toggle')"
+    >
+      <span :class="toggleTextColor">{{ toggleText }}</span>
+    </gl-button>
   </li>
 </template>

app/assets/javascripts/design_management/components/design_sidebar.vue

@@ -11,7 +11,6 @@ import { extractDiscussions, extractParticipants } from '../utils/design_managem
 import DesignDiscussion from './design_notes/design_discussion.vue';
 import DescriptionForm from './design_description/description_form.vue';
 import DesignNoteSignedOut from './design_notes/design_note_signed_out.vue';
-import DesignTodoButton from './design_todo_button.vue';
 import DesignDisclosure from './design_disclosure.vue';
 
 export default {
@@ -22,7 +21,6 @@ export default {
     GlAccordion,
     GlAccordionItem,
     GlSkeletonLoader,
-    DesignTodoButton,
     DescriptionForm,
     DesignDisclosure,
   },
@@ -139,13 +137,7 @@ export default {
   <design-disclosure :open="true">
     <template #default>
       <div class="image-notes gl-h-full gl-pt-0" @click.self="handleSidebarClick">
-        <div
-          class="gl-py-4 gl-mb-4 gl-display-flex gl-justify-content-space-between gl-align-items-center gl-border-b-1 gl-border-b-solid gl-border-b-gray-100"
-        >
-          <span>{{ __('To Do') }}</span>
-          <design-todo-button :design="design" @error="$emit('todoError', $event)" />
-        </div>
-        <h2 class="gl-font-weight-bold gl-mt-0">
+        <h2 class="gl-font-weight-bold gl-mt-4">
           {{ issue.title }}
         </h2>
         <a

app/assets/javascripts/design_management/components/design_todo_button.vue

 <script>
+import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import todoMarkDoneMutation from '~/graphql_shared/mutations/todo_mark_done.mutation.graphql';
 import TodoButton from '~/sidebar/components/todo_toggle/todo_button.vue';
+import { todoLabel } from '~/sidebar/utils';
 import createDesignTodoMutation from '../graphql/mutations/create_design_todo.mutation.graphql';
 import getDesignQuery from '../graphql/queries/get_design.query.graphql';
 import allVersionsMixin from '../mixins/all_versions';
@@ -11,6 +13,10 @@ import { CREATE_DESIGN_TODO_ERROR, DELETE_DESIGN_TODO_ERROR } from '../utils/err
 export default {
   components: {
     TodoButton,
+    GlIcon,
+  },
+  directives: {
+    GlTooltip: GlTooltipDirective,
   },
   mixins: [allVersionsMixin],
   inject: {
@@ -58,6 +64,12 @@ export default {
     hasPendingTodo() {
       return Boolean(this.pendingTodo);
     },
+    buttonIcon() {
+      return this.pendingTodo ? 'todo-done' : 'todo-add';
+    },
+    tooltipLabel() {
+      return todoLabel(this.hasPendingTodo);
+    },
   },
   methods: {
     createTodo() {
@@ -132,10 +144,14 @@ export default {
 
 <template>
   <todo-button
+    v-gl-tooltip
+    :title="tooltipLabel"
     issuable-type="design"
     :issuable-id="design.iid"
     :is-todo="hasPendingTodo"
     :loading="todoLoading"
     @click.stop.prevent="toggleTodo"
-  />
+  >
+    <gl-icon :class="{ 'gl-fill-blue-500': pendingTodo }" :name="buttonIcon" />
+  </todo-button>
 </template>

app/assets/javascripts/design_management/components/toolbar/index.vue

@@ -6,6 +6,7 @@ import { __, s__, sprintf } from '~/locale';
 import timeagoMixin from '~/vue_shared/mixins/timeago';
 import { DESIGNS_ROUTE_NAME } from '../../router/constants';
 import DeleteButton from '../delete_button.vue';
+import DesignTodoButton from '../design_todo_button.vue';
 import DesignNavigation from './design_navigation.vue';
 
 export default {
@@ -18,6 +19,7 @@ export default {
     GlSkeletonLoader,
     DesignNavigation,
     DeleteButton,
+    DesignTodoButton,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -68,6 +70,10 @@ export default {
       type: Boolean,
       required: true,
     },
+    design: {
+      type: Object,
+      required: true,
+    },
   },
   data() {
     return {
@@ -115,6 +121,7 @@ export default {
       </div>
     </div>
     <design-navigation :id="id" class="gl-ml-auto gl-flex-shrink-0" />
+    <design-todo-button :design="design" class="gl-mr-3" @error="$emit('todoError', $event)" />
     <gl-button
       v-gl-tooltip.bottom
       :href="image"

app/assets/javascripts/design_management/pages/design/index.vue

@@ -350,6 +350,7 @@ export default {
             :is-deleting="loading"
             :is-latest-version="isLatestVersion"
             :is-loading="isLoading"
+            :design="design"
             v-bind="design"
             @delete="mutate"
           />

app/assets/javascripts/diffs/components/commit_item.vue

@@ -173,7 +173,7 @@ export default {
         v-if="commit.description_html"
         v-safe-html:[$options.safeHtmlConfig]="commitDescription"
         :class="{ 'js-toggle-content': collapsible, 'd-block': !collapsible }"
-        class="commit-row-description gl-mb-3 gl-text-body gl-white-space-pre-line"
+        class="commit-row-description gl-mb-3 gl-text-body gl-white-space-pre-wrap"
       ></pre>
     </div>
   </li>

app/assets/javascripts/editor/schema/ci.json

@@ -1540,6 +1540,24 @@
                   }
                 }
               ]
+            },
+            "exit_codes": {
+              "markdownDescription": "Either a single or array of exit codes to trigger job retry on. [Learn More](https://docs.gitlab.com/ee/ci/yaml/#retryexit_codes).",
+              "oneOf": [
+                {
+                  "description": "Retry when the job exit code is included in the array's values.",
+                  "type": "array",
+                  "minItems": 1,
+                  "uniqueItems": true,
+                  "items": {
+                    "type": "integer"
+                  }
+                },
+                {
+                  "description": "Retry when the job exit code is equal to.",
+                  "type": "integer"
+                }
+              ]
             }
           }
         }

app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_overview.vue

 <script>
-import { GlLoadingIcon, GlEmptyState, GlSprintf, GlLink, GlAlert } from '@gitlab/ui';
+import { GlEmptyState, GlSprintf, GlLink, GlAlert } from '@gitlab/ui';
 import CLUSTER_EMPTY_SVG from '@gitlab/svgs/dist/illustrations/empty-state/empty-state-clusters.svg?url';
 import { s__ } from '~/locale';
 import { helpPagePath } from '~/helpers/help_page_helper';
 import { getIdFromGraphQLId } from '~/graphql_shared/utils';
 import { createK8sAccessConfiguration } from '~/environments/helpers/k8s_integration_helper';
 import { CLUSTER_HEALTH_SUCCESS, CLUSTER_HEALTH_ERROR } from '~/environments/constants';
-import environmentClusterAgentQuery from '~/environments/graphql/queries/environment_cluster_agent.query.graphql';
 import KubernetesStatusBar from './kubernetes_status_bar.vue';
 import KubernetesAgentInfo from './kubernetes_agent_info.vue';
 import KubernetesTabs from './kubernetes_tabs.vue';
 
 export default {
   components: {
-    GlLoadingIcon,
     GlEmptyState,
     KubernetesStatusBar,
     KubernetesAgentInfo,
@@ -24,29 +22,27 @@ export default {
   },
   inject: ['kasTunnelUrl'],
   props: {
-    projectFullPath: {
+    environmentName: {
       type: String,
       required: true,
     },
-    environmentName: {
+    clusterAgent: {
+      type: Object,
+      required: false,
+      default: null,
+    },
+    kubernetesNamespace: {
       type: String,
-      required: true,
+      required: false,
+      default: '',
     },
-  },
-  apollo: {
-    environment: {
-      query: environmentClusterAgentQuery,
-      variables() {
-        return {
-          projectFullPath: this.projectFullPath,
-          environmentName: this.environmentName,
-        };
-      },
-      update(data) {
-        return data?.project?.environment;
-      },
+    fluxResourcePath: {
+      type: String,
+      required: false,
+      default: '',
     },
   },
+
   data() {
     return {
       error: null,
@@ -55,18 +51,6 @@ export default {
     };
   },
   computed: {
-    isLoading() {
-      return this.$apollo.queries.environment.loading;
-    },
-    clusterAgent() {
-      return this.environment?.clusterAgent;
-    },
-    kubernetesNamespace() {
-      return this.environment?.kubernetesNamespace || '';
-    },
-    fluxResourcePath() {
-      return this.environment?.fluxResourcePath || '';
-    },
     gitlabAgentId() {
       return getIdFromGraphQLId(this.clusterAgent.id).toString();
     },
@@ -110,8 +94,7 @@ export default {
 };
 </script>
 <template>
-  <gl-loading-icon v-if="isLoading" />
-  <div v-else-if="clusterAgent" class="gl-p-5 gl-bg-gray-10 gl-mt-n3">
+  <div v-if="clusterAgent" class="gl-p-5 gl-bg-gray-10 gl-mt-n3">
     <div
       class="gl-display-flex gl-flex-wrap gl-justify-content-space-between gl-align-items-center"
     >

app/assets/javascripts/environments/environment_details/index.vue

 <!-- eslint-disable vue/multi-word-component-names -->
 <script>
-import { GlTabs, GlTab } from '@gitlab/ui';
+import { GlLoadingIcon, GlTabs, GlTab } from '@gitlab/ui';
 import { s__ } from '~/locale';
+import { getParameterValues, setUrlParams, updateHistory } from '~/lib/utils/url_utility';
+import environmentClusterAgentQuery from '~/environments/graphql/queries/environment_cluster_agent.query.graphql';
 import DeploymentHistory from './components/deployment_history.vue';
 import KubernetesOverview from './components/kubernetes/kubernetes_overview.vue';
 
 export default {
   components: {
+    GlLoadingIcon,
     GlTabs,
     GlTab,
     DeploymentHistory,
@@ -32,11 +35,39 @@ export default {
       default: null,
     },
   },
+  apollo: {
+    environment: {
+      query: environmentClusterAgentQuery,
+      variables() {
+        return {
+          projectFullPath: this.projectFullPath,
+          environmentName: this.environmentName,
+        };
+      },
+      update(data) {
+        return data?.project?.environment;
+      },
+      result() {
+        this.updateCurrentTab();
+      },
+    },
+  },
   data() {
     return {
       currentTabIndex: 0,
     };
   },
+  computed: {
+    isLoading() {
+      return this.$apollo.queries.environment.loading;
+    },
+    kubernetesNamespace() {
+      return this.environment?.kubernetesNamespace || '';
+    },
+    fluxResourcePath() {
+      return this.environment?.fluxResourcePath || '';
+    },
+  },
   i18n: {
     deploymentHistory: s__('Environments|Deployment history'),
     kubernetesOverview: s__('Environments|Kubernetes overview'),
@@ -49,19 +80,36 @@ export default {
     linkClass(index) {
       return index === this.currentTabIndex ? 'gl-inset-border-b-2-theme-accent' : '';
     },
+    updateCurrentTab() {
+      const hasKubernetesIntegration = this.environment?.clusterAgent;
+      const selectedTabFromUrl = getParameterValues('tab');
+
+      // Note: We want to open the deployments history tab when
+      // the Kubernetes integration is not set for the environment and
+      // neither tab is preselected via URL param.
+      if (!hasKubernetesIntegration && !selectedTabFromUrl.length) {
+        updateHistory({
+          url: setUrlParams({ tab: this.$options.params.deployments }),
+          replace: true,
+        });
+      }
+    },
   },
 };
 </script>
 <template>
-  <gl-tabs v-model="currentTabIndex" sync-active-tab-with-query-params>
+  <gl-loading-icon v-if="isLoading" />
+  <gl-tabs v-else v-model="currentTabIndex" sync-active-tab-with-query-params>
     <gl-tab
       :title="$options.i18n.kubernetesOverview"
       :query-param-value="$options.params.kubernetes"
       :title-link-class="linkClass(0)"
     >
       <kubernetes-overview
-        :project-full-path="projectFullPath"
         :environment-name="environmentName"
+        :cluster-agent="environment.clusterAgent"
+        :kubernetes-namespace="kubernetesNamespace"
+        :flux-resource-path="fluxResourcePath"
       />
     </gl-tab>
 

app/assets/javascripts/error_tracking/components/error_tracking_list.vue

@@ -493,11 +493,7 @@ export default {
     </div>
     <!-- Get Started with ET -->
     <div v-else>
-      <gl-empty-state
-        :title="__('Get started with error tracking')"
-        :svg-path="illustrationPath"
-        :svg-height="null"
-      >
+      <gl-empty-state :title="__('Get started with error tracking')" :svg-path="illustrationPath">
         <template #description>
           <div>
             <span>{{ __('Monitor your errors directly in GitLab.') }}</span>

app/assets/javascripts/forks/init_forks_button.js

-import Vue from 'vue';
-import { parseBoolean } from '~/lib/utils/common_utils';
-import ForksButton from './components/forks_button.vue';
-
-const initForksButton = () => {
-  const el = document.getElementById('js-forks-button');
-
-  if (!el) {
-    return false;
-  }
-
-  const {
-    forksCount,
-    projectFullPath,
-    projectForksUrl,
-    userForkUrl,
-    newForkUrl,
-    canReadCode,
-    canCreateFork,
-    canForkProject,
-  } = el.dataset;
-
-  return new Vue({
-    el,
-    provide: {
-      forksCount,
-      projectFullPath,
-      projectForksUrl,
-      userForkUrl,
-      newForkUrl,
-      canReadCode: parseBoolean(canReadCode),
-      canCreateFork: parseBoolean(canCreateFork),
-      canForkProject: parseBoolean(canForkProject),
-    },
-    render(createElement) {
-      return createElement(ForksButton);
-    },
-  });
-};
-
-export default initForksButton;

app/assets/javascripts/gfm_auto_complete.js

@@ -277,8 +277,6 @@ class GfmAutoComplete {
 
   // eslint-disable-next-line class-methods-use-this
   setSubmitReviewStates($input) {
-    if (!window.gon.features?.mrRequestChanges) return;
-
     const REVIEW_STATES = {
       reviewed: {
         header: __('Comment'),

app/assets/javascripts/graphql_shared/possible_types.json

@@ -58,6 +58,9 @@
   "GoogleCloudArtifactRegistryArtifact": [
     "GoogleCloudArtifactRegistryDockerImage"
   ],
+  "GoogleCloudArtifactRegistryArtifactDetails": [
+    "GoogleCloudArtifactRegistryDockerImageDetails"
+  ],
   "GoogleCloudLoggingConfigurationInterface": [
     "GoogleCloudLoggingConfigurationType",
     "InstanceGoogleCloudLoggingConfigurationType"