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

feat: ✨ Show spinner while OIDC account linking is loading

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-05-16 20:47:49 -10:00
parent f6153cb5fe
commit 44e6112335
No known key found for this signature in database
4 changed files with 11 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
components/loading.vue
View file

@ -60,7 +60,7 @@ app.hook("page:finish", async () => {
if (oidcAccountLinked) { if (oidcAccountLinked) {
useEvent("notification:new", { useEvent("notification:new", {
type: "info", type: "success",
title: "Account linked", title: "Account linked",
message: message:
"Your account has been successfully linked to your OpenID Connect provider.", "Your account has been successfully linked to your OpenID Connect provider.",

4
components/notifications/Renderer.vue
View file

@ -13,10 +13,12 @@
<div class="p-4"> <div class="p-4">
<div class="flex items-start"> <div class="flex items-start">
<div class="shrink-0 h-6 w-6"> <div class="shrink-0 h-6 w-6">
<iconify-icon v-if="notification.type === 'info'" icon="tabler:check" height="none" <iconify-icon v-if="notification.type === 'success'" icon="tabler:check" height="none"
class="h-6 w-6 text-green-400" aria-hidden="true" /> class="h-6 w-6 text-green-400" aria-hidden="true" />
<iconify-icon v-else-if="notification.type === 'error'" icon="tabler:alert-triangle" <iconify-icon v-else-if="notification.type === 'error'" icon="tabler:alert-triangle"
height="none" class="h-6 w-6 text-red-400" aria-hidden="true" /> height="none" class="h-6 w-6 text-red-400" aria-hidden="true" />
<iconify-icon v-else-if="notification.type === 'progress'" icon="tabler:loader"
height="none" class="h-6 w-6 text-pink-500 animate-spin" aria-hidden="true" />
</div> </div>
<div class="ml-3 w-0 flex-1 pt-0.5"> <div class="ml-3 w-0 flex-1 pt-0.5">
<p class="text-sm font-semibold text-gray-50">{{ notification.title }}</p> <p class="text-sm font-semibold text-gray-50">{{ notification.title }}</p>

2
composables/EventBus.ts
View file

@ -2,7 +2,7 @@ import mitt from "mitt";
import type { Status } from "~/types/mastodon/status"; import type { Status } from "~/types/mastodon/status";
export type NotificationEvent = { export type NotificationEvent = {
type: "error" | "info"; type: "error" | "success" | "progress";
title: string; title: string;
message?: string; message?: string;
persistent?: boolean; persistent?: boolean;

6
layouts/app.vue
View file

@ -56,6 +56,12 @@ watchEffect(async () => {
useEvent("composer:open"); useEvent("composer:open");
} }
if (o_i_d_c.value) { if (o_i_d_c.value) {
useEvent("notification:new", {
type: "progress",
title: "Linking your account",
persistent: true,
});
const issuer = providers.value?.providers[0]; const issuer = providers.value?.providers[0];
if (!issuer) { if (!issuer) {