Add latest changes from gitlab-org/gitlab@master

6 files changed, 69 insertions, 13 deletions

diff --git a/app/assets/javascripts/releases/components/app_index.vue b/app/assets/javascripts/releases/components/app_index.vue
index e237db2cc6f..422d8bf630d 100644
--- a/app/assets/javascripts/releases/components/app_index.vue
+++ b/app/assets/javascripts/releases/components/app_index.vue
@@ -1,25 +1,21 @@
 <script>
 import { mapState, mapActions } from 'vuex';
-import {
-  GlDeprecatedSkeletonLoading as GlSkeletonLoading,
-  GlEmptyState,
-  GlLink,
-  GlButton,
-} from '@gitlab/ui';
+import { GlEmptyState, GlLink, GlButton } from '@gitlab/ui';
 import { getParameterByName } from '~/lib/utils/common_utils';
 import { __ } from '~/locale';
 import ReleaseBlock from './release_block.vue';
 import ReleasesPagination from './releases_pagination.vue';
+import ReleaseSkeletonLoader from './release_skeleton_loader.vue';
 
 export default {
   name: 'ReleasesApp',
   components: {
-    GlSkeletonLoading,
     GlEmptyState,
-    ReleaseBlock,
-    ReleasesPagination,
     GlLink,
     GlButton,
+    ReleaseBlock,
+    ReleasesPagination,
+    ReleaseSkeletonLoader,
   },
   computed: {
     ...mapState('list', [
@@ -77,7 +73,7 @@ export default {
       {{ __('New release') }}
     </gl-button>
 
-    <gl-skeleton-loading v-if="isLoading" class="js-loading" />
+    <release-skeleton-loader v-if="isLoading" class="js-loading" />
 
     <gl-empty-state
       v-else-if="shouldRenderEmptyState"
diff --git a/app/assets/javascripts/releases/components/app_show.vue b/app/assets/javascripts/releases/components/app_show.vue
index 8b89f0cf3fc..9ef38503c10 100644
--- a/app/assets/javascripts/releases/components/app_show.vue
+++ b/app/assets/javascripts/releases/components/app_show.vue
@@ -1,13 +1,13 @@
 <script>
 import { mapState, mapActions } from 'vuex';
-import { GlDeprecatedSkeletonLoading as GlSkeletonLoading } from '@gitlab/ui';
 import ReleaseBlock from './release_block.vue';
+import ReleaseSkeletonLoader from './release_skeleton_loader.vue';
 
 export default {
   name: 'ReleaseShowApp',
   components: {
-    GlSkeletonLoading,
     ReleaseBlock,
+    ReleaseSkeletonLoader,
   },
   computed: {
     ...mapState('detail', ['isFetchingRelease', 'fetchError', 'release']),
@@ -22,7 +22,7 @@ export default {
 </script>
 <template>
   <div class="gl-mt-3">
-    <gl-skeleton-loading v-if="isFetchingRelease" />
+    <release-skeleton-loader v-if="isFetchingRelease" />
 
     <release-block v-else-if="!fetchError" :release="release" />
   </div>
diff --git a/app/assets/javascripts/releases/components/release_skeleton_loader.vue b/app/assets/javascripts/releases/components/release_skeleton_loader.vue
new file mode 100644
index 00000000000..054620af636
--- /dev/null
+++ b/app/assets/javascripts/releases/components/release_skeleton_loader.vue
@@ -0,0 +1,51 @@
+<script>
+import { GlSkeletonLoader } from '@gitlab/ui';
+
+export default {
+  name: 'ReleaseSkeletonLoader',
+  components: { GlSkeletonLoader },
+};
+</script>
+<template>
+  <gl-skeleton-loader :width="1248" :height="420">
+    <!-- Outside border -->
+    <path
+      d="M 4.5 0 C 2.0156486 0 0 2.0156486 0 4.5 L 0 415.5 C 0 417.98435 2.0156486 420 4.5 420 L 1243.5 420 C 1245.9844 420 1248 417.98435 1248 415.5 L 1248 4.5 C 1248 2.0156486 1245.9844 0 1243.5 0 L 4.5 0 z M 4.5 1 L 1243.5 1 C 1245.4476 1 1247 2.5523514 1247 4.5 L 1247 415.5 C 1247 417.44765 1245.4476 419 1243.5 419 L 4.5 419 C 2.5523514 419 1 417.44765 1 415.5 L 1 4.5 C 1 2.5523514 2.5523514 1 4.5 1 z "
+    />
+
+    <!-- Header bottom border -->
+    <rect x="0" y="63.5" width="1248" height="1" />
+
+    <!-- Release title -->
+    <rect x="16" y="20" width="293" height="24" />
+
+    <!-- Edit (pencil) button -->
+    <rect x="1207" y="16" rx="4" width="32" height="32" />
+
+    <!-- Asset link 1 -->
+    <rect x="40" y="121" rx="4" width="16" height="16" />
+    <rect x="60" y="125" width="116" height="8" />
+
+    <!-- Asset link 2 -->
+    <rect x="40" y="145" rx="4" width="16" height="16" />
+    <rect x="60" y="149" width="132" height="8" />
+
+    <!-- Asset link 3 -->
+    <rect x="40" y="169" rx="4" width="16" height="16" />
+    <rect x="60" y="173" width="140" height="8" />
+
+    <!-- Asset link 4 -->
+    <rect x="40" y="193" rx="4" width="16" height="16" />
+    <rect x="60" y="197" width="112" height="8" />
+
+    <!-- Release notes -->
+    <rect x="16" y="228" width="480" height="8" />
+    <rect x="16" y="252" width="560" height="8" />
+    <rect x="16" y="276" width="480" height="8" />
+    <rect x="16" y="300" width="560" height="8" />
+    <rect x="16" y="324" width="320" height="8" />
+
+    <!-- Footer top border -->
+    <rect x="0" y="373" width="1248" height="1" />
+  </gl-skeleton-loader>
+</template>
diff --git a/app/assets/javascripts/releases/stores/modules/detail/actions.js b/app/assets/javascripts/releases/stores/modules/detail/actions.js
index 5b682a0ab0f..2f298faf37e 100644
--- a/app/assets/javascripts/releases/stores/modules/detail/actions.js
+++ b/app/assets/javascripts/releases/stores/modules/detail/actions.js
@@ -45,6 +45,9 @@ export const updateReleaseNotes = ({ commit }, notes) => commit(types.UPDATE_REL
 export const updateReleaseMilestones = ({ commit }, milestones) =>
   commit(types.UPDATE_RELEASE_MILESTONES, milestones);
 
+export const updateReleaseGroupMilestones = ({ commit }, groupMilestones) =>
+  commit(types.UPDATE_RELEASE_GROUP_MILESTONES, groupMilestones);
+
 export const addEmptyAssetLink = ({ commit }) => {
   commit(types.ADD_EMPTY_ASSET_LINK);
 };
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 7784e0cc741..1b2f5f33f02 100644
--- a/app/assets/javascripts/releases/stores/modules/detail/mutation_types.js
+++ b/app/assets/javascripts/releases/stores/modules/detail/mutation_types.js
@@ -9,6 +9,7 @@ export const UPDATE_CREATE_FROM = 'UPDATE_CREATE_FROM';
 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 UPDATE_RELEASE_GROUP_MILESTONES = 'UPDATE_RELEASE_GROUP_MILESTONES';
 
 export const REQUEST_SAVE_RELEASE = 'REQUEST_SAVE_RELEASE';
 export const RECEIVE_SAVE_RELEASE_SUCCESS = 'RECEIVE_SAVE_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 750f496665d..58a1958c5e2 100644
--- a/app/assets/javascripts/releases/stores/modules/detail/mutations.js
+++ b/app/assets/javascripts/releases/stores/modules/detail/mutations.js
@@ -13,6 +13,7 @@ export default {
       name: '',
       description: '',
       milestones: [],
+      groupMilestones: [],
       assets: {
         links: [],
       },
@@ -51,6 +52,10 @@ export default {
     state.release.milestones = milestones;
   },
 
+  [types.UPDATE_RELEASE_GROUP_MILESTONES](state, groupMilestones) {
+    state.release.groupMilestones = groupMilestones;
+  },
+
   [types.REQUEST_SAVE_RELEASE](state) {
     state.isUpdatingRelease = true;
   },