import { defineStore } from 'pinia';
import { ref } from 'vue';

export const useTarotStore = defineStore('tarot', () => {
    // State
    const freeDrawsRemaining = ref(1);

    // Actions
    function useFreeDraw() {
        if (freeDrawsRemaining.value > 0) {
            freeDrawsRemaining.value--;
            return true; // Indicates a free draw was used
        }
        return false; // No more free draws
    }

    // You would integrate Stripe here in a more advanced application
    // This is a placeholder for your payment logic.
    function unlockNewDraws() {
        // You would typically call a backend endpoint here to create a Stripe Checkout Session
        // and redirect the user. For this example, we'll simulate a successful payment.
        console.log('Redirecting to Stripe for payment...');
        return new Promise((resolve) => {
            setTimeout(() => {
                console.log('Payment successful! Adding 1 new draw.');
                // After successful payment from Stripe, you would update the state.
                // This state update would likely come from a backend webhook.
                freeDrawsRemaining.value++;
                resolve(true);
            }, 2000); // Simulate a network delay
        });
    }

    return {
        freeDrawsRemaining,
        useFreeDraw,
        unlockNewDraws,
    };
});