neckfireandClaude Opus 4.8
4e11e97b14
Build & Deploy / build (push) Successful in 6s
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
85 lines
3.0 KiB
Vue
85 lines
3.0 KiB
Vue
<script setup lang="ts">
|
|
definePageMeta({ middleware: 'auth' })
|
|
const { t, locale, locales, setLocale } = useI18n()
|
|
const auth = useAuthStore()
|
|
const { isSupported, enable, disable, sendTest } = usePush()
|
|
const toast = useToast()
|
|
|
|
const pushOn = ref(auth.push.enabled)
|
|
const pushLoading = ref(false)
|
|
|
|
async function togglePush(val: boolean) {
|
|
pushLoading.value = true
|
|
try {
|
|
if (val) {
|
|
await enable(auth.push.vapid_public_key || '')
|
|
pushOn.value = true
|
|
toast.add({ title: 'Rappels activés 🔥', color: 'primary' })
|
|
} else {
|
|
await disable()
|
|
pushOn.value = false
|
|
}
|
|
} catch (e) {
|
|
pushOn.value = false
|
|
toast.add({ title: (e as Error).message || t('common.error'), color: 'error' })
|
|
} finally {
|
|
pushLoading.value = false
|
|
}
|
|
}
|
|
|
|
async function doLogout() {
|
|
await auth.logout()
|
|
await navigateTo('/login')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="space-y-6">
|
|
<div class="flex items-center gap-4">
|
|
<div class="size-16 rounded-full sf-flame-bg flex items-center justify-center text-white text-2xl font-black">
|
|
{{ auth.user?.name?.[0]?.toUpperCase() }}
|
|
</div>
|
|
<div>
|
|
<h1 class="text-xl font-black">{{ auth.user?.name }}</h1>
|
|
<p class="text-sm text-zinc-500">{{ auth.user?.email }}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<UCard v-if="auth.streak" :ui="{ body: 'p-4' }">
|
|
<div class="grid grid-cols-3 text-center">
|
|
<div><p class="text-2xl font-black sf-flame-text">{{ auth.streak.current }}</p><p class="text-xs text-zinc-500">{{ t('dashboard.streakDays') }}</p></div>
|
|
<div><p class="text-2xl font-black">{{ auth.streak.longest }}</p><p class="text-xs text-zinc-500">{{ t('dashboard.longest') }}</p></div>
|
|
<div><p class="text-2xl font-black text-sky-500">{{ auth.streak.freezes }}</p><p class="text-xs text-zinc-500">{{ t('dashboard.freezes') }}</p></div>
|
|
</div>
|
|
</UCard>
|
|
|
|
<div>
|
|
<p class="text-sm font-semibold text-zinc-500 mb-2">Langue</p>
|
|
<div class="flex gap-2">
|
|
<UButton
|
|
v-for="l in (locales as { code: string, name: string }[])"
|
|
:key="l.code"
|
|
:color="locale === l.code ? 'primary' : 'neutral'"
|
|
:variant="locale === l.code ? 'solid' : 'subtle'"
|
|
size="sm"
|
|
:label="l.name"
|
|
@click="setLocale(l.code as 'fr' | 'en' | 'pt-BR')"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<UCard v-if="isSupported()" :ui="{ body: 'p-4' }">
|
|
<div class="flex items-center justify-between gap-3">
|
|
<div>
|
|
<p class="font-semibold">Rappels de série 🔥</p>
|
|
<p class="text-xs text-zinc-500">Un rappel le soir si tu risques de perdre ta flamme.</p>
|
|
</div>
|
|
<USwitch v-model="pushOn" :loading="pushLoading" @update:model-value="togglePush" />
|
|
</div>
|
|
<UButton v-if="pushOn" size="xs" variant="link" color="neutral" class="mt-1 -ml-2" label="Envoyer un test" @click="sendTest" />
|
|
</UCard>
|
|
|
|
<UButton block color="neutral" variant="subtle" icon="i-lucide-log-out" :label="t('auth.logout')" @click="doLogout" />
|
|
</div>
|
|
</template>
|