arthur/website-old
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/website-old.git synced 2026-01-14 20:19:35 +01:00
Code Issues 31 Packages Projects Releases Wiki Activity

Fix useAsync

Browse Source
This commit is contained in:
Arthur Danjou
2021-08-17 16:22:21 +02:00
parent adb052d1de
commit ea2a007c9a
17 changed files with 102 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/AboutHome.vue
View File

@@ -1,5 +1,5 @@
<template>
<section v-if="info && info.age" class="w-full flex items-center justify-center my-12">
<section v-if="age" class="w-full flex items-center justify-center my-12">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="mb-12 md:mb-0 w-full md:w-1/2 flex justify-center">
<img src="~/assets/images/memojies/Hat.png" alt="It's me !" class="xl:w-1/2" />
@@ -9,7 +9,7 @@
{{ $t('home.about.title') }}
</h2>
<p class="text-xl my-6 text-gray-700 dark:text-gray-400">
{{ $t('home.about.description', {age: info.age}) }}
{{ $t('home.about.description', {age: age}) }}
</p>
<div class="flex justify-center md:justify-start">
<Button content="home.about.about" link="about"/>
@@ -26,17 +26,22 @@ import {InfoData} from "~/types/types";
export default defineComponent({
name: "AboutHome",
setup() {
const {$content, $sentry} = useContext()
const info = useAsync(() => {
return $content('infos')
.fetch<InfoData>()
.catch((error) => {
$sentry.captureEvent(error)
});
const {$axios, $sentry} = useContext()
const age = useAsync(async () => {
const response = await $axios.get('/api/informations', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
if (response.status === 200) {
return response.data.informations.age
} else {
$sentry.captureEvent(response.data)
}
}, 'infos')
return {
info
age
}
}
})

11
src/components/Announcement.vue
View File

@@ -24,23 +24,22 @@ export default {
name: "Announcement",
setup() {
const {$axios, $sentry} = useContext()
const announce = ref<Announce>()
useAsync(async () => {
const announce = useAsync(async () => {
const response = await $axios.get('/api/announces', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
if (response.status === 200) {
announce.value = response.data.announce
return response.data.announce
} else {
$sentry.captureEvent(response.data)
}
})
}, 'announce')
const getBackgroundColor = computed(() => {
switch (announce.value!.color) {
switch (announce.value.color) {
case 'black': {
return 'bg-black text-white dark:(bg-white text-black)'
}
@@ -48,7 +47,7 @@ export default {
})
const getHoverColor = computed(() => {
switch (announce.value!.hover_color) {
switch (announce.value.hover_color) {
case 'gray': {
return 'hover:bg-gray-800 dark:hover:bg-gray-300'
}

10
src/components/Footer.vue
View File

@@ -123,23 +123,19 @@ export default defineComponent({
const getDate = ref(new Date().getFullYear())
const hiring_message = ref("")
useAsync(async () => {
const hiring_message = useAsync(async () => {
const request = await $axios.get('/api/informations', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
if (request.status === 200) {
hiring_message.value = request.data.informations.translation.code
return request.data.informations.translation.code
} else {
app.error({statusCode: 500})
$sentry.captureEvent(request.data)
}
})
const store = useStore<State>()
const route = computed(() => store.state.route)
}, 'hiring_message')
return {
getDate,

2
src/components/FormationsAbout.vue
View File

@@ -31,7 +31,7 @@ export default defineComponent({
.catch((error) => {
$sentry.captureEvent(error)
})
})
}, 'formations')
return {
formations

2
src/components/Header.vue
View File

@@ -75,7 +75,7 @@ export default defineComponent({
window.removeEventListener('scroll', updateScroll)
})
const {i18n} = useContext()
const {i18n, } = useContext()
const $router = useRouter()
const changeLanguage = () => useAsync(() => {
i18n.setLocale(i18n.locale === 'fr' ? 'en' : 'fr')

4
src/components/MobileNavbar.vue
View File

@@ -30,6 +30,10 @@ import {State} from "~/types/types";
const PAGE_TYPE = {
projects: 1,
services: 2,
env: 3,
about: 4,
guestbook: 5
}
export default defineComponent({

2
src/components/SkillsAbout.vue
View File

@@ -31,7 +31,7 @@ export default defineComponent({
.catch((error) => {
$sentry.captureEvent(error)
})
})
}, 'skills')
return {
skills

31
src/components/icons/MenuIcon.vue
View File

@@ -16,6 +16,37 @@
<path d="M4 28l5.455 4l7.272-4L24 32l7.273-4l7.272 4L44 28" />
</g>
</svg>
<svg v-else-if="type === 2" class="inline" width="0.75em" height="2.5em" viewBox="0 0 3 16" focusable="false">
<path
fill-rule="evenodd"
d="M0 2.5a1.5 1.5 0 1 0 3 0a1.5 1.5 0 0 0-3 0zm0 5a1.5 1.5 0 1 0 3 0a1.5 1.5 0 0 0-3 0zM1.5 14a1.5 1.5 0 1 1 0-3a1.5 1.5 0 0 1 0 3z"
fill="currentColor" />
</svg>
<svg v-else-if="type === 3" class="inline" width="2.5em" height="2.5em" viewBox="0 0 24 24" focusable="false">
<g fill="none">
<path
d="M7 6a3 3 0 0 0-3 3h16a3 3 0 0 0-3-3H7z"
fill="currentColor" />
<path
d="M7 18a3 3 0 0 1-3-3h16a3 3 0 0 1-3 3H7z"
fill="currentColor" />
<path
d="M3 11a1 1 0 1 0 0 2h18a1 1 0 1 0 0-2H3z"
fill="currentColor" />
</g>
</svg>
<svg v-else-if="type === 4" class="inline" width="2.5em" height="2.5em" viewBox="0 0 24 24" focusable="false">
<g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M7.05 11.293l4.243-4.243a2 2 0 0 1 2.828 0l2.829 2.83a2 2 0 0 1 0 2.828l-4.243 4.243a2 2 0 0 1-2.828 0L7.05 14.12a2 2 0 0 1 0-2.828z" />
<path d="M16.243 9.172l3.086-.772a1.5 1.5 0 0 0 .697-2.516L17.81 3.667a1.5 1.5 0 0 0-2.44.47L14.122 7.05" />
<path d="M9.172 16.243L8.4 19.329a1.5 1.5 0 0 1-2.516.697L3.667 17.81a1.5 1.5 0 0 1 .47-2.44l2.913-1.248" />
</g>
</svg>
<svg v-else-if="type === 5" class="inline" width="2.5em" height="2.5em" viewBox="0 0 20 20" focusable="false">
<path
d="M9.584 6.036c1.952 0 2.591-1.381 1.839-2.843c-.871-1.693 1.895-3.155.521-3.155c-1.301 0-3.736 1.418-4.19 3.183c-.339 1.324.296 2.815 1.83 2.815zm5.212 8.951l-.444-.383a1.355 1.355 0 0 0-1.735 0l-.442.382a3.326 3.326 0 0 1-2.174.801a3.325 3.325 0 0 1-2.173-.8l-.444-.384a1.353 1.353 0 0 0-1.734.001l-.444.383c-1.193 1.028-2.967 1.056-4.204.1V19a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1v-3.912c-1.237.954-3.011.929-4.206-.101zM10 7c-7.574 0-9 3.361-9 5v.469l1.164 1.003a1.355 1.355 0 0 0 1.735 0l.444-.383a3.353 3.353 0 0 1 4.345 0l.444.384c.484.417 1.245.42 1.735-.001l.442-.382a3.352 3.352 0 0 1 4.346-.001l.444.383c.487.421 1.25.417 1.735 0L19 12.469V12c0-1.639-1.426-5-9-5z"
fill="currentColor"/>
</svg>
</div>
</template>

7
src/content/infos.json
View File

@@ -1,7 +0,0 @@
{
"age": 18,
"hiring": {
"status": "available",
"color": "green"
}
}

4
src/layouts/default.vue
View File

@@ -1,10 +1,10 @@
<template>
<div class="relative">
<SideMenu />
<div class="relative w-full overflow-hidden">
<div class="relative w-full overflow-hidden xl:overflow-visible">
<div
id="slider"
class="relative xl:static shadow-2xl overflow-hidden transform transition-all duration-500"
class="relative xl:static shadow-2xl transform transition-all duration-500 overflow-hidden xl:overflow-visible"
:class="{'rounded-lg xl:rounded-none scale-90 md:scale-70 lg:scale-60 xl:scale-100 translate-x-9/12 sm:translate-x-4/12 lg:translate-x-3/12 xl:translate-x-0': opened}"
:style="opened ? `max-height: ${height}px` : 'max-height: none'"
:tabindex="opened ? -1 : 0"

10
src/layouts/error.vue
View File

@@ -26,7 +26,7 @@
</div>
</div>
<div class="mt-12 mb-4 w-full text-center">
<div class="home-btn" @click="next">
<div class="home-btn" @click="back">
<div class="cursor-pointer w-full py-4 px-4 md:py-4 md:px-4 font-bold hover:(bg-indigo-600 text-white) duration-500 rounded">
<BackSpaceIcon class="arrow-img text-xl"/>
{{ $t('error.back') }}
@@ -48,10 +48,10 @@ export default defineComponent({
title: 'Error - Arthur Danjou'
},
setup() {
const router = useRouter()
const next = () => router.back()
return {next}
const back = () => useRouter().back()
return {
back
}
}
})
</script>

18
src/pages/blog/_slug.vue
View File

@@ -134,20 +134,20 @@ export default defineComponent({
})
const liked = ref($storage.getCookie(`${slug.value}`) !== undefined)
const likes = ref(0)
useAsync(() => {
$axios.get(`/api/posts/${slug.value}`, {
const likes = useAsync(async () => {
const response = await $axios.get(`/api/posts/${slug.value}`, {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
}).then((response) => {
likes.value = response.data.likes
}).catch((error) => {
$sentry.captureEvent(error)
app.error({statusCode: 500})
})
})
if (response.status === 200) {
return response.data.likes
} else {
$sentry.captureEvent(response.data)
app.error({statusCode: 500})
}
}, 'likes')
const handleLike = async () => {
if (liked.value) {

2
src/pages/blog/index.vue
View File

@@ -51,7 +51,7 @@ export default defineComponent({
.catch((error) => {
$sentry.captureEvent(error)
})
})
}, 'posts')
return {
posts,

33
src/pages/contact.vue
View File

@@ -5,7 +5,7 @@
<h1 class="font-bold text-gray-700 text-xl md:text-3xl my-4 dark:text-gray-400">
{{ $t('contact.why.title') }}
</h1>
<h3 class="text-xl md:text-xl">
<h3 class="text-lg">
{{ $t('contact.why.description') }}
</h3>
</section>
@@ -14,41 +14,10 @@
</template>
<script lang="ts">
import {computed, useAsync, useContext} from "@nuxtjs/composition-api";
import {InfoData} from "~/types/types";
export default {
name: "contact",
head: {
title: 'Contact - Arthur Danjou'
},
setup() {
const {$content, $sentry} = useContext()
const info = useAsync(() => {
return ($content('infos')
.fetch<InfoData>()
.catch((error) => {
$sentry.captureEvent(error)
})
)as Promise<InfoData>
})
const hiring_color = info && info.value?.hiring.color
const getColor = computed(() => {
switch (hiring_color) {
case 'green':
return `bg-green-200 text-green-700`
case 'red':
return `bg-red-200 text-red-700`
default:
return 'bg-green-200 text-green-700'
}
})
return {
info,
getColor,
}
}
}
</script>

23
src/pages/guestbook.vue
View File

@@ -20,7 +20,8 @@
</template>
<script lang="ts">
import {defineComponent, ref, useAsync, useContext} from "@nuxtjs/composition-api";
import {defineComponent, useAsync, useContext} from "@nuxtjs/composition-api";
import GuestbookMessage from "@/components/GuestbookMessage.vue";
export default defineComponent({
name: "guestbook",
@@ -31,22 +32,20 @@ export default defineComponent({
},
setup() {
const { $axios, $sentry, app } = useContext()
const guestbook_messages = ref([])
useAsync(async () => {
await $axios.get('/api/guestbook', {
const guestbook_messages = useAsync<typeof GuestbookMessage[]>(async () => {
const response = await $axios.get('/api/guestbook', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`
}
})
.then(response => {
guestbook_messages.value = response.data.guestbook_messages
})
.catch(error => {
app.error({statusCode: 500})
$sentry.captureEvent(error)
})
})
if (response.status === 200) {
return response.data.guestbook_messages
} else {
app.error({statusCode: 500})
$sentry.captureEvent(response.data)
}
}, 'guestbook_messages')
return {
guestbook_messages

24
src/pages/newsletter.vue
View File

@@ -42,7 +42,7 @@
</div>
</div>
</div>
<p class="text-sm text-gray-700 dark:text-gray-300">{{ $t('newsletter.count', { count: subscribersCount }) }}</p>
<p class="text-sm text-gray-700 dark:text-gray-300">{{ $t('newsletter.count', { count: subscribers }) }}</p>
<p class="text-sm text-gray-700 dark:text-gray-300">{{ $t('newsletter.infos') }} <strong>{{ $t('newsletter.no_spam') }}</strong></p>
</section>
</main>
@@ -61,22 +61,20 @@ export default defineComponent({
},
setup() {
const { $axios, $sentry, app } = useContext()
const subscribersCount = ref(0)
useAsync(() => {
$axios.get('/api/subscribers', {
const subscribers = useAsync(async () => {
const response = await $axios.get('/api/subscribers', {
headers: {
'Authorization': `Bearer ${process.env.API_TOKEN}`,
}
}).then((response) => {
if (response.status === 200) {
subscribersCount.value = response.data.count
}
}).catch((error) => {
$sentry.captureEvent(error)
app.error({statusCode: 500})
})
})
if (response.status === 200) {
return response.data.count
} else {
$sentry.captureEvent(response.data)
app.error({statusCode: 500})
}
}, 'subscribers')
const error = ref(false)
const success = ref(false)
@@ -110,7 +108,7 @@ export default defineComponent({
}
return {
subscribersCount,
subscribers,
error,
success,
form,

2
src/pages/projects.vue
View File

@@ -41,7 +41,7 @@ export default defineComponent({
.catch((error) => {
$sentry.captureEvent(error)
})
})
}, 'projects')
return {
projects