1 files changed, 15 insertions, 9 deletions
diff --git a/app/assets/javascripts/releases/components/app_edit.vue b/app/assets/javascripts/releases/components/app_edit.vue
index 06e388002e4..df356c18417 100644
--- a/app/assets/javascripts/releases/components/app_edit.vue
+++ b/app/assets/javascripts/releases/components/app_edit.vue
@@ -1,6 +1,6 @@
 <script>
-import { mapState, mapActions } from 'vuex';
-import { GlDeprecatedButton, GlLink, GlFormInput, GlFormGroup } from '@gitlab/ui';
+import { mapState, mapActions, mapGetters } from 'vuex';
+import { GlNewButton, GlFormInput, GlFormGroup } from '@gitlab/ui';
 import { escape as esc } from 'lodash';
 import { __, sprintf } from '~/locale';
 import MarkdownField from '~/vue_shared/components/markdown/field.vue';
@@ -15,8 +15,7 @@ export default {
   components: {
     GlFormInput,
     GlFormGroup,
-    GlDeprecatedButton,
-    GlLink,
+    GlNewButton,
     MarkdownField,
     AssetLinksForm,
   },
@@ -27,12 +26,14 @@ export default {
   computed: {
     ...mapState('detail', [
       'isFetchingRelease',
+      'isUpdatingRelease',
       'fetchError',
       'markdownDocsPath',
       'markdownPreviewPath',
       'releasesPagePath',
       'updateReleaseApiDocsPath',
     ]),
+    ...mapGetters('detail', ['isValid']),
     showForm() {
       return !this.isFetchingRelease && !this.fetchError;
     },
@@ -87,6 +88,9 @@ export default {
     showAssetLinksForm() {
       return this.glFeatures.releaseAssetLinkEditing;
     },
+    isSaveChangesDisabled() {
+      return this.isUpdatingRelease || !this.isValid;
+    },
   },
   created() {
     this.fetchRelease();
@@ -163,17 +167,19 @@ export default {
       <asset-links-form v-if="showAssetLinksForm" />
 
       <div class="d-flex pt-3">
-        <gl-deprecated-button
-          class="mr-auto js-submit-button"
+        <gl-new-button
+          class="mr-auto js-no-auto-disable"
+          category="primary"
           variant="success"
           type="submit"
           :aria-label="__('Save changes')"
+          :disabled="isSaveChangesDisabled"
         >
           {{ __('Save changes') }}
-        </gl-deprecated-button>
-        <gl-link :href="cancelPath" class="js-cancel-button btn btn-default">
+        </gl-new-button>
+        <gl-new-button :href="cancelPath" class="js-cancel-button">
           {{ __('Cancel') }}
-        </gl-link>
+        </gl-new-button>
       </div>
     </form>
   </div>