As a developer building booking experiences, you’ll inevitably run into tradeoff decisions — especially when trying to schedule multiple appointments in one sitting. This isn’t just a technical problem — it’s a business one. Imagine a dad trying to book a 60-minute haircut for himself and 30-minute cuts for his two sons. If your client app doesn’t intelligently account for availability tradeoffs, the user could get frustrated, abandon the session, or settle for a disjointed experience (e.g., having to come back later or split appointments across different stylists or days).
This is where strategy comes into play. Do you prioritize the stylist (maybe the dad really wants @FadeMasterMike)? Or do you prioritize the day (maybe Saturday is the only day the kids are available)? Your app needs to guide the user through these choices gracefully, The good news: this API is flexible enough to handle both scenarios seamlessly. Below are two user experience pathways to consider:
The API is designed to support both approaches using the GetAvailabilityOutlookByDay endpoint.
Iterate across multiple dates, but keep the stylist the same until you find a day where there are at least 4 consecutive 30-minute slots (enough for 120 minutes).
// Stylist-First Approach: Loop through dates and gather all eligible time slots
const datesToCheck = ['2024-05-03', '2024-05-04', '2024-05-05'];
const stylist = '@FadeMasterMike';
async function findAllGapsByStylist() {
const allOptions = [];
for (let date of datesToCheck) {
const response = await fetch('https://your-proxy-prefix/stylist/getavailabilityoutlookbyday', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-RapidAPI-Key': 'your-rapidapi-key-here',
'X-Shop-Key': 'your-shop-key-here'
},
body: JSON.stringify({
StylistScreenName: stylist,
RequestedDate: date,
Gap: 120
})
});
const data = await response.json();
const eligibleSlots = data.filter(slot => slot.IsAvailable && slot.StartTimeEligible);
eligibleSlots.forEach(slot => {
allOptions.push({ date, stylist, time: slot.TimeSlot });
});
}
if (allOptions.length > 0) {
console.log('Eligible 120-min options found:', allOptions);
} else {
console.log('No 120-minute gap found for this stylist.');
}
}
findAllGapsByStylist();
Iterate through stylists, but keep the date the same until you find a stylist who has at least 4 consecutive 30-minute slots.
// Date-First Approach: Loop through stylists and gather all eligible time slots
const stylists = ['@FadeMasterMike', '@FreshCutzTina', '@BladeBossRay'];
const date = '2024-05-04';
async function findAllGapsByDate() {
const allOptions = [];
for (let stylist of stylists) {
const response = await fetch('https://your-proxy-prefix/stylist/getavailabilityoutlookbyday', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-RapidAPI-Key': 'your-rapidapi-key-here',
'X-Shop-Key': 'your-shop-key-here'
},
body: JSON.stringify({
StylistScreenName: stylist,
RequestedDate: date,
Gap: 120
})
});
const data = await response.json();
const eligibleSlots = data.filter(slot => slot.IsAvailable && slot.StartTimeEligible);
eligibleSlots.forEach(slot => {
allOptions.push({ stylist, date, time: slot.TimeSlot });
});
}
if (allOptions.length > 0) {
console.log('Eligible 120-min options found:', allOptions);
} else {
console.log('No 120-minute gap found on this day.');
}
}
findAllGapsByDate();
By offering both strategies, you give end-users the power to prioritize what matters most to them — stylist vs. date — while keeping the booking experience seamless and efficient. The API does the heavy lifting. You just have empower your customers into deciding how to proceed.