<template>
	<Dialog
		title="Remove stash"
		@close="$emit('close', false)"
	>
		<form
			class="dialog-body"
			@submit.prevent="removeStash"
		>
			Are you sure you want to remove stash "{{ stash.name }}"?

			<div class="dialog-actions right">
				<button
					type="submit"
					class="button button-primary"
				>Remove</button>
			</div>
		</form>
	</Dialog>
</template>

<script>
async function removeStash() {
	await this.$store.dispatch('removeStash', this.stash.id);

	this.$emit('close', true);
}

export default {
	props: {
		stash: {
			type: Object,
			default: null,
		},
	},
	emits: ['close'],
	methods: {
		removeStash,
	},
};
</script>