feat(auth): setup a basic oidc callback error view with retry button

src/i18n/lang/en.js

@@ -6,8 +6,8 @@ export default {
     yes: "Yes"
   },
   oidc: {
-    callbackMessage: "OIDC callback message",
-    callbackErrorMessage: "OIDC callback error message"
+    callbackErrorMessage: "An error occured during authentication...",
+    tryAgain: "Try Again"
   },
   Header: {
     selectLanguage: "Choose a language",
@@ -77,10 +77,9 @@ export default {
       errorMessage: "Invalid project name."
     },
     ProjectDeleteGuard: {
-      title: "Supprimer le projet",
-      message:
-        "Êtes vous sûr de vouloir supprimer (définitivement) ce projet ?",
-      buttonDelete: "Supprimer"
+      title: "Delete project",
+      message: "Are you sure you want to (permanently) delete this project ?",
+      buttonDelete: "Delete"
     }
   }
 };

src/i18n/lang/fr.js

@@ -6,8 +6,9 @@ export default {
     yes: "Oui"
   },
   oidc: {
-    callbackMessage: "OIDC callback message",
-    callbackErrorMessage: "OIDC callback error message"
+    callbackErrorMessage:
+      "Une erreur s'est produite lors de l'authentification...",
+    tryAgain: "Réessayer"
   },
   Header: {
     selectLanguage: "Sélectionner la langue",

src/router/guards.js

@@ -6,7 +6,7 @@ const authGuard = async (to, from, next) => {
     next();
   } else if (to.matched.some(r => r.meta.requiresAuth)) {
     await authenticate(to.path);
-    next();
+    next(isAuthenticated.value);
   } else {
     next();
   }

src/views/oidc-callback-error/OidcCallbackError.scss

@@ -0,0 +1,8 @@
+.oidc-callback-error-view {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}

src/views/oidc-callback-error/OidcCallbackError.vue

@@ -1,5 +1,31 @@
 <template>
   <div class="oidc-callback-error-view">
-    {{ $t("oidc.callbackErrorMessage") }}
+    <h1>{{ $t("oidc.callbackErrorMessage") }}</h1>
+    <BIMDataButton fill radius color="primary" @click="goToRoot">
+      {{ $t("oidc.tryAgain") }}
+    </BIMDataButton>
   </div>
 </template>
+
+<script>
+import { useRouter } from "vue-router";
+// Components
+import BIMDataButton from "@bimdata/design-system/dist/js/BIMDataComponents/vue3/BIMDataButton.js";
+
+export default {
+  components: {
+    BIMDataButton
+  },
+  setup() {
+    const router = useRouter();
+
+    const goToRoot = () => router.push("/");
+
+    return {
+      goToRoot
+    };
+  }
+};
+</script>
+
+<style scoped lang="scss" src="./OidcCallbackError.scss"></style>