<template>
	<v-app dark>
		<h1 v-if="error.statusCode === 404">
			{{ pageNotFound }}
		</h1>
		<h1 v-else>
			{{ otherError }}
		</h1>
		<NuxtLink :to="myHome.root">
			Home page
		</NuxtLink>
	</v-app>
</template>

<script>
import { mapState } from 'vuex';
export default {
	layout: 'empty',
	props: {
		error: {
			type: Object,
			default: null,
		},
	},
	data() {
		return {
			pageNotFound: '404 Not Found',
			otherError: 'An error occurred',
		};
	},
	computed: {
		...mapState(['myHome']),
	},
	head() {
		const title =
			this.error.statusCode === 404 ? this.pageNotFound : this.otherError;
		return {
			title,
		};
	},
};
</script>

<style scoped>
h1 {
	font-size: 20px;
}
</style>
