import {useClient} from '@/plugins/api.js';
import {useAuthStore} from '@/stores/authStore.js';
import {useSessionStorage} from '@vueuse/core';
import {defineStore} from 'pinia';
import {computed, watch} from 'vue';
import {useRouter} from 'vue-router';

export const useCreatorProfileStore = defineStore(
    'creator-profile',
    () => {
        const router = useRouter();
        const authStore = useAuthStore();
        watch(
            () => authStore.isAuthenticated,
            async (newValue) => {
                if (newValue) {
                    await fetchCurrentCreatorProfile();
                    if (value.value === undefined) {
                        await router.push('/');
                    } else {
                        await router.push(`/@${value.value.name}`);
                    }
                } else {
                    value.value = undefined;
                }
            }
        );

        const value = useSessionStorage(
            'creator-profile',
            {},
            {writeDefaults: false}
        );

        const hasCreator = computed(
            () => value.value && Object.getOwnPropertyNames(value.value).length >= 1
        );

        const client = useClient();

        async function fetchCurrentCreatorProfile() {
            try {
                const creatorResponse = await client.get(`/api/creators/profile`);
                value.value = creatorResponse.data;
            } catch (error) {
                value.value = undefined;
            }
        }

        return {
            creator: value,
            hasCreator,
            fetchCurrentCreatorProfile
        };
    });