Add latest changes from gitlab-org/gitlab@14-1-stable-eev14.1.0-rc42

2 files changed, 34 insertions, 2 deletions

diff --git a/app/assets/javascripts/milestones/components/milestone_combobox.vue b/app/assets/javascripts/milestones/components/milestone_combobox.vue
index 1db2d10db20..e8499015210 100644
--- a/app/assets/javascripts/milestones/components/milestone_combobox.vue
+++ b/app/assets/javascripts/milestones/components/milestone_combobox.vue
@@ -171,7 +171,7 @@ export default {
 
 <template>
   <gl-dropdown v-bind="$attrs" class="milestone-combobox" @shown="focusSearchBox">
-    <template slot="button-content">
+    <template #button-content>
       <span data-testid="milestone-combobox-button-content" class="gl-flex-grow-1 text-muted">{{
         selectedMilestonesLabel
       }}</span>
@@ -202,7 +202,7 @@ export default {
     <gl-dropdown-divider />
 
     <template v-if="isLoading">
-      <gl-loading-icon />
+      <gl-loading-icon size="sm" />
       <gl-dropdown-divider />
     </template>
     <template v-else-if="showNoResults">
diff --git a/app/assets/javascripts/milestones/milestone_utils.js b/app/assets/javascripts/milestones/milestone_utils.js
new file mode 100644
index 00000000000..3ae5e676138
--- /dev/null
+++ b/app/assets/javascripts/milestones/milestone_utils.js
@@ -0,0 +1,32 @@
+import { parsePikadayDate } from '~/lib/utils/datetime_utility';
+
+/**
+ * This method is to be used with `Array.prototype.sort` function
+ * where array contains milestones with `due_date`/`dueDate` and/or
+ * `expired` properties.
+ * This method sorts given milestone params based on their expiration
+ * status by putting expired milestones at the bottom and upcoming
+ * milestones at the top of the list.
+ *
+ * @param {object} milestoneA
+ * @param {object} milestoneB
+ */
+export function sortMilestonesByDueDate(milestoneA, milestoneB) {
+  const rawDueDateA = milestoneA.due_date || milestoneA.dueDate;
+  const rawDueDateB = milestoneB.due_date || milestoneB.dueDate;
+  const dueDateA = rawDueDateA ? parsePikadayDate(rawDueDateA) : null;
+  const dueDateB = rawDueDateB ? parsePikadayDate(rawDueDateB) : null;
+  const expiredA = milestoneA.expired || Date.now() > dueDateA?.getTime();
+  const expiredB = milestoneB.expired || Date.now() > dueDateB?.getTime();
+
+  // Move all expired milestones to the bottom.
+  if (expiredA) return 1;
+  if (expiredB) return -1;
+
+  // Move milestones without due dates just above expired milestones.
+  if (!dueDateA) return 1;
+  if (!dueDateB) return -1;
+
+  // Sort by due date in ascending order.
+  return dueDateA - dueDateB;
+}