All files / ext.wikilambda.edit/components/widgets LeaveEditorDialog.vue

100% Statements 19/19
50% Branches 1/2
100% Functions 8/8
100% Lines 19/19

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 11119x     19x                                               14x               14x                 14x                       14x                   3x             3x 3x 3x         19x   19x     19x 19x 19x       20x 20x                     6x       19x      
<!--
	WikiLambda Vue component for the Leave Editor Dialog which is displayed when the user attempts to leave
	the page before saving their changes.
 
	@copyright 2020– Abstract Wikipedia team; see AUTHORS.txt
	@license MIT
-->
<template>
	<div class="ext-wikilambda-leaveeditordialog">
		<cdx-dialog
			:open="showDialog"
			:title="leaveDialogTitle"
			:close-button-label="closeLabel"
			:primary-action="primaryAction"
			:default-action="defaultAction"
			@update:open="stayOnPage"
			@primary="leavePage"
			@default="stayOnPage"
		>
			<div>{{ $i18n( 'wikilambda-publish-lose-changes-prompt' ).text() }}</div>
		</cdx-dialog>
	</div>
</template>
 
<script>
const CdxDialog = require( '@wikimedia/codex' ).CdxDialog;
 
// @vue/components
module.exports = exports = {
	name: 'wl-leave-editor-dialog',
	components: {
		'cdx-dialog': CdxDialog
	},
	props: {
		showDialog: {
			type: Boolean,
			required: true,
			default: false
		},
		continueCallback: {
			type: Function,
			required: false,
			default: undefined
		}
	},
	computed: {
		/**
		 * Returns the title for the Leave dialog
		 *
		 * @return {string}
		 */
		leaveDialogTitle: function () {
			return this.$i18n( 'wikilambda-editor-leave-edit-mode-header' ).text();
		},
 
		/**
		 * Returns the name for the Close dialog button
		 *
		 * @return {string}
		 */
		closeLabel: function () {
			return this.$i18n( 'wikilambda-toast-close' ).text();
		},
 
		/**
		 * Returns an object of type PrimaryDialogAction that describes
		 * the action of the primary (save or publish) dialog button.
		 *
		 * @return {Object}
		 */
		primaryAction: function () {
			return {
				actionType: 'destructive',
				label: this.$i18n( 'wikilambda-discard-edits' ).text()
			};E
		},
 
		/**
		 * Returns an object of type DialogAction that describes
		 * the action of the secondary (cancel) button.
		 *
		 * @return {Object}
		 */
		defaultAction: function () {
			return {
				label: this.$i18n( 'wikilambda-continue-editing' ).text()
			};
		}
	},
	methods: {
		/**
		 * On click "Continue editing" option, simply close the dialog
		 */
		stayOnPage: function () {
			this.$emit( 'close-dialog' );
		},
 
		/**
		 * On click "Discard edits" option, handle state and event
		 * listeners for exit and close the dialog
		 */
		leavePage: function () {
			this.$emit( 'before-exit' );
			if ( this.continueCallback ) {
				this.continueCallback();
			}
		}
	}
};
</script>