This commit is contained in:
2024-09-02 20:44:47 +02:00
parent c89638262f
commit 5d00a5a090
28 changed files with 160 additions and 2122 deletions

View File

@@ -30,7 +30,7 @@ const { canCreateTabInCategory } = await useUserLimits()
<UDropdown
:items="dropdownItems"
:popper="{ placement: 'bottom-end', arrow: true }"
:ui="{ width: 'w-40', shadow: 'shadow-xl' }"
:ui="{ container: 'group z-50', width: 'w-40', shadow: 'shadow-xl' }"
>
<UButton
color="white"

View File

@@ -69,7 +69,7 @@ function visitLink() {
<span class="animate-ping absolute inline-flex h-full w-full rounded-full opacity-75" :class="`bg-${tab.color}-400`" />
<span class="relative inline-flex rounded-full h-3 w-3" :class="`bg-${tab.color}-400`" />
</div>
<div class="flex items-center justify-between h-full">
<div class="flex items-center justify-between h-full z-20">
<div class="flex gap-4 items-center h-full">
<UBadge :color="tab.color" class="p-2" variant="soft">
<UIcon :name="tab.icon" size="32" />
@@ -83,7 +83,7 @@ function visitLink() {
<UDropdown
:items="items"
:popper="{ placement: 'bottom-end', arrow: true }"
:ui="{ container: 'z-50 group', width: 'w-40', shadow: 'shadow-2xl', wrapper: 'absolute inline-flex -top-3 -right-3' }"
:ui="{ container: 'z-40 group', width: 'w-40', shadow: 'shadow-2xl', wrapper: 'absolute inline-flex -top-3 -right-3' }"
>
<UButton
v-show="editMode"

View File

@@ -28,27 +28,18 @@ watchEffect(() => {
state.email = props.user.email
})
async function handleUpdate(event: FormSubmitEvent<UpdateUserSchemaType>) {
try {
await useRequestFetch()(`/api/users/me`, {
method: 'PUT',
body: JSON.stringify({
username: event.data.username,
name: event.data.name,
description: event.data.description,
location: event.data.location,
language: event.data.language,
private: event.data.private,
}),
})
useSuccessToast('Profile successfully updated!')
}
catch (error) {
useErrorToast('Profile update failed!', error as string)
}
}
const { deleteAvatar, uploadAvatar, updateUser } = await useUser()
const { deleteAvatar, uploadAvatar } = await useUser()
async function handleUpdate(event: FormSubmitEvent<UpdateUserSchemaType>) {
await updateUser({
username: event.data.username,
name: event.data.name,
description: event.data.description,
location: event.data.location,
language: event.data.language,
private: event.data.private,
})
}
</script>
<template>

View File

@@ -1,45 +0,0 @@
<script lang="ts" setup>
const config = useRuntimeConfig()
const coordinates = ref<[number, number]>([2.179040, 48.877419])
const zoom = ref(11)
</script>
<template>
<ClientOnly>
<UCard :ui="{ base: 'h-72 md:col-span-2', body: { padding: '' } }">
<div class="relative">
<MapboxMap
:options="{
accessToken: config.public.mapbox.accessToken,
style: config.public.mapbox.style,
center: coordinates,
zoom,
projection: 'globe',
}"
class="absolute h-72"
map-id="map"
>
<MapboxDefaultMarker
:lnglat="coordinates"
:options="{
color: '#808080',
size: 1.5,
}"
marker-id="marker"
/>
</MapboxMap>
</div>
</UCard>
</ClientOnly>
</template>
<style>
.mapboxgl-control-container {
display: none !important;
}
.mapboxgl-canvas {
border-radius: 1rem;
}
</style>

View File

@@ -1,34 +0,0 @@
<script lang="ts" setup>
import type { WeatherType } from '~~/types/types'
const { data: weather } = await useFetch<WeatherType>('/api/weather')
</script>
<template>
<section>
<UCard v-if="weather" :ui="{ base: 'h-full' }">
<template #header>
<div class="flex items-center gap-2 text-blue-600 dark:text-blue-300">
<UIcon name="i-ph:cloud-duotone" size="24" />
<h3 class="font-bold text-lg">
Météo
</h3>
</div>
</template>
<template #default>
<div class="flex items-center h-full">
<p class="text-lg h-full">
Il fait actuellement
<span class="text-blue-600 dark:text-blue-300">{{ weather.weather }}</span>
à
<span>{{ weather.city }}</span>,
avec une température de
<span class="text-blue-600 dark:text-blue-300">{{ weather.temp }}
</span>
°C
</p>
</div>
</template>
</UCard>
</section>
</template>

View File

