// Customer-facing Javascript and Alpine helper hooks
document.addEventListener('alpine:init', () => {
    // Global Toast Notification System State & Actions
    Alpine.data('toastContainer', () => ({
        toasts: [],
        addToast(detail) {
            let message = '';
            let type = 'success'; // success, error, info, warning

            if (typeof detail === 'string') {
                message = detail;
            } else if (Array.isArray(detail)) {
                const data = detail[0] || {};
                message = data.message || '';
                type = data.type || 'success';
            } else if (detail && typeof detail === 'object') {
                message = detail.message || '';
                type = detail.type || 'success';
            }

            if (!message) return;

            const id = Date.now() + Math.random();
            this.toasts.push({
                id,
                message,
                type,
                visible: true
            });

            // Automatically dismiss after 4 seconds
            setTimeout(() => {
                this.removeToast(id);
            }, 4000);
        },
        removeToast(id) {
            const toast = this.toasts.find(t => t.id === id);
            if (toast) {
                toast.visible = false;
                // Allow exit animation to finish before removing from array
                setTimeout(() => {
                    this.toasts = this.toasts.filter(t => t.id !== id);
                }, 300);
            }
        }
    }));
});
