refactor(auth): cleanup auth module and streamline the registration flow
This commit is contained in:
@@ -10,6 +10,8 @@ export const useBrandingStore = defineStore(
|
||||
|
||||
const currentBrand = ref(undefined)
|
||||
const loading = ref(false)
|
||||
const error = ref(null)
|
||||
const notFound = ref(false)
|
||||
|
||||
const value = useSessionStorage(
|
||||
'branding',
|
||||
@@ -30,12 +32,28 @@ export const useBrandingStore = defineStore(
|
||||
|
||||
async function updateBrand(newBrand) {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
notFound.value = false
|
||||
|
||||
if (newBrand !== currentBrand.value) {
|
||||
if (newBrand !== undefined) {
|
||||
value.value = await fetchCreatorData(newBrand)
|
||||
const result = await fetchCreatorData(newBrand)
|
||||
if (result.success) {
|
||||
value.value = result.data
|
||||
currentBrand.value = newBrand
|
||||
presentationInfos.value = value.value?.presentationInfos
|
||||
presentationInfos.value = result.data?.presentationInfos
|
||||
} else {
|
||||
// Handle different error types
|
||||
if (result.status === 404) {
|
||||
notFound.value = true
|
||||
error.value = 'Creator not found'
|
||||
} else {
|
||||
error.value = result.error || 'Failed to load creator'
|
||||
}
|
||||
value.value = {}
|
||||
currentBrand.value = undefined
|
||||
presentationInfos.value = []
|
||||
}
|
||||
} else {
|
||||
value.value = {}
|
||||
currentBrand.value = undefined
|
||||
@@ -50,15 +68,29 @@ export const useBrandingStore = defineStore(
|
||||
try {
|
||||
const client = useClient()
|
||||
const response = await client.get(`/api/creators/@${creatorAlias}`)
|
||||
return response.data
|
||||
return { success: true, data: response.data }
|
||||
} catch (error) {
|
||||
await router.push('/');
|
||||
console.error('Error fetching creator data:', error)
|
||||
|
||||
if (error.response?.status === 404) {
|
||||
return { success: false, status: 404, error: 'Creator not found' }
|
||||
}
|
||||
|
||||
return {
|
||||
success: false,
|
||||
status: error.response?.status || 500,
|
||||
error: error.message || 'Unknown error occurred'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
currentBrand,
|
||||
value,
|
||||
loading, updateBrand, presentationInfos
|
||||
loading,
|
||||
error,
|
||||
notFound,
|
||||
updateBrand,
|
||||
presentationInfos
|
||||
}
|
||||
})
|
||||
|
||||
@@ -1,32 +1,95 @@
|
||||
<script async setup>
|
||||
import {useBrandingStore} from "@/stores/brandingStore.js";
|
||||
import {onMounted} from "vue";
|
||||
import Footer from "@/views/main/Footer.vue";
|
||||
import { useBrandingStore } from '@/stores/brandingStore.js';
|
||||
import { onMounted } from 'vue';
|
||||
import Footer from '@/views/main/Footer.vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import ActualBanner from "@/views/creators/ActualBanner.vue";
|
||||
import BannerActions from "@/views/creators/BannerActions.vue";
|
||||
import ActualBanner from '@/views/creators/ActualBanner.vue';
|
||||
import BannerActions from '@/views/creators/BannerActions.vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
const brandingStore = useBrandingStore();
|
||||
const creatorName = window.location.pathname.split('/@')[1]?.split('/')[0] || '';
|
||||
const { t } = useI18n();
|
||||
const router = useRouter();
|
||||
|
||||
onMounted(async () => {
|
||||
await brandingStore.updateBrand(creatorName);
|
||||
});
|
||||
|
||||
const goHome = () => {
|
||||
router.push('/landing');
|
||||
};
|
||||
|
||||
const goBack = () => {
|
||||
router.go(-1);
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
<div class="min-h-screen max-w-[1024px] bg-hSurface text-hOnSurface">
|
||||
|
||||
<div v-if="brandingStore.loading">
|
||||
<v-progress-linear indeterminate></v-progress-linear>
|
||||
</div>
|
||||
<div v-else>
|
||||
|
||||
<div v-if="brandingStore.value.isDeleted"
|
||||
class="bg-red-500 p-2 m-4 text-center font-semibold">
|
||||
<!-- 404 Error State -->
|
||||
<div
|
||||
v-else-if="brandingStore.notFound"
|
||||
class="flex flex-col items-center justify-center min-h-screen p-8"
|
||||
>
|
||||
<div class="text-center max-w-md">
|
||||
<div class="text-6xl font-bold text-gray-400 mb-4">404</div>
|
||||
<h1 class="text-2xl font-semibold mb-4">{{ t('creator.notFound.title') }}</h1>
|
||||
<p class="text-gray-600 mb-8">{{ t('creator.notFound.message', { creator: creatorName }) }}</p>
|
||||
|
||||
<div class="space-y-4">
|
||||
<v-btn
|
||||
class="w-full"
|
||||
color="primary"
|
||||
size="large"
|
||||
@click="goHome"
|
||||
>
|
||||
{{ t('creator.notFound.goHome') }}
|
||||
</v-btn>
|
||||
|
||||
<v-btn
|
||||
class="w-full"
|
||||
size="large"
|
||||
variant="outlined"
|
||||
@click="goBack"
|
||||
>
|
||||
{{ t('creator.notFound.goBack') }}
|
||||
</v-btn>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Error State (non-404 errors) -->
|
||||
<div
|
||||
v-else-if="brandingStore.error && !brandingStore.notFound"
|
||||
class="flex flex-col items-center justify-center min-h-screen p-8"
|
||||
>
|
||||
<div class="text-center max-w-md">
|
||||
<div class="text-4xl font-bold text-red-400 mb-4">⚠️</div>
|
||||
<h1 class="text-2xl font-semibold mb-4">{{ t('creator.error.title') }}</h1>
|
||||
<p class="text-gray-600 mb-8">{{ t('creator.error.message') }}</p>
|
||||
|
||||
<v-btn
|
||||
class="w-full"
|
||||
color="primary"
|
||||
size="large"
|
||||
@click="goHome"
|
||||
>
|
||||
{{ t('creator.error.goHome') }}
|
||||
</v-btn>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Success State -->
|
||||
<div v-else>
|
||||
<div
|
||||
v-if="brandingStore.value.isDeleted"
|
||||
class="bg-red-500 p-2 m-4 text-center font-semibold"
|
||||
>
|
||||
{{ t('creator.layout.deletion.pending') }}
|
||||
</div>
|
||||
<actual-banner></actual-banner>
|
||||
@@ -34,9 +97,7 @@ onMounted(async () => {
|
||||
<router-view></router-view>
|
||||
<Footer></Footer>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
@@ -47,6 +108,17 @@ onMounted(async () => {
|
||||
"deletion": {
|
||||
"pending": "This creator page is pending deletion"
|
||||
}
|
||||
},
|
||||
"notFound": {
|
||||
"title": "Creator Not Found",
|
||||
"message": "The creator '{creator}' doesn't exist or may have been removed.",
|
||||
"goHome": "Go to Home",
|
||||
"goBack": "Go Back"
|
||||
},
|
||||
"error": {
|
||||
"title": "Something Went Wrong",
|
||||
"message": "We're having trouble loading this creator page. Please try again later.",
|
||||
"goHome": "Go to Home"
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -56,6 +128,17 @@ onMounted(async () => {
|
||||
"deletion": {
|
||||
"pending": "Cette page créateur est en attente de suppression"
|
||||
}
|
||||
},
|
||||
"notFound": {
|
||||
"title": "Créateur Introuvable",
|
||||
"message": "Le créateur '{creator}' n'existe pas ou a peut-être été supprimé.",
|
||||
"goHome": "Aller à l'accueil",
|
||||
"goBack": "Retour"
|
||||
},
|
||||
"error": {
|
||||
"title": "Quelque chose s'est mal passé",
|
||||
"message": "Nous avons des difficultés à charger cette page créateur. Veuillez réessayer plus tard.",
|
||||
"goHome": "Aller à l'accueil"
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -65,6 +148,17 @@ onMounted(async () => {
|
||||
"deletion": {
|
||||
"pending": "Esta página de creador está pendiente de eliminación"
|
||||
}
|
||||
},
|
||||
"notFound": {
|
||||
"title": "Creador No Encontrado",
|
||||
"message": "El creador '{creator}' no existe o puede haber sido eliminado.",
|
||||
"goHome": "Ir al Inicio",
|
||||
"goBack": "Volver"
|
||||
},
|
||||
"error": {
|
||||
"title": "Algo Salió Mal",
|
||||
"message": "Tenemos problemas para cargar esta página de creador. Por favor, inténtalo de nuevo más tarde.",
|
||||
"goHome": "Ir al Inicio"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user