import {router, usePage} from '@inertiajs/vue3';
import type { Ref} from "vue";
import {computed} from "vue";
import {inject, provide} from "vue";

const SELECTED_YEAR_KEY = Symbol('selectedYear');

export function provideSelectedYear(fallback?: number | null) {
    const page = usePage();
    const year = computed<number>(() => {
        const fromUrl = Number(page.props.query?.related_year);
        return fromUrl > 0 ? fromUrl : Number(fallback ?? 0);
    });

    provide(SELECTED_YEAR_KEY, year);
    return year;
}

export function useSelectedYear(): Ref<number> {
    const year = inject<Ref<number>>(SELECTED_YEAR_KEY);
    if (!year) {
        throw new Error('useSelectedYear must be used within a component that calls provideSelectedYear');
    }
    return year;
}

export function navigateToYear(year: number) {
    const url = new URL(window.location.href);
    url.searchParams.set('related_year', String(year));
    router.visit(url.toString(), { preserveScroll: true });
}