From 58b2b95040bfba8f945fc3a5d7a2b791e641eafc Mon Sep 17 00:00:00 2001
From: Vincent Rodriguez <64779770+R-mooon@users.noreply.github.com>
Date: Thu, 17 Jun 2021 15:42:23 +0200
Subject: [PATCH] Error page done (#452)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Error page done

* :bug: (page) update template location to avoid overwriting docus error page

Co-authored-by: Yaël GUILLOUX <yael.guilloux@gmail.com>
---
 nuxtjs.org/components/templates/Error.vue | 33 +++++++++++++++++++++++
 src/app/pages/_.vue                       |  2 +-
 2 files changed, 34 insertions(+), 1 deletion(-)
 create mode 100644 nuxtjs.org/components/templates/Error.vue

diff --git a/nuxtjs.org/components/templates/Error.vue b/nuxtjs.org/components/templates/Error.vue
new file mode 100644
index 000000000..4a73c2495
--- /dev/null
+++ b/nuxtjs.org/components/templates/Error.vue
@@ -0,0 +1,33 @@
+<template>
+  <AppPage class="min-h-screen-sm">
+    <div class="mt-48 flex items-center justify-center flex-col px-4 md:px-0">
+      <h1 class="font-serif text-display-6 md:text-display-5 2xl:text-display-4 text-center">{{ error.message }}</h1>
+      <p class="text-center mt-4 mb-4">We couldn't find the page you are looking for.</p>
+      <SectionButton to="/" size="md" class="bg-primary text-gray-800 hover:bg-green-300 focus:bg-green-300">
+        Go back home
+      </SectionButton>
+    </div>
+  </AppPage>
+</template>
+
+<script>
+import { defineComponent } from '@nuxtjs/composition-api'
+
+export default defineComponent({
+  props: {
+    error: {
+      type: Object,
+      required: true
+    }
+  },
+  head() {
+    return {
+      title: this.error.message
+    }
+  },
+  templateOptions: {
+    aside: false,
+    fluid: false
+  }
+})
+</script>
diff --git a/src/app/pages/_.vue b/src/app/pages/_.vue
index f759659dc..b8317e4b5 100644
--- a/src/app/pages/_.vue
+++ b/src/app/pages/_.vue
@@ -35,7 +35,7 @@ export default defineComponent({
       .fetch()
 
     // Break on missing page query
-    if (!page) return error({ statusCode: 404, message: 'Page not found' })
+    if (!page) return error({ statusCode: 404, message: '404 - Page not found' })
 
     // Get page template
     page.template = $docus.getPageTemplate(page)