From 9f46488805e86b1bc341ea1620b866016c2ce5ed Mon Sep 17 00:00:00 2001
From: GitLab Bot <gitlab-bot@gitlab.com>
Date: Wed, 20 May 2020 14:34:42 +0000
Subject: Add latest changes from gitlab-org/gitlab@13-0-stable-ee

---
 .../javascripts/releases/components/app_edit.vue   | 74 ++++++++++++++++------
 .../javascripts/releases/components/app_index.vue  | 11 ++--
 .../releases/components/asset_links_form.vue       |  2 +-
 .../releases/components/evidence_block.vue         |  8 ++-
 .../releases/components/release_block_footer.vue   |  7 +-
 .../releases/components/release_block_header.vue   | 13 ++--
 .../releases/components/release_block_metadata.vue | 15 +++--
 .../components/release_block_milestone_info.vue    | 12 ++--
 .../releases/stores/modules/detail/actions.js      | 11 +++-
 .../stores/modules/detail/mutation_types.js        |  1 +
 .../releases/stores/modules/detail/mutations.js    |  4 ++
 .../releases/stores/modules/detail/state.js        |  4 ++
 12 files changed, 115 insertions(+), 47 deletions(-)

(limited to 'app/assets/javascripts/releases')

diff --git a/app/assets/javascripts/releases/components/app_edit.vue b/app/assets/javascripts/releases/components/app_edit.vue
index 8d68ff02116..01dd0638023 100644
--- a/app/assets/javascripts/releases/components/app_edit.vue
+++ b/app/assets/javascripts/releases/components/app_edit.vue
@@ -1,7 +1,7 @@
 <script>
 import { mapState, mapActions, mapGetters } from 'vuex';
 import { GlButton, GlFormInput, GlFormGroup } from '@gitlab/ui';
-import { escape as esc } from 'lodash';
+import { escape } from 'lodash';
 import { __, sprintf } from '~/locale';
 import MarkdownField from '~/vue_shared/components/markdown/field.vue';
 import autofocusonshow from '~/vue_shared/directives/autofocusonshow';
@@ -9,6 +9,7 @@ import { BACK_URL_PARAM } from '~/releases/constants';
 import { getParameterByName } from '~/lib/utils/common_utils';
 import AssetLinksForm from './asset_links_form.vue';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
+import MilestoneCombobox from '~/milestones/project_milestone_combobox.vue';
 
 export default {
   name: 'ReleaseEditApp',
@@ -18,6 +19,7 @@ export default {
     GlButton,
     MarkdownField,
     AssetLinksForm,
+    MilestoneCombobox,
   },
   directives: {
     autofocusonshow,
@@ -32,6 +34,10 @@ export default {
       'markdownPreviewPath',
       'releasesPagePath',
       'updateReleaseApiDocsPath',
+      'release',
+      'newMilestonePath',
+      'manageMilestonesPath',
+      'projectId',
     ]),
     ...mapGetters('detail', ['isValid']),
     showForm() {
@@ -58,7 +64,7 @@ export default {
           'Changing a Release tag is only supported via Releases API. %{linkStart}More information%{linkEnd}',
         ),
         {
-          linkStart: `<a href="${esc(
+          linkStart: `<a href="${escape(
             this.updateReleaseApiDocsPath,
           )}" target="_blank" rel="noopener noreferrer">`,
           linkEnd: '</a>',
@@ -82,6 +88,14 @@ export default {
         this.updateReleaseNotes(notes);
       },
     },
+    releaseMilestones: {
+      get() {
+        return this.$store.state.detail.release.milestones;
+      },
+      set(milestones) {
+        this.updateReleaseMilestones(milestones);
+      },
+    },
     cancelPath() {
       return getParameterByName(BACK_URL_PARAM) || this.releasesPagePath;
     },
