import {reactive} from "vue";

class ShoppingCart {
    constructor() {
        this.items = reactive([]);
        this.storageKey = 'shoppingCart';
        this.storage = Telegram.WebApp.DeviceStorage;

        this._load()
            .then(items => {
                this.items = items;
                console.log(items);
            })
            .catch(error => console.log(error));
    }

    async addItem(productId, productName, quantity, options = {}) {
        this.items.push({ productId: productId, productName: productName, quantity, options });
        this._save(this.items);
    }

    has(productId) {
        const item = this.getItem(productId);
        console.log(item);
        return this.getItem(productId) !== null;
    }

    getItem(productId) {
        return this.items.find(item => item.productId === productId) ?? null;
    }

    getItems() {
        return this.items;
    }

    clear() {
        this.storage.deleteItem(this.storageKey)
    }

    async _load() {
        return new Promise((resolve, reject) => {
            this.storage.getItem(this.storageKey, (error, value) => {
                if (error) {
                    console.error(error);
                    reject([]);
                }

                try {
                    resolve(value ? JSON.parse(value) : []);
                } catch (error) {
                    console.error(error);
                    reject([]);
                }
            });
        });
    }

    _save(items) {
        this.storage.setItem(this.storageKey, JSON.stringify(items));
    }
}

export default ShoppingCart;
