tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

feat(frontend): kosmetische verbeteringen & i18n in de callback-pagina

Browse source
This commit is contained in:
Gerald Schmittinger 2025-04-19 15:51:52 +02:00
parent 7f1ec2a4bb
commit 59569445c3
5 changed files with 31 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

4
frontend/src/i18n/locale/de.json
View file

@ -75,5 +75,7 @@
"sent": "sent", "sent": "sent",
"failed": "gescheitert", "failed": "gescheitert",
"wrong": "etwas ist schief gelaufen", "wrong": "etwas ist schief gelaufen",
"created": "erstellt" "created": "erstellt",
"callbackLoading": "Sie werden angemeldet...",
"loginUnexpectedError": "Anmeldung fehlgeschlagen"
} }

4
frontend/src/i18n/locale/en.json
View file

@ -75,5 +75,7 @@
"sent": "sent", "sent": "sent",
"failed": "failed", "failed": "failed",
"wrong": "something went wrong", "wrong": "something went wrong",
"created": "created" "created": "created",
"callbackLoading": "You are being logged in...",
"loginUnexpectedError": "Login failed"
} }

4
frontend/src/i18n/locale/fr.json
View file

@ -75,5 +75,7 @@
"sent": "envoyé", "sent": "envoyé",
"failed": "échoué", "failed": "échoué",
"wrong": "quelque chose n'a pas fonctionné", "wrong": "quelque chose n'a pas fonctionné",
"created": "créé" "created": "créé",
"callbackLoading": "Vous serez connecté...",
"loginUnexpectedError": "La connexion a échoué"
} }

4
frontend/src/i18n/locale/nl.json
View file

@ -75,5 +75,7 @@
"sent": "verzonden", "sent": "verzonden",
"failed": "mislukt", "failed": "mislukt",
"wrong": "er ging iets verkeerd", "wrong": "er ging iets verkeerd",
"created": "gecreëerd" "created": "gecreëerd",
"callbackLoading": "Je wordt ingelogd...",
"loginUnexpectedError": "Inloggen mislukt"
} }

23
frontend/src/views/CallbackPage.vue
View file

@ -1,8 +1,11 @@
<script setup lang="ts"> <script setup lang="ts">
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import { useI18n } from "vue-i18n";
import { onMounted, ref, type Ref } from "vue"; import { onMounted, ref, type Ref } from "vue";
import auth from "../services/auth/auth-service.ts"; import auth from "../services/auth/auth-service.ts";
const { t } = useI18n();
const router = useRouter(); const router = useRouter();
const errorMessage: Ref<string | null> = ref(null); const errorMessage: Ref<string | null> = ref(null);
@ -12,14 +15,26 @@
await auth.handleLoginCallback(); await auth.handleLoginCallback();
await router.replace("/user"); // Redirect to theme page await router.replace("/user"); // Redirect to theme page
} catch (error) { } catch (error) {
errorMessage.value = `OIDC callback error: ${error}`; errorMessage.value = `${ t('loginUnexpectedError') }: ${error}`;
} }
}); });
</script> </script>
<template> <template>
<p v-if="!errorMessage">Logging you in...</p> <div class="callback">
<p v-else>{{ errorMessage }}</p> <div class="callback-loading" v-if="!errorMessage">
<v-progress-circular indeterminate></v-progress-circular>
<p>{{ t("callbackLoading") }}</p>
</div>
<v-alert icon="mdi-alert-circle" type="error" variant="elevated" v-if="errorMessage">
{{ errorMessage }}
</v-alert>
</div>
</template> </template>
<style scoped></style> <style scoped>
.callback {
text-align: center;
margin: 20px;
}
</style>