Refactor frontend components and enhance API integration
- Updated frontend-nuxt.mdc to specify usage of composables for API calls. - Added new AuthCard and ConfirmModal components for improved UI consistency. - Introduced UserAvatar component for user profile display, replacing previous Gravatar implementation. - Implemented useFormSubmit composable for handling form submissions with loading and error states. - Enhanced vitest.config.ts to include coverage reporting for composables and components. - Removed deprecated useAdminApi and useAuth composables to streamline API interactions. - Updated login and setup pages to utilize new components and composables for better user experience.
This commit is contained in:
@@ -16,23 +16,7 @@
|
||||
</template>
|
||||
<template v-else-if="me">
|
||||
<div class="flex flex-wrap items-center gap-4">
|
||||
<div class="avatar">
|
||||
<div class="rounded-full w-14 h-14 overflow-hidden flex items-center justify-center">
|
||||
<img
|
||||
v-if="me.email && !gravatarError"
|
||||
:src="useGravatarUrl(me.email, 80)"
|
||||
alt=""
|
||||
class="w-full h-full object-cover"
|
||||
@error="gravatarError = true"
|
||||
>
|
||||
<div
|
||||
v-else
|
||||
class="bg-primary text-primary-content rounded-full w-14 h-14 flex items-center justify-center"
|
||||
>
|
||||
<span class="text-2xl font-semibold">{{ (me.username || '?')[0].toUpperCase() }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<UserAvatar :username="me.username" :email="me.email" :size="56" />
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-lg font-semibold">{{ me.username }}</h2>
|
||||
<div class="flex flex-wrap gap-1.5">
|
||||
@@ -159,7 +143,6 @@ const passMsg = ref('')
|
||||
const passOk = ref(false)
|
||||
const tokenError = ref('')
|
||||
const copiedToken = ref<string | null>(null)
|
||||
const gravatarError = ref(false)
|
||||
const emailEditing = ref(false)
|
||||
const emailEdit = ref('')
|
||||
const loadingEmail = ref(false)
|
||||
@@ -185,7 +168,6 @@ async function saveEmail() {
|
||||
const data = await api.me()
|
||||
me.value = data
|
||||
emailEditing.value = false
|
||||
gravatarError.value = false
|
||||
toast.success('Email updated')
|
||||
} catch (e: unknown) {
|
||||
emailError.value = e instanceof Error ? e.message : 'Failed to update email'
|
||||
|
||||
Reference in New Issue
Block a user