import React, { useState } from ‘react’;
import { Search, Phone, DollarSign, Car, MessageSquare, CheckSquare, Calculator, Copy, Check } from ‘lucide-react’;
const DispatcherApp = () => {
const [activeTab, setActiveTab] = useState(‘templates’);
const [searchTerm, setSearchTerm] = useState(”);
const [copiedIndex, setCopiedIndex] = useState(null);
const [selectedVehicle, setSelectedVehicle] = useState(”);
const [selectedPackage, setSelectedPackage] = useState(”);
const [addOns, setAddOns] = useState({});
const copyToClipboard = (text, index) => {
navigator.clipboard.writeText(text);
setCopiedIndex(index);
setTimeout(() => setCopiedIndex(null), 2000);
};
const templates = [
{
category: “Upsells”,
items: [
{
name: “Ceramic Sealant Upgrade”,
text: “Hi, this is [YOUR NAME] with Mint Mobile Detail. Thanks for booking with us! Your technician has recommended applying a ceramic sealant to your vehicle. A ceramic sealant will give your vehicle the ability to repel dirt and rain. Additionally, it offers better protection and lasts 3x longer than wax. To have the ceramic sealant applied is $30. You can let us know here if you’d like to have this protection applied to the vehicle and we can notify your technician.”
},
{
name: “Hot Mess”,
text: “This is [YOUR NAME] at Mint Mobile Detail. Thanks for booking with us! Our tech has notified us that there is a decent amount of dirt and grime in the vehicle. We wanted to check in to see if you’d like to add our \”hot mess\” service ($35) to the vehicle. It allows for our technicians to spend the time required on hard to clean interiors. You can let me know here if you’d like to add on the \”hot mess\” service, and I’ll communicate that to your techs accordingly. Thank you.”
},
{
name: “It’s Wrecked”,
text: “Good morning, this is [YOUR NAME] with Mint Mobile Detail. Our tech has notified us that there is a decent amount of dirt and grime in the vehicle. We wanted to check in to see if you’d like to add our \”it’s wrecked\” service ($60) to the vehicle. It allows for our technicians to spend the time required on hard to clean interiors/exteriors. Ensuring your leathers, plastics, and carpeting are as clean as we can possibly get them looking. You can let us know here if you’d like to have the \”it’s wrecked\” service applied to the vehicle and we can notify your technician. Thanks.”
},
{
name: “Pet Hair”,
text: “This is [YOUR NAME] at Mint Mobile Detail. Thanks for booking with us! Our tech has notified us that there is a decent amount of dog hair in the vehicle. We wanted to check in to see if you’d like to add pet hair removal to your service order. Without the add on, we will still vacuum your car, but it likely will not remove all the pet hair. We charge an additional $35 for pet hair removal to account for the additional time and tools needed to remove it. You can let me know here if you’d like to add on the pet hair removal service, and I’ll communicate that to your tech accordingly. Thank you!”
},
{
name: “Child’s Car Seat”,
text: “This is [YOUR NAME] at Mint Mobile Detail. Thanks for booking with us! Our tech has recommended a child’s car seat cleaning. Would you like to add a child’s car seat detail for $30? We only use hot water and a vacuum—no chemicals—so it’s safe and gentle for your little one.”
},
{
name: “Trim Restore Pitch”,
text: “This is [YOUR NAME] at Mint Mobile Detail. Thanks for booking with us! Our tech has notified us that there is severe UV damage and oxidation on the trim of your vehicle. To have this fixed would be a trim restoration service. We do not use a dye to mask them and use a real carbon material to restore your exterior plastics and because of this we do provide an 18 month no fade guarantee. To have this applied to your vehicle would be $120. You can let me know here if you’d like to add on the trim restoration service, and I’ll communicate that to your techs accordingly. Thank you!”
},
{
name: “Headlight Restoration”,
text: “Hi, Thank you for choosing Mint Mobile Detail. Our technician has notified us that your headlights need restoring. Having a clear headlight lens can dramatically improve your driving visibility and enhance the appearance of your vehicle. We offer Ceramic Headlight Restoration that will keep your headlights clear for up to 5 years guaranteed. Our headlight restoration is $80 for both headlights and your fog lights. If you would like to add this service to your visit, you can let me know here and I will notify your technicians. Thank you.”
}
]
},
{
category: “Scheduling & Timing”,
items: [
{
name: “Arriving Early”,
text: “This is [YOUR NAME] at Mint Mobile Detail. I am messaging to let you know our technicians are running slightly ahead of schedule today. I wanted to be sure we kept in communication with you. Their current estimated time of arrival is [TIME]. Would it be ok for them to head your way early? Thanks”
},
{
name: “Arriving Late”,
text: “This is [YOUR NAME] at Mint Mobile Detail. I wanted to update you that our technicians are running slightly behind schedule today. We sincerely apologize for any inconvenience and appreciate your patience. Their current estimated time of arrival is [TIME]. Thank you!”
},
{
name: “Rain Reschedule”,
text: “Hi this is [YOUR NAME] at Mint Mobile Detail. I am reaching out to let you know that we will need to reschedule your service visit today due to the rain forecast. It looks like it is expected to rain during your detail appointment. We do have availability [INSERT DATES/TIMES].”
}
]
},
{
category: “Vehicle Issues”,
items: [
{
name: “Upgrade Vehicle Size”,
text: “Thanks for booking with us! We noticed that you booked this service as a [BOOKED SIZE], but a [VEHICLE MODEL] is classified by the manufacturer as a [CORRECT SIZE]. We will need to correct the invoice from a [BOOKED SIZE] to a [CORRECT SIZE] to account for the additional time it takes on a larger vehicle. Let me know if you have any questions or concerns. We look forward to your detailing appointment.”
},
{
name: “Tesla Model X”,
text: “We noticed that you booked this service for your Tesla model X. I wanted to reach out to let you know that this specific model requires additional time to clean the extra large LCD screens and vegan leather. We want to make sure we’re doing the best work possible for your make and model and as such will apply an additional $70 fee to your service order to make sure your technician has enough allotted time to work on your vehicle. Please let me know if you would like to keep your appointment and have this fee added on.”
},
{
name: “Outside Service Area”,
text: “Thanks so much for booking with us at Mint Mobile Detail. I noticed that you are booking from [LOCATION]. Unfortunately this is outside of our service area. We would be happy to service your vehicle, but I wanted to let you know that there will be an additional travel fee of $[AMOUNT]. Please let me know if you would like me to add this service fee and keep the appointment as scheduled.”
},
{
name: “Item Removal Fee”,
text: “This is [YOUR NAME] at Mint Mobile Detail. I am reaching out, because our technician notified us that there are a number of personal items still in the vehicle. Because this requires the technicians take additional time to remove the items, we charge a $15 fee for removal of personal items such as these. I wanted to let you know that I have added this to your service order. Thank you!”
}
]
},
{
category: “Quote Requests”,
items: [
{
name: “Scratch Removal Request”,
text: “Thank you for choosing Mint Mobile Detail. When you have a moment can you text photos of the scratch(s) you would like addressed, so that we can give you an accurate quote for their removal? Thanks!”
},
{
name: “Trim Restore Request”,
text: “Hi, Thank you for choosing Mint Mobile Detail. We are looking forward to detailing your vehicle. I see that in addition to the detail you would like us to restore the exterior plastic trim. So that we provide you with an accurate quote, can you text a few photos of your vehicle to us? Once we get those photos, we can review the condition of the trim and will provide you with an accurate quote for the restoration. Thank you.”
},
{
name: “Mold Removal Request”,
text: “Hi, Thanks for booking with Mint Mobile Detail. When you have a moment, please send photos of all the moldy areas you would like to have addressed. Once we have reviewed the photos, we will text you with an accurate quote for the Mold removal. Thank you.”
}
]
},
{
category: “Customer Service”,
items: [
{
name: “Review Request”,
text: “As a small company, we value your business. If you enjoyed your service with Mint Mobile Detail, please leave a 5-star review on Google by clicking the link below or in your local neighborhood Facebook group. Thanks! https://bit.ly/3OG3QvQ”
},
{
name: “Tipping Question”,
text: “Most of our customers choose to leave around a 20% tip, but feel free to give whatever amount feels right to you—we appreciate it all!”
},
{
name: “Forgot to Respond”,
text: “Hey [NAME], It looks like your last response was missed. My apologies for that oversight. I can get you scheduled for our next available appointment for [DATE/TIME]. Please let me know what date and time works best for you?”
},
{
name: “Apology for Late”,
text: “Absolutely. I will make a note on your profile about your preference, and I apologize again that we are slightly outside of our arrival window. This is not typical for us, and we will be sure to get you taken care of efficiently today! Please also accept $15 off your next detail appointment on us for the inconvenience today. You can use code NEW15 next time you book with us online.”
}
]
}
];
const dailyChecklist = [
“Look through all jobs – check clients with mold, trim or scratches have been texted”,
“Respond to new calls, texts or emails”,
“Check technician texts in Group Me”,
“Review new jobs from last shift – check for photos needed”,
“Follow up on old starred emails”,
“Reply to and record Google reviews”
];
const phoneScript = [
“Thanks for calling Mint Mobile Detailing, this is [Your Name]. How can I help you today?”,
“Just in case we get disconnected, can I get your name and the best phone number to reach you?”,
“To help get you an accurate quote can you please share the year, make, and model of the vehicle?”,
“To make sure we recommend the right service, do you think the vehicle needs a hot water shampoo for the carpets or seats? And would you like wax applied to the exterior after the detail?”,
“Based on what you’ve described, I’d recommend our Deluxe Package. It includes hot water shampoo, clay bar treatment, and wax, and it’s our most popular option for a deep clean inside and out. For your vehicle, that would come to $____. We have availability later this week. Would a morning or afternoon appointment work better for you?”,
“What’s the address where the vehicle will be located at the time of the detail?”,
“Great, you’re all scheduled. Can I also get your email address so we can send the invoice once the detail is complete?”,
“You’ll receive a confirmation text shortly. On the day of the detail, your technician will text you when they’re on their way. Once it’s complete, you’ll receive the invoice by text and email, and you can pay and tip online using any major debit or credit card.”,
“Before we go, are there any other questions I can help you with today?”,
“Thanks so much for choosing Mint Mobile Detailing!”
];
const vehicleSizes = {
sedans: {
name: “Sedans”,
examples: “Toyota Camry, Honda Accord, Nissan Altima, Hyundai Sonata, Kia K5, Chevrolet Malibu, Ford Fusion, BMW 3 Series, Mercedes-Benz C-Class”
},
compactSUV: {
name: “Compact/Mid-Size SUVs”,
examples: “Toyota RAV4, Honda CR-V, Nissan Rogue, Hyundai Tucson, Kia Sportage, Mazda CX-5, Ford Escape, Subaru Forester, Jeep Cherokee, Toyota Highlander, Honda Pilot, Ford Explorer, Nissan Pathfinder, Hyundai Palisade, Jeep Grand Cherokee, Volkswagen Atlas”
},
largeSUV: {
name: “Large/XL SUVs (3rd Row)”,
examples: “Kia Telluride, Hyundai Palisade, Honda Pilot, Toyota Highlander, Ford Explorer, Chevrolet Traverse, Subaru Ascent, Volkswagen Atlas, Mazda CX-90, Tesla Model X, Chevrolet Suburban, Tahoe, Ford Expedition Max, GMC Yukon, Cadillac Escalade, Toyota Sequoia, Nissan Armada, Jeep Grand Wagoneer”
},
xlVehicles: {
name: “Other XL Vehicles (Full-Size SUVs & Vans)”,
examples: “Chevrolet Tahoe, Chevrolet Suburban, Ford Expedition, GMC Yukon, GMC Yukon XL, Toyota Sequoia, Nissan Armada, Chrysler Pacifica (minivan), Honda Odyssey (minivan)”
}
};
const pricing = {
deluxe: {
car: 249.99,
suvTruck: 299.99,
xl: 349.99
},
interiorOnly: {
car: 159.99,
suvTruck: 189.99,
xl: 239.99
},
exteriorOnly: {
car: 129.99,
suvTruck: 169.99,
xl: 219.99
},
exteriorSuperior: {
car: 229.99,
suvTruck: 309.99,
xl: 369.99
},
essentials: {
car: 159.99,
suvTruck: 199.99,
xl: 249.99
},
addOns: {
petHair: 35,
hotMess: 35,
childSeat: 30,
ceramicSealant: 30,
itsWrecked: 60,
headlightRestoration: 80,
itemRemoval: 15,
essentialCeramic: 45
}
};
const calculateTotal = () => {
if (!selectedPackage || !selectedVehicle) return 0;
let base = pricing[selectedPackage]?.[selectedVehicle] || 0;
let addOnTotal = Object.entries(addOns)
.filter(([_, selected]) => selected)
.reduce((sum, [addon]) => sum + (pricing.addOns[addon] || 0), 0);
return base + addOnTotal;
};
const filteredTemplates = templates.map(category => ({
…category,
items: category.items.filter(item =>
item.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
item.text.toLowerCase().includes(searchTerm.toLowerCase())
)
})).filter(category => category.items.length > 0);
return (
The Telluride is 6 inches wider, 7.5 inches taller, and 30 inches longer than your average compact SUV.
It has a large touch screen, synthetic leather seats, and perforated seats which make it more time consuming to detail properly.
Always classify as Large/XL SUV.