@@ -91,6 +105,18 @@ export default {
     isSaveChangesDisabled() {
       return this.isUpdatingRelease || !this.isValid;
     },
+    milestoneComboboxExtraLinks() {
+      return [
+        {
+          text: __('Create new'),
+          url: this.newMilestonePath,
+        },
+        {
+          text: __('Manage milestones'),
+          url: this.manageMilestonesPath,
+        },
+      ];
+    },
   },
   created() {
     this.fetchRelease();
@@ -101,6 +127,7 @@ export default {
       'updateRelease',
       'updateReleaseTitle',
       'updateReleaseNotes',
+      'updateReleaseMilestones',
     ]),
   },
 };
@@ -137,6 +164,16 @@ export default {
           class="form-control"
         />
       </gl-form-group>
+      <gl-form-group class="w-50">
+        <label>{{ __('Milestones') }}</label>
+        <div class="d-flex flex-column col-md-6 col-sm-10 pl-0">
+          <milestone-combobox
+            v-model="releaseMilestones"
+            :project-id="projectId"
+            :extra-links="milestoneComboboxExtraLinks"
+          />
+        </div>
+      </gl-form-group>
       <gl-form-group>
         <label for="release-notes">{{ __('Release notes') }}</label>
         <div class="bordered-box pr-3 pl-3">
@@ -147,19 +184,19 @@ export default {
             :add-spacing-classes="false"
             class="prepend-top-10 append-bottom-10"
           >
-            <textarea
-              id="release-notes"
-              slot="textarea"
-              v-model="releaseNotes"
-              class="note-textarea js-gfm-input js-autosize markdown-area"
-              dir="auto"
-              data-supports-quick-actions="false"
-              :aria-label="__('Release notes')"
-              :placeholder="__('Write your release notes or drag your files here…')"
-              @keydown.meta.enter="updateRelease()"
-              @keydown.ctrl.enter="updateRelease()"
-            >
-            </textarea>
+            <template #textarea>
+              <textarea
+                id="release-notes"
+                v-model="releaseNotes"
+                class="note-textarea js-gfm-input js-autosize markdown-area"
+                dir="auto"
+                data-supports-quick-actions="false"
+                :aria-label="__('Release notes')"
+                :placeholder="__('Write your release notes or drag your files here…')"
+                @keydown.meta.enter="updateRelease()"
+                @keydown.ctrl.enter="updateRelease()"
+              ></textarea>
+            </template>
           </markdown-field>
         </div>
       </gl-form-group>
@@ -174,12 +211,9 @@ export default {
           type="submit"
           :aria-label="__('Save changes')"
           :disabled="isSaveChangesDisabled"
+          >{{ __('Save changes') }}</gl-button
         >
-          {{ __('Save changes') }}
-        </gl-button>
-        <gl-button :href="cancelPath" class="js-cancel-button">
-          {{ __('Cancel') }}
-        </gl-button>
+        <gl-button :href="cancelPath" class="js-cancel-button">{{ __('Cancel') }}</gl-button>
       </div>
     </form>
   </div>
diff --git a/app/assets/javascripts/releases/components/app_index.vue b/app/assets/javascripts/releases/components/app_index.vue
index 215a376fc76..67085ecca2b 100644
--- a/app/assets/javascripts/releases/components/app_index.vue
+++ b/app/assets/javascripts/releases/components/app_index.vue
@@ -1,6 +1,6 @@
 <script>
 import { mapState, mapActions } from 'vuex';
-import { GlSkeletonLoading, GlEmptyState, GlLink } from '@gitlab/ui';
+import { GlSkeletonLoading, GlEmptyState, GlLink, GlButton } from '@gitlab/ui';
 import {
   getParameterByName,
   historyPushState,
@@ -18,6 +18,7 @@ export default {
     ReleaseBlock,
     TablePagination,
     GlLink,
+    GlButton,
   },
   props: {
     projectId: {
@@ -69,14 +70,16 @@ export default {
 </script>
 <template>
   <div class="flex flex-column mt-2">
-    <gl-link
+    <gl-button
       v-if="newReleasePath"
       :href="newReleasePath"
       :aria-describedby="shouldRenderEmptyState && 'releases-description'"
-      class="btn btn-success align-self-end mb-2 js-new-release-btn"
+      category="primary"
+      variant="success"
+      class="align-self-end mb-2 js-new-release-btn"
     >
       {{ __('New release') }}
-    </gl-link>
+    </gl-button>
 
     <gl-skeleton-loading v-if="isLoading" class="js-loading" />
 
diff --git a/app/assets/javascripts/releases/components/asset_links_form.vue b/app/assets/javascripts/releases/components/asset_links_form.vue
index 4bdc88f01dd..0698ca5e31f 100644
--- a/app/assets/javascripts/releases/components/asset_links_form.vue
+++ b/app/assets/javascripts/releases/components/asset_links_form.vue
@@ -162,7 +162,7 @@ export default {
           :state="isNameValid(link)"
           @change="onLinkTitleInput(link.id, $event)"
         />
-        <template v-slot:invalid-feedback>
+        <template #invalid-feedback>
           <span v-if="hasEmptyName(link)" class="invalid-feedback d-inline">
             {{ __('Link title is required') }}
           </span>
diff --git a/app/assets/javascripts/releases/components/evidence_block.vue b/app/assets/javascripts/releases/components/evidence_block.vue
index 59c1b3eb48e..acae6fda533 100644
--- a/app/assets/javascripts/releases/components/evidence_block.vue
+++ b/app/assets/javascripts/releases/components/evidence_block.vue
@@ -76,11 +76,13 @@ export default {
         </gl-link>
 
         <expand-button>
-          <template slot="short">
+          <template #short>
             <span class="js-short monospace">{{ shortSha(index) }}</span>
           </template>
-          <template slot="expanded">
-            <span class="js-expanded monospace gl-pl-1">{{ sha(index) }}</span>
+          <template #expanded>
+            <span class="js-expanded monospace gl-pl-1-deprecated-no-really-do-not-use-me">{{
+              sha(index)
+            }}</span>
           </template>
         </expand-button>
         <clipboard-button
diff --git a/app/assets/javascripts/releases/components/release_block_footer.vue b/app/assets/javascripts/releases/components/release_block_footer.vue
index a95fbc0b373..26154272d39 100644
--- a/app/assets/javascripts/releases/components/release_block_footer.vue
+++ b/app/assets/javascripts/releases/components/release_block_footer.vue
@@ -57,6 +57,11 @@ export default {
         ? sprintf(__("%{username}'s avatar"), { username: this.author.username })
         : null;
     },
+    createdTime() {
+      const now = new Date();
+      const isFuture = now < new Date(this.releasedAt);
+      return isFuture ? __('Will be created') : __('Created');
+    },
   },
 };
 </script>
@@ -86,7 +91,7 @@ export default {
       v-if="releasedAt || author"
       class="float-left d-flex align-items-center js-author-date-info"
     >
-      <span class="text-secondary">{{ __('Created') }}&nbsp;</span>
+      <span class="text-secondary">{{ createdTime }}&nbsp;</span>
       <template v-if="releasedAt">
         <span
           v-gl-tooltip.bottom
diff --git a/app/assets/javascripts/releases/components/release_block_header.vue b/app/assets/javascripts/releases/components/release_block_header.vue
index 6f7e1dcfe2f..ed49841757a 100644
--- a/app/assets/javascripts/releases/components/release_block_header.vue
+++ b/app/assets/javascripts/releases/components/release_block_header.vue
@@ -1,5 +1,5 @@
 <script>
-import { GlTooltipDirective, GlLink, GlBadge } from '@gitlab/ui';
+import { GlTooltipDirective, GlLink, GlBadge, GlButton } from '@gitlab/ui';
 import Icon from '~/vue_shared/components/icon.vue';
 import { BACK_URL_PARAM } from '~/releases/constants';
 import { setUrlParams } from '~/lib/utils/url_utility';
@@ -10,6 +10,7 @@ export default {
     GlLink,
     GlBadge,
     Icon,
+    GlButton,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -41,7 +42,7 @@ export default {
 
 <template>
   <div class="card-header d-flex align-items-center bg-white pr-0">
-    <h2 class="card-title my-2 mr-auto gl-font-size-20">
+    <h2 class="card-title my-2 mr-auto gl-font-size-20-deprecated-no-really-do-not-use-me">
       <gl-link v-if="selfLink" :href="selfLink" class="font-size-inherit">
         {{ release.name }}
       </gl-link>
@@ -50,14 +51,16 @@ export default {
         __('Upcoming Release')
       }}</gl-badge>
     </h2>
-    <gl-link
+    <gl-button
       v-if="editLink"
       v-gl-tooltip
-      class="btn btn-default append-right-10 js-edit-button ml-2"
+      category="primary"
+      variant="default"
+      class="append-right-10 js-edit-button ml-2 pb-2"
       :title="__('Edit this release')"
       :href="editLink"
     >
       <icon name="pencil" />
-    </gl-link>
+    </gl-button>
   </div>
 </template>
diff --git a/app/assets/javascripts/releases/components/release_block_metadata.vue b/app/assets/javascripts/releases/components/release_block_metadata.vue
index 052e4088a5f..40133941011 100644
--- a/app/assets/javascripts/releases/components/release_block_metadata.vue
+++ b/app/assets/javascripts/releases/components/release_block_metadata.vue
@@ -38,9 +38,12 @@ export default {
       return Boolean(this.author);
     },
     releasedTimeAgo() {
-      return sprintf(__('released %{time}'), {
-        time: this.timeFormatted(this.release.releasedAt),
-      });
+      const now = new Date();
+      const isFuture = now < new Date(this.release.releasedAt);
+      const time = this.timeFormatted(this.release.releasedAt);
+      return isFuture
+        ? sprintf(__('will be released %{time}'), { time })
+        : sprintf(__('released %{time}'), { time });
     },
     shouldRenderMilestones() {
       return Boolean(this.release.milestones?.length);
@@ -74,7 +77,11 @@ export default {
 
     <div class="append-right-4">
       &bull;
-      <span v-gl-tooltip.bottom :title="tooltipTitle(release.releasedAt)">
+      <span
+        v-gl-tooltip.bottom
+        class="js-release-date-info"
+        :title="tooltipTitle(release.releasedAt)"
+      >
         {{ releasedTimeAgo }}
       </span>
     </div>
diff --git a/app/assets/javascripts/releases/components/release_block_milestone_info.vue b/app/assets/javascripts/releases/components/release_block_milestone_info.vue
index 01ad0cbf732..d9fbd2884b7 100644
--- a/app/assets/javascripts/releases/components/release_block_milestone_info.vue
+++ b/app/assets/javascripts/releases/components/release_block_milestone_info.vue
@@ -3,7 +3,7 @@ import {
   GlProgressBar,
   GlLink,
   GlBadge,
-  GlDeprecatedButton,
+  GlButton,
   GlTooltipDirective,
   GlSprintf,
 } from '@gitlab/ui';
@@ -17,7 +17,7 @@ export default {
     GlProgressBar,
     GlLink,
     GlBadge,
-    GlDeprecatedButton,
+    GlButton,
     GlSprintf,
   },
   directives: {
@@ -134,13 +134,9 @@ export default {
             <span :key="'bullet-' + milestone.id" class="append-right-4">&bull;</span>
           </template>
           <template v-if="shouldRenderShowMoreLink(index)">
-            <gl-deprecated-button
-              :key="'more-button-' + milestone.id"
-              variant="link"
-              @click="toggleShowAll"
-            >
+            <gl-button :key="'more-button-' + milestone.id" variant="link" @click="toggleShowAll">
               {{ moreText }}
-            </gl-deprecated-button>
+            </gl-button>
           </template>
         </template>
       </div>
diff --git a/app/assets/javascripts/releases/stores/modules/detail/actions.js b/app/assets/javascripts/releases/stores/modules/detail/actions.js
index 7b84c18242c..3bc427dfa16 100644
--- a/app/assets/javascripts/releases/stores/modules/detail/actions.js
+++ b/app/assets/javascripts/releases/stores/modules/detail/actions.js
@@ -18,7 +18,12 @@ export const fetchRelease = ({ dispatch, state }) => {
 
   return api
     .release(state.projectId, state.tagName)
-    .then(({ data: release }) => {
+    .then(({ data }) => {
+      const release = {
+        ...data,
+        milestones: data.milestones || [],
+      };
+
       dispatch('receiveReleaseSuccess', convertObjectPropsToCamelCase(release, { deep: true }));
     })
     .catch(error => {
@@ -28,6 +33,8 @@ export const fetchRelease = ({ dispatch, state }) => {
 
 export const updateReleaseTitle = ({ commit }, title) => commit(types.UPDATE_RELEASE_TITLE, title);
 export const updateReleaseNotes = ({ commit }, notes) => commit(types.UPDATE_RELEASE_NOTES, notes);
+export const updateReleaseMilestones = ({ commit }, milestones) =>
+  commit(types.UPDATE_RELEASE_MILESTONES, milestones);
 
 export const requestUpdateRelease = ({ commit }) => commit(types.REQUEST_UPDATE_RELEASE);
 export const receiveUpdateReleaseSuccess = ({ commit, state, rootState }) => {
@@ -45,12 +52,14 @@ export const updateRelease = ({ dispatch, state, getters }) => {
   dispatch('requestUpdateRelease');
 
   const { release } = state;
+  const milestones = release.milestones ? release.milestones.map(milestone => milestone.title) : [];
 
   return (
     api
       .updateRelease(state.projectId, state.tagName, {
         name: release.name,
         description: release.description,
+        milestones,
       })
 
       /**
diff --git a/app/assets/javascripts/releases/stores/modules/detail/mutation_types.js b/app/assets/javascripts/releases/stores/modules/detail/mutation_types.js
index 04944b76e42..1d6356990ce 100644
--- a/app/assets/javascripts/releases/stores/modules/detail/mutation_types.js
+++ b/app/assets/javascripts/releases/stores/modules/detail/mutation_types.js
@@ -4,6 +4,7 @@ export const RECEIVE_RELEASE_ERROR = 'RECEIVE_RELEASE_ERROR';
 
 export const UPDATE_RELEASE_TITLE = 'UPDATE_RELEASE_TITLE';
 export const UPDATE_RELEASE_NOTES = 'UPDATE_RELEASE_NOTES';
+export const UPDATE_RELEASE_MILESTONES = 'UPDATE_RELEASE_MILESTONES';
 
 export const REQUEST_UPDATE_RELEASE = 'REQUEST_UPDATE_RELEASE';
 export const RECEIVE_UPDATE_RELEASE_SUCCESS = 'RECEIVE_UPDATE_RELEASE_SUCCESS';
diff --git a/app/assets/javascripts/releases/stores/modules/detail/mutations.js b/app/assets/javascripts/releases/stores/modules/detail/mutations.js
index 3d97e3a75c2..5c29b402cba 100644
--- a/app/assets/javascripts/releases/stores/modules/detail/mutations.js
+++ b/app/assets/javascripts/releases/stores/modules/detail/mutations.js
@@ -28,6 +28,10 @@ export default {
     state.release.description = notes;
   },
 
+  [types.UPDATE_RELEASE_MILESTONES](state, milestones) {
+    state.release.milestones = milestones;
+  },
+
   [types.REQUEST_UPDATE_RELEASE](state) {
     state.isUpdatingRelease = true;
   },
diff --git a/app/assets/javascripts/releases/stores/modules/detail/state.js b/app/assets/javascripts/releases/stores/modules/detail/state.js
index b513e1bed79..6d0d102c719 100644
--- a/app/assets/javascripts/releases/stores/modules/detail/state.js
+++ b/app/assets/javascripts/releases/stores/modules/detail/state.js
@@ -6,6 +6,8 @@ export default ({
   markdownPreviewPath,
   updateReleaseApiDocsPath,
   releaseAssetsDocsPath,
+  manageMilestonesPath,
+  newMilestonePath,
 }) => ({
   projectId,
   tagName,
@@ -14,6 +16,8 @@ export default ({
   markdownPreviewPath,
   updateReleaseApiDocsPath,
   releaseAssetsDocsPath,
+  manageMilestonesPath,
+  newMilestonePath,
 
   /** The Release object */
   release: null,
-- 
cgit v1.2.1