versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2025-12-06 08:28:20 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: 🔥 Remove old loader

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-07-21 17:58:22 +02:00
parent 7c7ddb44e2
commit ddfa3b050d
No known key found for this signature in database
1 changed files with 0 additions and 73 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
components/loading.vue
View file

@ -1,73 +0,0 @@
<template>
<div v-if="loading" class="fixed inset-0 bg-black z-[500] flex items-center justify-center">
<!-- Progress bar stuck to top -->
<div class="fixed top-0 left-0 right-0 h-1.5 bg-primary-500" :style="{ width: `${progress}%` }"></div>
<div class="flex flex-col items-center justify-center gap-8">
<img src="/logo.webp" class="size-20 animate-pulse" role="presentation" />
</div>
</div>
</template>
<script lang="ts" setup>
const loading = ref(true);
const params = useUrlSearchParams();
const estimatedProgress = (duration: number, elapsed: number) =>
(2 / Math.PI) * 100 * Math.atan(((elapsed / duration) * 100) / 50);
const progress = ref(0);
const timeAtStart = performance.now();
const app = useNuxtApp();
const duration = 3000;
useIntervalFn(() => {
const elapsed = performance.now() - timeAtStart;
progress.value = estimatedProgress(duration, elapsed);
}, 1000 / 60);
app.hook("page:finish", async () => {
// Wait until page has loaded for at least 300ms
await new Promise((resolve) => setTimeout(resolve, 300));
loading.value = false;
if (params.oidc_account_linking_error) {
useEvent("notification:new", {
type: "error",
title: params.oidc_account_linking_error,
description: params.oidc_account_linking_error_message ?? undefined,
duration: 999999,
onStatusChange: (details) => {
if (details.status === "dismissing") {
// Remove data from URL
window.history.replaceState(
{},
document.title,
window.location.pathname,
);
}
},
});
}
if (params.oidc_account_linked) {
useEvent("notification:new", {
type: "success",
title: "Account linked",
description:
"Your account has been successfully linked to your OpenID Connect provider.",
duration: 999999,
onStatusChange: (details) => {
if (details.status === "dismissing") {
// Remove data from URL
window.history.replaceState(
{},
document.title,
window.location.pathname,
);
}
},
});
}
});
</script>