Some cleanup
This commit is contained in:
@@ -8,13 +8,15 @@ import {useRouter} from 'vue-router';
|
|||||||
export const useCreatorProfileStore = defineStore(
|
export const useCreatorProfileStore = defineStore(
|
||||||
'creator-profile',
|
'creator-profile',
|
||||||
() => {
|
() => {
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => authStore.isAuthenticated,
|
() => authStore.isAuthenticated,
|
||||||
async (newValue) => {
|
async (newValue) => {
|
||||||
if (newValue) {
|
if (newValue) {
|
||||||
await fetchCurrentCreatorProfile();
|
await fetchCreatorProfile();
|
||||||
if (value.value === undefined) {
|
if (value.value === undefined) {
|
||||||
await router.push('/');
|
await router.push('/');
|
||||||
} else {
|
} else {
|
||||||
@@ -45,7 +47,7 @@ export const useCreatorProfileStore = defineStore(
|
|||||||
|
|
||||||
const client = useClient();
|
const client = useClient();
|
||||||
|
|
||||||
async function fetchCurrentCreatorProfile() {
|
async function fetchCreatorProfile() {
|
||||||
try {
|
try {
|
||||||
const response = await client.get(`/api/creators/profile`);
|
const response = await client.get(`/api/creators/profile`);
|
||||||
value.value = response.data;
|
value.value = response.data;
|
||||||
@@ -57,6 +59,6 @@ export const useCreatorProfileStore = defineStore(
|
|||||||
return {
|
return {
|
||||||
creator: value,
|
creator: value,
|
||||||
hasCreator,
|
hasCreator,
|
||||||
fetchCurrentCreatorProfile
|
fetchCreatorProfile
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
import {useClient} from '@/plugins/api.js';
|
import {useClient} from '@/plugins/api.js';
|
||||||
import {useBrandingStore} from '@/stores/brandingStore.js';
|
import {useBrandingStore} from '@/stores/brandingStore.js';
|
||||||
import DonationButtonBanner from '@/views/creators/DonationButtonBanner.vue';
|
import DonationButtonBanner from '@/views/creators/DonationButtonBanner.vue';
|
||||||
import {onBeforeUnmount, onMounted, ref} from 'vue';
|
import {onMounted, ref} from 'vue';
|
||||||
import CreatorLogo from "@/views/creators/CreatorLogo.vue";
|
import CreatorLogo from "@/views/creators/CreatorLogo.vue";
|
||||||
import NameTitle from "@/views/creators/NameTitle.vue";
|
import NameTitle from "@/views/creators/NameTitle.vue";
|
||||||
import Linkedin from "@/views/svg/Linkedin.vue";
|
import Linkedin from "@/views/svg/Linkedin.vue";
|
||||||
@@ -15,35 +15,12 @@ import Youtube from "@/views/svg/Youtube.vue";
|
|||||||
import Web from "@/views/svg/Web.vue";
|
import Web from "@/views/svg/Web.vue";
|
||||||
|
|
||||||
const brandingStore = useBrandingStore();
|
const brandingStore = useBrandingStore();
|
||||||
const isMobile = ref(false);
|
|
||||||
const creator = ref(null);
|
const creator = ref(null);
|
||||||
const baseURL = window.location.origin;
|
const baseURL = window.location.origin;
|
||||||
const creatorName = window.location.pathname.split('/@').pop();
|
const creatorName = window.location.pathname.split('/@').pop();
|
||||||
|
|
||||||
function updateIsMobile() {
|
|
||||||
isMobile.value = window.innerWidth <= 640;
|
|
||||||
}
|
|
||||||
|
|
||||||
const isSticky = ref(false);
|
|
||||||
const mainContainer = ref(null);
|
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
updateIsMobile();
|
|
||||||
window.addEventListener('resize', updateIsMobile);
|
|
||||||
|
|
||||||
const observer = new IntersectionObserver(
|
|
||||||
([entry]) => {
|
|
||||||
isSticky.value = !entry.isIntersecting;
|
|
||||||
},
|
|
||||||
{threshold: 0}
|
|
||||||
);
|
|
||||||
|
|
||||||
if (mainContainer.value) {
|
|
||||||
observer.observe(mainContainer.value);
|
|
||||||
}
|
|
||||||
|
|
||||||
const client = useClient();
|
const client = useClient();
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const creatorResponse = await client.get(`/api/creators/@${creatorName}`);
|
const creatorResponse = await client.get(`/api/creators/@${creatorName}`);
|
||||||
creator.value = creatorResponse.data;
|
creator.value = creatorResponse.data;
|
||||||
@@ -52,9 +29,6 @@ onMounted(async () => {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
|
||||||
window.removeEventListener('resize', updateIsMobile);
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -22,6 +22,7 @@ function handleCreatorNameReservationIdChanged($event) {
|
|||||||
creatorNameReservationId.value = $event.value
|
creatorNameReservationId.value = $event.value
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// TODO: The `fetchCreatorProfile` function should be private (push-up to the store)!
|
||||||
async function createAccount() {
|
async function createAccount() {
|
||||||
try {
|
try {
|
||||||
isOperationPending.value = true;
|
isOperationPending.value = true;
|
||||||
@@ -31,7 +32,7 @@ async function createAccount() {
|
|||||||
creatorId: userProfileStore.user.id,
|
creatorId: userProfileStore.user.id,
|
||||||
slugReservationId: creatorNameReservationId.value,
|
slugReservationId: creatorNameReservationId.value,
|
||||||
});
|
});
|
||||||
await creatorProfileStore.fetchCurrentCreatorProfile();
|
await creatorProfileStore.fetchCreatorProfile();
|
||||||
await router.push(`/@${creatorProfileStore.creator.name}`);
|
await router.push(`/@${creatorProfileStore.creator.name}`);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (error?.response?.data?.errors) {
|
if (error?.response?.data?.errors) {
|
||||||
|
|||||||
@@ -290,9 +290,6 @@ import {onMounted, ref} from "vue";
|
|||||||
import {useClient} from "@/plugins/api.js";
|
import {useClient} from "@/plugins/api.js";
|
||||||
import {useBrandingStore} from "@/stores/brandingStore.js";
|
import {useBrandingStore} from "@/stores/brandingStore.js";
|
||||||
import {useCreatorProfileStore} from "@/stores/creatorProfileStore.js";
|
import {useCreatorProfileStore} from "@/stores/creatorProfileStore.js";
|
||||||
import {useDisplay} from "vuetify";
|
|
||||||
|
|
||||||
const {smAndDown} = useDisplay();
|
|
||||||
|
|
||||||
const creatorProfileStore = useCreatorProfileStore();
|
const creatorProfileStore = useCreatorProfileStore();
|
||||||
const brandingStore = useBrandingStore();
|
const brandingStore = useBrandingStore();
|
||||||
@@ -302,9 +299,6 @@ const isLoading = ref(true);
|
|||||||
const isLoggedIn = true;
|
const isLoggedIn = true;
|
||||||
const isEditMode = ref(false);
|
const isEditMode = ref(false);
|
||||||
|
|
||||||
const currentImage = ref("");
|
|
||||||
const fullscreenImage = ref(null);
|
|
||||||
|
|
||||||
const fallbackImage = "/medias/emptyimage.png";
|
const fallbackImage = "/medias/emptyimage.png";
|
||||||
|
|
||||||
// Variables réactives pour les données
|
// Variables réactives pour les données
|
||||||
|
|||||||
Reference in New Issue
Block a user