// Define an async function for fetching services async function fetchServices() { const apiUrl = 'https://eolx7kkrjvavif2.m.pipedream.net'; // Your Pipedream URL try { const response = await fetch(apiUrl, { method: 'POST', headers: { 'Content-Type': 'application/json', 'x-access-token': `${accessToken}`, }, body: JSON.stringify({ object_types: ['ITEM'], query: { exact_query: { attribute_name: 'product_type', attribute_value: 'APPOINTMENTS_SERVICE', }, }, }), }); const result = await response.json(); if (result && result.objects) { displayServices(result.objects); } else { document.getElementById('services-list').innerHTML = '

No services found.

'; } } catch (error) { console.error('Error fetching services:', error); document.getElementById('error-message').innerHTML = '❗️ Error loading services. Please try again later.'; } } // Run the async function after DOM is fully loaded document.addEventListener('DOMContentLoaded', async function () { await fetchServices(); // ✅ Fetch services after page load });