Revert "Merge branch '196066-add-milestone-expired-info' into 'master'"

This reverts merge request !35595

app/assets/javascripts/api.js

@@ -9,7 +9,6 @@ const Api = {
   groupsPath: '/api/:version/groups.json',
   groupPath: '/api/:version/groups/:id',
   groupMembersPath: '/api/:version/groups/:id/members',
-  groupMilestonesPath: '/api/:version/groups/:id/milestones',
   subgroupsPath: '/api/:version/groups/:id/subgroups',
   namespacesPath: '/api/:version/namespaces.json',
   groupProjectsPath: '/api/:version/groups/:id/projects.json',
@@ -101,14 +100,6 @@ const Api = {
     return axios.get(url).then(({ data }) => data);
   },
 
-  groupMilestones(groupId, params = {}) {
-    const url = Api.buildUrl(Api.groupMilestonesPath).replace(':id', encodeURIComponent(groupId));
-
-    return axios.get(url, {
-      params,
-    });
-  },
-
   // Return namespaces list. Filtered by query
   namespaces(query, callback) {
     const url = Api.buildUrl(Api.namespacesPath);
@@ -273,12 +264,10 @@ const Api = {
     });
   },
 
-  projectMilestones(id, params = {}) {
+  projectMilestones(id) {
     const url = Api.buildUrl(Api.projectMilestonesPath).replace(':id', encodeURIComponent(id));
 
-    return axios.get(url, {
-      params,
-    });
+    return axios.get(url);
   },
 
   mergeRequests(params = {}) {

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

@@ -25,6 +25,10 @@ export default {
       type: Boolean,
       required: true,
     },
+    milestonePath: {
+      type: String,
+      required: true,
+    },
     labelsPath: {
       type: String,
       required: true,
@@ -197,6 +201,7 @@ export default {
           :collapse-scope="isNewForm"
           :board="board"
           :can-admin-board="canAdminBoard"
+          :milestone-path="milestonePath"
           :labels-path="labelsPath"
           :enable-scoped-labels="enableScopedLabels"
           :project-id="projectId"

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

@@ -36,6 +36,10 @@ export default {
       type: Object,
       required: true,
     },
+    milestonePath: {
+      type: String,
+      required: true,
+    },
     throttleDuration: {
       type: Number,
       default: 200,
@@ -331,6 +335,7 @@ export default {
 
       <board-form
         v-if="currentPage"
+        :milestone-path="milestonePath"
         :labels-path="labelsPath"
         :project-id="projectId"
         :group-id="groupId"

app/assets/javascripts/boards/components/modal/header.vue

@@ -17,6 +17,10 @@ export default {
       type: Number,
       required: true,
     },
+    milestonePath: {
+      type: String,
+      required: true,
+    },
     labelPath: {
       type: String,
       required: true,

app/assets/javascripts/boards/components/modal/index.vue

@@ -38,6 +38,10 @@ export default {
       type: Number,
       required: true,
     },
+    milestonePath: {
+      type: String,
+      required: true,
+    },
     labelPath: {
       type: String,
       required: true,
@@ -145,7 +149,11 @@ export default {
     class="add-issues-modal d-flex position-fixed position-top-0 position-bottom-0 position-left-0 position-right-0 h-100"
   >
     <div class="add-issues-container d-flex flex-column m-auto rounded">
-      <modal-header :project-id="projectId" :label-path="labelPath" />
+      <modal-header
+        :project-id="projectId"
+        :milestone-path="milestonePath"
+        :label-path="labelPath"
+      />
       <modal-list
         v-if="!loading && showList && !filterLoading"
         :issue-link-base="issueLinkBase"

app/assets/javascripts/boards/mount_multiple_boards_switcher.js

@@ -27,7 +27,7 @@ export default () => {
         hasMissingBoards: parseBoolean(dataset.hasMissingBoards),
         canAdminBoard: parseBoolean(dataset.canAdminBoard),
         multipleIssueBoardsAvailable: parseBoolean(dataset.multipleIssueBoardsAvailable),
-        projectId: dataset.projectId ? Number(dataset.projectId) : 0,
+        projectId: Number(dataset.projectId),
         groupId: Number(dataset.groupId),
         scopedIssueBoardFeatureEnabled: parseBoolean(dataset.scopedIssueBoardFeatureEnabled),
         weights: JSON.parse(dataset.weights),

app/assets/javascripts/milestone_select.js

@@ -4,11 +4,10 @@
 
 import $ from 'jquery';
 import { template, escape } from 'lodash';
-import { __, sprintf } from '~/locale';
+import { __ } from '~/locale';
 import '~/gl_dropdown';
-import Api from '~/api';
 import axios from './lib/utils/axios_utils';
-import { timeFor, parsePikadayDate, dateInWords } from './lib/utils/datetime_utility';
+import { timeFor } from './lib/utils/datetime_utility';
 import ModalStore from './boards/stores/modal_store';
 import boardsStore, {
   boardStoreIssueSet,
@@ -35,10 +34,10 @@ export default class MilestoneSelect {
     $els.each((i, dropdown) => {
       let milestoneLinkNoneTemplate,
         milestoneLinkTemplate,
-        milestoneExpiredLinkTemplate,
         selectedMilestone,
         selectedMilestoneDefault;
       const $dropdown = $(dropdown);
+      const milestonesUrl = $dropdown.data('milestones');
       const issueUpdateURL = $dropdown.data('issueUpdate');
       const showNo = $dropdown.data('showNo');
       const showAny = $dropdown.data('showAny');
@@ -64,101 +63,58 @@ export default class MilestoneSelect {
         milestoneLinkTemplate = template(
           '<a href="<%- web_url %>" class="bold has-tooltip" data-container="body" title="<%- remaining %>"><%- title %></a>',
         );
-        milestoneExpiredLinkTemplate = template(
-          '<a href="<%- web_url %>" class="bold has-tooltip" data-container="body" title="<%- remaining %>"><%- title %> (Past due)</a>',
-        );
         milestoneLinkNoneTemplate = `<span class="no-value">${__('None')}</span>`;
       }
       return $dropdown.glDropdown({
         showMenuAbove,
-        data: (term, callback) => {
-          let contextId = $dropdown.get(0).dataset.projectId;
-          let getMilestones = Api.projectMilestones;
-
-          if (!contextId) {
-            contextId = $dropdown.get(0).dataset.groupId;
-            getMilestones = Api.groupMilestones;
-          }
-
-          // We don't use $.data() as it caches initial value and never updates!
-          return getMilestones(contextId, { state: 'active' })
-            .then(({ data }) =>
-              data
-                .map(m => ({
-                  ...m,
-                  // Public API includes `title` instead of `name`.
-                  name: m.title,
-                }))
-                .sort((mA, mB) => {
-                  // Move all expired milestones to the bottom.
-                  if (mA.expired) {
-                    return 1;
-                  }
-                  if (mB.expired) {
-                    return -1;
-                  }
-                  return 0;
-                }),
-            )
-            .then(data => {
-              const extraOptions = [];
-              if (showAny) {
-                extraOptions.push({
-                  id: null,
-                  name: null,
-                  title: __('Any milestone'),
-                });
-              }
-              if (showNo) {
-                extraOptions.push({
-                  id: -1,
-                  name: __('No milestone'),
-                  title: __('No milestone'),
-                });
-              }
-              if (showUpcoming) {
-                extraOptions.push({
-                  id: -2,
-                  name: '#upcoming',
-                  title: __('Upcoming'),
-                });
-              }
-              if (showStarted) {
-                extraOptions.push({
-                  id: -3,
-                  name: '#started',
-                  title: __('Started'),
-                });
-              }
-              if (extraOptions.length) {
-                extraOptions.push({ type: 'divider' });
-              }
-
-              callback(extraOptions.concat(data));
-              if (showMenuAbove) {
-                $dropdown.data('glDropdown').positionMenuAbove();
-              }
-              $(`[data-milestone-id="${selectedMilestone}"] > a`).addClass('is-active');
-            });
-        },
-        renderRow: milestone => {
-          const milestoneName = milestone.title || milestone.name;
-          let milestoneDisplayName = escape(milestoneName);
-
-          if (milestone.expired) {
-            milestoneDisplayName = sprintf(__('%{milestone} (expired)'), {
-              milestone: milestoneDisplayName,
-            });
-          }
+        data: (term, callback) =>
+          axios.get(milestonesUrl).then(({ data }) => {
+            const extraOptions = [];
+            if (showAny) {
+              extraOptions.push({
+                id: null,
+                name: null,
+                title: __('Any milestone'),
+              });
+            }
+            if (showNo) {
+              extraOptions.push({
+                id: -1,
+                name: __('No milestone'),
+                title: __('No milestone'),
+              });
+            }
+            if (showUpcoming) {
+              extraOptions.push({
+                id: -2,
+                name: '#upcoming',
+                title: __('Upcoming'),
+              });
+            }
+            if (showStarted) {
+              extraOptions.push({
+                id: -3,
+                name: '#started',
+                title: __('Started'),
+              });
+            }
+            if (extraOptions.length) {
+              extraOptions.push({ type: 'divider' });
+            }
 
-          return `
-          <li data-milestone-id="${escape(milestoneName)}">
+            callback(extraOptions.concat(data));
+            if (showMenuAbove) {
+              $dropdown.data('glDropdown').positionMenuAbove();
+            }
+            $(`[data-milestone-id="${escape(selectedMilestone)}"] > a`).addClass('is-active');
+          }),
+        renderRow: milestone => `
+          <li data-milestone-id="${escape(milestone.name)}">
             <a href='#' class='dropdown-menu-milestone-link'>
-              ${milestoneDisplayName}
+              ${escape(milestone.title)}
             </a>
           </li>
-        `;
-        },
+        `,
         filterable: true,
         search: {
           fields: ['title'],
@@ -193,7 +149,7 @@ export default class MilestoneSelect {
             selectedMilestone = $dropdown[0].dataset.selected || selectedMilestoneDefault;
           }
           $('a.is-active', $el).removeClass('is-active');
-          $(`[data-milestone-id="${selectedMilestone}"] > a`, $el).addClass('is-active');
+          $(`[data-milestone-id="${escape(selectedMilestone)}"] > a`, $el).addClass('is-active');
         },
         vue: $dropdown.hasClass('js-issue-board-sidebar'),
         clicked: clickEvent => {
@@ -281,16 +237,7 @@ export default class MilestoneSelect {
                 if (data.milestone != null) {
                   data.milestone.remaining = timeFor(data.milestone.due_date);
                   data.milestone.name = data.milestone.title;
-                  $value.html(
-                    data.milestone.expired
-                      ? milestoneExpiredLinkTemplate({
-                          ...data.milestone,
-                          remaining: sprintf(__('%{due_date} (Past due)'), {
-                            due_date: dateInWords(parsePikadayDate(data.milestone.due_date)),
-                          }),
-                        })
-                      : milestoneLinkTemplate(data.milestone),
-                  );
+                  $value.html(milestoneLinkTemplate(data.milestone));
                   return $sidebarCollapsedValue
                     .attr(
                       'data-original-title',

app/views/shared/boards/components/sidebar/_milestone.html.haml

@@ -18,8 +18,7 @@
       .dropdown
         %button.dropdown-menu-toggle.js-milestone-select.js-issue-board-sidebar{ type: "button", data: { toggle: "dropdown", show_no: "true", field_name: "issue[milestone_id]", milestones: milestones_filter_path(format: :json), ability_name: "issue", use_id: "true", default_no: "true" },
           ":data-selected" => "milestoneTitle",
-          ":data-issuable-id" => "issue.iid",
-          ":data-project-id" => "issue.project_id" }
+          ":data-issuable-id" => "issue.iid" }
           = _("Milestone")
           = icon("chevron-down")
         .dropdown-menu.dropdown-select.dropdown-menu-selectable

app/views/shared/issuable/_sidebar.html.haml

@@ -45,8 +45,7 @@
               = link_to _('Edit'), '#', class: 'js-sidebar-dropdown-toggle edit-link float-right', data: { qa_selector: "edit_milestone_link", track_label: "right_sidebar", track_property: "milestone", track_event: "click_edit_button", track_value: "" }
           .value.hide-collapsed
             - if milestone.present?
-              - milestone_title = milestone[:expired] ? _("%{milestone_name} (Past due)").html_safe % { milestone_name: milestone[:title] } : milestone[:title]
-              = link_to milestone_title, milestone[:web_url], class: "bold has-tooltip", title: sidebar_milestone_remaining_days(milestone), data: { container: "body", html: 'true', boundary: 'viewport', qa_selector: 'milestone_link', qa_title: milestone[:title] }
+              = link_to milestone[:title], milestone[:web_url], class: "bold has-tooltip", title: sidebar_milestone_remaining_days(milestone), data: { container: "body", html: 'true', boundary: 'viewport', qa_selector: 'milestone_link', qa_title: milestone[:title] }
             - else
               %span.no-value
                 = _('None')

changelogs/unreleased/196066-add-milestone-expired-info.yml

----
-title: Show expired milestones at the bottom of the list within dropdown
-merge_request: 35595
-author:
-type: changed

doc/api/group_milestones.md

@@ -54,7 +54,6 @@ Example Response:
     "state": "active",
     "updated_at": "2013-10-02T09:24:18Z",
     "created_at": "2013-10-02T09:24:18Z",
-    "expired": false,
     "web_url": "https://gitlab.com/groups/gitlab-org/-/milestones/42"
   }
 ]

doc/api/milestones.md

@@ -51,8 +51,7 @@ Example Response:
     "start_date": "2013-11-10",
     "state": "active",
     "updated_at": "2013-10-02T09:24:18Z",
-    "created_at": "2013-10-02T09:24:18Z",
-    "expired": false
+    "created_at": "2013-10-02T09:24:18Z"
   }
 ]
 ```

ee/app/assets/javascripts/boards/components/board_scope.vue

@@ -27,6 +27,10 @@ export default {
       type: Object,
       required: true,
     },
+    milestonePath: {
+      type: String,
+      required: true,
+    },
     labelsPath: {
       type: String,
       required: true,
@@ -102,8 +106,7 @@ export default {
     <div v-if="!collapseScope || expanded">
       <board-milestone-select
         :board="board"
-        :group-id="groupId"
-        :project-id="projectId"
+        :milestone-path="milestonePath"
         :can-edit="canAdminBoard"
       />
 

ee/app/assets/javascripts/boards/components/milestone_select.vue

@@ -15,15 +15,9 @@ export default {
       type: Object,
       required: true,
     },
-    groupId: {
-      type: Number,
-      required: false,
-      default: 0,
-    },
-    projectId: {
-      type: Number,
-      required: false,
-      default: 0,
+    milestonePath: {
+      type: String,
+      required: true,
     },
     canEdit: {
       type: Boolean,
@@ -90,8 +84,7 @@ export default {
         <button
           ref="dropdownButton"
           :data-selected="selected"
-          :data-project-id="projectId"
-          :data-group-id="groupId"
+          :data-milestones="milestonePath"
           :data-show-no="true"
           :data-show-any="true"
           :data-show-started="true"

ee/spec/fixtures/api/schemas/entities/milestone.json

 {
   "type": "object",
-  "properties": {
+  "properties" : {
     "id": { "type": "integer" },
     "iid": { "type": "integer" },
     "project_id": { "type": ["integer", "null"] },
@@ -12,7 +12,6 @@
     "updated_at": { "type": "string" },
     "start_date": { "type": ["date", "null"] },
     "due_date": { "type": ["date", "null"] },
-    "expired": { "type": ["boolean", "null"] },
     "web_url": { "type": "string" }
   },
   "additionalProperties": false

ee/spec/frontend/boards/components/board_scope_spec.js

@@ -14,6 +14,7 @@ describe('BoardScope', () => {
         labels: [],
         assignee: {},
       },
+      milestonePath: `${TEST_HOST}/milestones`,
       labelsPath: `${TEST_HOST}/labels`,
     };
 

ee/spec/frontend/boards/milestone_select_spec.js

 import Vue from 'vue';
-import Api from '~/api';
+import MockAdapater from 'axios-mock-adapter';
 import MilestoneSelect from 'ee/boards/components/milestone_select.vue';
 import { boardObj } from 'jest/boards/mock_data';
+import axios from '~/lib/utils/axios_utils';
 import IssuableContext from '~/issuable_context';
 
 let vm;
@@ -20,16 +21,12 @@ const milestone = {
   id: 1,
   title: 'first milestone',
   name: 'first milestone',
-  due_date: '2015-05-05',
-  expired: true,
 };
 
 const milestone2 = {
   id: 2,
   title: 'second milestone',
   name: 'second milestone',
-  due_date: null,
-  expired: false,
 };
 
 describe('Milestone select component', () => {
@@ -43,8 +40,7 @@ describe('Milestone select component', () => {
     vm = new Component({
       propsData: {
         board: boardObj,
-        groupId: 2,
-        projectId: 2,
+        milestonePath: '/test/issue-boards/milestones.json',
         canEdit: true,
       },
     }).$mount('.test-container');
@@ -96,8 +92,15 @@ describe('Milestone select component', () => {
     });
 
     describe('clicking dropdown items', () => {
+      let mock;
+
       beforeEach(() => {
-        jest.spyOn(Api, 'projectMilestones').mockResolvedValue({ data: [milestone, milestone2] });
+        mock = new MockAdapater(axios);
+        mock.onGet('/test/issue-boards/milestones.json').reply(200, [milestone, milestone2]);
+      });
+
+      afterEach(() => {
+        mock.restore();
       });
 
       it('sets Any milestone', async done => {
@@ -144,10 +147,9 @@ describe('Milestone select component', () => {
         });
 
         setImmediate(() => {
-          // "second milestone" is not expired, hence it shows up to the top.
-          expect(activeDropdownItem(0)).toBe('second milestone');
-          expect(selectedText()).toBe('second milestone');
-          expect(vm.board.milestone).toEqual(milestone2);
+          expect(activeDropdownItem(0)).toEqual('first milestone');
+          expect(selectedText()).toEqual('first milestone');
+          expect(vm.board.milestone).toEqual(milestone);
           done();
         });
       });

lib/api/entities/milestone.rb

@@ -10,7 +10,6 @@ module API
       expose :state, :created_at, :updated_at
       expose :due_date
       expose :start_date
-      expose :expired?, as: :expired
 
       expose :web_url do |milestone, _options|
         Gitlab::UrlBuilder.build(milestone)

locale/gitlab.pot

@@ -358,9 +358,6 @@ msgstr ""
 msgid "%{description}- Sentry event: %{errorUrl}- First seen: %{firstSeen}- Last seen: %{lastSeen} %{countLabel}: %{count}%{userCountLabel}: %{userCount}"
 msgstr ""
 
-msgid "%{due_date} (Past due)"
-msgstr ""
-
 msgid "%{duration}ms"
 msgstr ""
 
@@ -487,12 +484,6 @@ msgstr ""
 msgid "%{mergeLength}/%{usersLength} can merge"
 msgstr ""
 
-msgid "%{milestone_name} (Past due)"
-msgstr ""
-
-msgid "%{milestone} (expired)"
-msgstr ""
-
 msgid "%{mrText}, this issue will be closed automatically."
 msgstr ""
 

spec/fixtures/api/schemas/public_api/v4/milestone.json

@@ -12,13 +12,11 @@
     "updated_at": { "type": "date" },
     "start_date": { "type": "date" },
     "due_date": { "type": "date" },
-    "expired": { "type": ["boolean", "null"] },
     "web_url": { "type": "string" }
   },
   "required": [
     "id", "iid", "title", "description", "state",
-    "state", "created_at", "updated_at", "start_date",
-    "due_date", "expired"
+    "state", "created_at", "updated_at", "start_date", "due_date"
   ],
   "additionalProperties": false
 }

spec/fixtures/api/schemas/public_api/v4/milestone_with_stats.json

@@ -12,7 +12,6 @@
     "updated_at": { "type": "date" },
     "start_date": { "type": "date" },
     "due_date": { "type": "date" },
-    "expired": { "type": ["boolean", "null"] },
     "web_url": { "type": "string" },
     "issue_stats": {
       "required": ["total", "closed"],
@@ -25,8 +24,7 @@
   },
   "required": [
     "id", "iid", "title", "description", "state",
-    "state", "created_at", "updated_at", "start_date",
-    "due_date", "expired", "issue_stats"
+    "state", "created_at", "updated_at", "start_date", "due_date", "issue_stats"
   ],
   "additionalProperties": false
 }

spec/frontend/api_spec.js

@@ -96,29 +96,6 @@ describe('Api', () => {
     });
   });
 
-  describe('groupMilestones', () => {
-    it('fetches group milestones', done => {
-      const groupId = 1;
-      const options = { state: 'active' };
-      const expectedUrl = `${dummyUrlRoot}/api/${dummyApiVersion}/groups/1/milestones`;
-      mock.onGet(expectedUrl).reply(200, [
-        {
-          id: 1,
-          title: 'milestone1',
-          state: 'active',
-        },
-      ]);
-
-      Api.groupMilestones(groupId, options)
-        .then(({ data }) => {
-          expect(data.length).toBe(1);
-          expect(data[0].title).toBe('milestone1');
-        })
-        .then(done)
-        .catch(done.fail);
-    });
-  });
-
   describe('namespaces', () => {
     it('fetches namespaces', done => {
       const query = 'dummy query';
@@ -319,29 +296,6 @@ describe('Api', () => {
     });
   });
 
-  describe('projectMilestones', () => {
-    it('fetches project milestones', done => {
-      const projectId = 1;
-      const options = { state: 'active' };
-      const expectedUrl = `${dummyUrlRoot}/api/${dummyApiVersion}/projects/1/milestones`;
-      mock.onGet(expectedUrl).reply(200, [
-        {
-          id: 1,
-          title: 'milestone1',
-          state: 'active',
-        },
-      ]);
-
-      Api.projectMilestones(projectId, options)
-        .then(({ data }) => {
-          expect(data.length).toBe(1);
-          expect(data[0].title).toBe('milestone1');
-        })
-        .then(done)
-        .catch(done.fail);
-    });
-  });
-
   describe('newLabel', () => {
     it('creates a new label', done => {
       const namespace = 'some namespace';

spec/frontend/boards/components/board_form_spec.js

@@ -10,6 +10,7 @@ describe('board_form.vue', () => {
   const propsData = {
     canAdminBoard: false,
     labelsPath: `${gl.TEST_HOST}/labels/path`,
+    milestonePath: `${gl.TEST_HOST}/milestone/path`,
   };
 
   const findModal = () => wrapper.find(DeprecatedModal);

spec/frontend/boards/components/boards_selector_spec.js

@@ -81,6 +81,7 @@ describe('BoardsSelector', () => {
           assignee_id: null,
           labels: [],
         },
+        milestonePath: `${TEST_HOST}/milestone/path`,
         boardBaseUrl: `${TEST_HOST}/board/base/url`,
         hasMissingBoards: false,
         canAdminBoard: true,