@@ -14,7 +14,7 @@ export async function useCategories() {
await useSuccessToast('Category successfully created!', category.color)
}
catch (error) {
useErrorToast('Category creation failed!', error as string)
useErrorToast('Category creation failed!', String(error))
}
}
@@ -28,7 +28,7 @@ export async function useCategories() {
await useSuccessToast('Category successfully updated!')
}
catch (error) {
useErrorToast('Category update failed!', error as string)
useErrorToast('Category update failed!', String(error))
}
}
@@ -41,7 +41,7 @@ export async function useCategories() {
await useSuccessToast('Category successfully deleted!')
}
catch (error) {
useErrorToast('Category deletion failed!', error as string)
useErrorToast('Category deletion failed!', String(error))
}
}

View File

@@ -18,7 +18,7 @@ export async function useTabs() {
useSuccessToast('Tab successfully created!', tab.color)
}
catch (error) {
useErrorToast('Tab creation failed!', error as string)
useErrorToast('Tab creation failed!', String(error))
}
}
@@ -32,7 +32,7 @@ export async function useTabs() {
useSuccessToast('Tab successfully updated!')
}
catch (error) {
useErrorToast('Tab update failed!', error as string)
useErrorToast('Tab update failed!', String(error))
}
}
@@ -49,7 +49,7 @@ export async function useTabs() {
useSuccessToast(`Tab ${tab.name} ${primary ? 'set as favorite' : 'unset as favorite'}!`, 'yellow')
}
catch (error) {
useErrorToast('Cannot toggle favorite state for tab!', error as string)
useErrorToast('Cannot toggle favorite state for tab!', String(error))
}
}
@@ -62,7 +62,7 @@ export async function useTabs() {
useSuccessToast('Tab successfully deleted!')
}
catch (error) {
useErrorToast('Tab deletion failed!', error as string)
useErrorToast('Tab deletion failed!', String(error))
}
}

View File

@@ -10,12 +10,16 @@ export async function useUserLimits() {
function canCreateCategory() {
if (hasPaidPlan.value)
return true
if (!userLimits.value.categories)
return false
return userLimits.value.categories.length < MAX_CATEGORIES
}
function canCreateTabInCategory(categoryId: number): boolean {
if (hasPaidPlan.value)
return true
if (!userLimits.value.categories || !userLimits.value.categories.find(category => category.id === categoryId))
return false
return userLimits.value.categories.find(category => category.id === categoryId).tabs.length < MAX_TABS_PER_CATEGORY
}

View File

@@ -1,16 +1,16 @@
export async function useUser() {
const { fetch } = useUserSession()
const { fetch, session } = useUserSession()
async function deleteAvatar() {
try {
await useRequestFetch()('/api/users/avatars', {
await $fetch('/api/users/avatars', {
method: 'DELETE',
})
useSuccessToast('Avatar successfully deleted!')
await fetch()
}
catch (error) {
useErrorToast('An error occurred while deleting your avatar', error as string)
useErrorToast('An error occurred while deleting your avatar', String(error))
}
}
@@ -24,7 +24,7 @@ export async function useUser() {
formData.append('file', file)
try {
await useRequestFetch()('/api/users/avatars', {
await $fetch('/api/users/avatars', {
method: 'POST',
body: formData,
})
@@ -32,12 +32,29 @@ export async function useUser() {
useSuccessToast('Avatar successfully uploaded!')
}
catch (error) {
useErrorToast('An error occurred while uploading your avatar', error as string)
useErrorToast('An error occurred while uploading your avatar', String(error))
}
}
async function updateUser(user: Partial<UserInsert>) {
try {
await $fetch('/api/users/me', {
method: 'PATCH',
body: JSON.stringify(user),
})
console.log(session.value)
await fetch()
console.log(session.value)
useSuccessToast('User successfully updated!')
}
catch (error) {
useErrorToast('An error occurred while updating your user', String(error))
}
}
return {
deleteAvatar,
uploadAvatar,
updateUser,
}
}

View File

@@ -10,7 +10,7 @@ onMounted(() => {
setInterval(() => date.value = new Date(), 1000)
})
const { user } = await useUserSession()
const { user, loggedIn } = await useUserSession()
const { categories } = await useCategories()
const { getTabsForCategory } = await useTabs()
const { canCreateCategory } = await useUserLimits()
@@ -94,7 +94,7 @@ defineShortcuts({
</script>
<template>
<main v-if="user" class="my-12">
<main v-if="user && loggedIn" class="my-12">
<div v-if="date" class="flex flex-col items-center mb-12">
<h1 class="text-6xl md:text-9xl font-bold">
{{ useDateFormat(date, 'HH') }}