diff options
Diffstat (limited to 'app/assets/javascripts/issue_show/components/form.vue')
-rw-r--r-- | app/assets/javascripts/issue_show/components/form.vue | 64 |
1 files changed, 59 insertions, 5 deletions
diff --git a/app/assets/javascripts/issue_show/components/form.vue b/app/assets/javascripts/issue_show/components/form.vue index 76ea489fb86..b37a911a669 100644 --- a/app/assets/javascripts/issue_show/components/form.vue +++ b/app/assets/javascripts/issue_show/components/form.vue @@ -1,4 +1,5 @@ <script> +import { GlAlert } from '@gitlab/ui'; import $ from 'jquery'; import Autosave from '~/autosave'; import eventHub from '../event_hub'; @@ -15,6 +16,7 @@ export default { descriptionField, descriptionTemplate, editActions, + GlAlert, }, props: { canDestroy: { @@ -69,6 +71,16 @@ export default { required: false, default: true, }, + initialDescriptionText: { + type: String, + required: false, + default: '', + }, + }, + data() { + return { + showOutdatedDescriptionWarning: false, + }; }, computed: { hasIssuableTemplates() { @@ -102,11 +114,17 @@ export default { }, } = this.$refs; - this.autosaveDescription = new Autosave($(textarea), [ - document.location.pathname, - document.location.search, - 'description', - ]); + this.autosaveDescription = new Autosave( + $(textarea), + [document.location.pathname, document.location.search, 'description'], + null, + this.formState.lock_version, + ); + + const savedLockVersion = this.autosaveDescription.getSavedLockVersion(); + + this.showOutdatedDescriptionWarning = + savedLockVersion && String(this.formState.lock_version) !== savedLockVersion; this.autosaveTitle = new Autosave($(input), [ document.location.pathname, @@ -118,6 +136,27 @@ export default { this.autosaveDescription.reset(); this.autosaveTitle.reset(); }, + keepAutosave() { + const { + description: { + $refs: { textarea }, + }, + } = this.$refs; + + textarea.focus(); + this.showOutdatedDescriptionWarning = false; + }, + discardAutosave() { + const { + description: { + $refs: { textarea }, + }, + } = this.$refs; + + textarea.value = this.initialDescriptionText; + textarea.focus(); + this.showOutdatedDescriptionWarning = false; + }, }, }; </script> @@ -125,6 +164,21 @@ export default { <template> <form> <locked-warning v-if="showLockedWarning" /> + <gl-alert + v-if="showOutdatedDescriptionWarning" + class="gl-mb-5" + variant="warning" + :primary-button-text="__('Keep')" + :secondary-button-text="__('Discard')" + :dismissible="false" + @primaryAction="keepAutosave" + @secondaryAction="discardAutosave" + >{{ + __( + 'The comment you are editing has been changed by another user. Would you like to keep your changes and overwrite the new description or discard your changes?', + ) + }}</gl-alert + > <div class="row"> <div v-if="hasIssuableTemplates" class="col-sm-4 col-lg-3"> <description-template |