"use client";
import React, { useState, useEffect, useRef } from "react";
import Link from "next/link";
import { useDispatch } from "react-redux";
import { setDemo } from "@/store/slices/uiSlice";
import { TestimonialsSection } from "@/components/testimonials";
import HomeTrusted from "@/components/sections/home/HomeTrusted";
import HomeAskAi from "@/components/sections/home/HomeAskAi";
// Shared Data
const CLIENTS = [
"Apex Retail",
"NovaBank",
"MediCare+",
"ShopKart",
"EduPrime",
"SwiftLogix",
"FinEdge",
"CareWell",
"UrbanMart",
"BlueOrbit",
"PayNest",
"GreenLeaf",
"TechVault",
"Zenith Pay",
"CityHealth",
"RetailOne",
"Hexa Tours",
"Brightline",
"SafeFin",
"QuickServe",
];
const FAQS = [
{
q: "How can WhatsApp API improve customer communication in logistics?",
a: "WhatsApp API turns tracking into a conversation. Textspeed sends booking confirmations, pickup alerts, live tracking links, rider ETAs and delivery OTPs on WhatsApp API, and a chatbot answers 'where is my order?', address changes, reschedules and return requests instantly — which typically removes a large share of WISMO calls from your support queue.",
},
{
q: "What is RCS and how does it benefit the logistics industry?",
a: "RCS adds rich media to the default Android inbox. Shipment updates carry your logo, a verified blue tick, parcel images, maps and one-tap buttons like Track, Reschedule or Change Address. You can also share invoices, PODs and e-way bills directly, and because the sender is verified, customers are far less likely to fall for tracking-link phishing.",
},
{
q: "How does SMS help logistics operations?",
a: "SMS is the channel that always lands — on any handset, on any network, in any pin code. Textspeed uses it for delivery and return OTPs, secure 2FA on refunds, domestic and international shipment status alerts, and post-delivery feedback surveys. Transactional logistics alerts reach even DND numbers.",
},
{
q: "How do voice and IVR solutions help in logistics?",
a: "Voice saves the delivery. An IVR line lets consignees call and hear live shipment status; automated press-1 calls confirm COD orders and reschedule failed deliveries; and number masking lets riders and customers speak without exposing personal numbers. Voice reminders also work in 22+ Indian languages via text-to-speech.",
},
{
q: "How does Textspeed reduce RTO and failed deliveries?",
a: "Two ways. Before dispatch, every COD consignment gets a press-1 confirmation call plus a digital payment link, so unconfirmed orders never leave the hub. After a failed attempt, an NDR sequence fires automatically — WhatsApp API, then SMS, then a voice call — asking the customer to pick a new slot or correct the address, and pushes the reattempt straight back into your TMS.",
},
{
q: "Can Textspeed integrate with our TMS, WMS or logistics management system?",
a: "Yes. Textspeed connects to transport management systems, warehouse management systems, ERPs, courier aggregators, fleet/GPS platforms, e-commerce stores and CRMs through REST APIs and webhooks. Booking, scan, out-for-delivery, NDR and POD events trigger the right message automatically, in real time.",
},
{
q: "Do you offer custom API development for logistics businesses?",
a: "Yes. Our REST APIs, SMPP binds and delivery callbacks are built for high-throughput logistics traffic, and our team builds custom workflows around your scan codes, exception types and escalation rules — whether you run a single hub or a national network.",
},
{
q: "Can the platform handle festive-season and sale-day volume spikes?",
a: "Yes. High-TPS SMPP connectivity, multi-operator smart routing and automatic failover are built for burst traffic, backed by a 99.9% uptime SLA — so tracking alerts and delivery OTPs keep flowing on your busiest days.",
},
{
q: "What happens if a tracking alert or delivery OTP cannot be delivered?",
a: "Smart fallback takes over. The message cascades automatically from WhatsApp API to RCS, then SMS, then a voice call, then email, through a single API call with retry windows you control. You are billed only for the channels actually attempted, and every hop appears in one unified delivery log.",
},
{
q: "Are your logistics messaging solutions secure and compliant?",
a: "Yes. Textspeed is DLT-registered and TRAI-compliant, data is encrypted in transit and at rest, delivery OTPs and 2FA run on a secure priority route, and verified sender identities on WhatsApp API and RCS protect your customers from parcel-scam phishing. Every message is logged with a full audit trail.",
},
];
const AI = [
{
name: "ChatGPT",
desc: "Ask OpenAI's ChatGPT about Textspeed.",
href: "https://chatgpt.com/?q=",
icon: ,
},
{
name: "Claude",
desc: "Ask Anthropic's Claude about Textspeed.",
href: "https://claude.ai/new?q=",
icon: (
),
},
{
name: "Gemini",
desc: "Ask Google's Gemini about Textspeed.",
href: "https://gemini.google.com/app",
icon: (
),
},
{
name: "Perplexity",
desc: "Ask Perplexity about Textspeed.",
href: "https://www.perplexity.ai/search?q=",
icon: (
),
},
{
name: "Grok",
desc: "Ask xAI's Grok about Textspeed.",
href: "https://grok.com/?q=",
icon: (
),
},
];
const AI_Q =
"Is Textspeed a good messaging platform for logistics and courier companies in India — shipment tracking alerts, delivery OTP SMS, WhatsApp API updates, NDR automation, COD confirmation IVR and TMS integration?";
export default function LogisticsPage() {
const dispatch = useDispatch();
// 1. Live Consignment Tracker (Hero Section)
const [trackerStep, setTrackerStep] = useState(0);
const heroStepsRef = useRef(null);
const trackerMsgs = [
{
c: "WhatsApp API",
t: "Booking confirmed ✅ AWB 7841 2290 5518 · pickup scheduled today between 11 AM – 2 PM.",
},
{
c: "SMS",
t: "Your parcel has been picked up from Ambattur. Track live: tsp.in/t/78412290",
},
{
c: "RCS",
t: "In transit 🚚 Your shipment reached the Bengaluru sorting centre. Expected delivery: tomorrow by 6 PM.",
},
{
c: "WhatsApp API + Voice",
t: "Out for delivery 📦 Rider Suresh K will arrive by 2 PM. Share OTP 4821 at handover.",
},
{
c: "SMS + Email",
t: "Delivered ✅ OTP verified at 14:32. Proof of delivery emailed. How was the experience? ⭐",
},
];
useEffect(() => {
let timer = null;
const tick = () => {
setTrackerStep((prev) => (prev + 1) % 5);
};
if ("IntersectionObserver" in window && heroStepsRef.current) {
const observer = new IntersectionObserver(
(entries) => {
entries.forEach((e) => {
if (e.isIntersecting) {
if (!timer) timer = setInterval(tick, 2600);
} else {
if (timer) {
clearInterval(timer);
timer = null;
}
}
});
},
{ threshold: 0.2 },
);
observer.observe(heroStepsRef.current);
return () => {
observer.disconnect();
if (timer) clearInterval(timer);
};
} else {
timer = setInterval(tick, 2600);
return () => clearInterval(timer);
}
}, []);
// 2. Consignment Journey Timeline (Horizontal Rail)
const [journeyStep, setJourneyStep] = useState(0);
const journeyRailRef = useRef(null);
const [journeyPaused, setJourneyPaused] = useState(false);
const J = [
{
n: "Booking",
ic: (
),
h: "Order booked & pickup scheduled",
p: "The moment a shipment is created in your TMS, the consignee gets an AWB, a pickup window and a live tracking link — before a single call is made.",
ch: "WhatsApp API",
tm: "09:12",
m: "Booking confirmed ✅ AWB 7841 2290 5518
Pickup: today, 11 AM – 2 PM. Track your parcel anytime.",
b: ["Track Shipment", "Reschedule"],
k: ["Zero manual confirmation calls", "Tracking link from minute one"],
},
{
n: "Pickup",
ic: (
),
h: "Picked up & scanned in",
p: "A pickup scan fires an instant alert to the shipper and the consignee. Sellers see their stock move; customers see their order is real.",
ch: "SMS",
tm: "11:40",
m: "Your parcel has been picked up from Ambattur, Chennai.
Track live: tsp.in/t/78412290",
b: [],
k: ["Instant shipper confirmation", "Works on every handset"],
},
{
n: "In transit",
ic: (
),
h: "Hub scans & transit updates",
p: "Every hub scan becomes a rich, verified update — with your logo, the current location and an ETA the customer can trust instead of calling to ask.",
ch: "RCS",
tm: "04:25",
m: "In transit 🚚 Your shipment reached the Bengaluru sorting centre.
Expected delivery: tomorrow by 6 PM.",
b: ["Live Map", "Change Address"],
k: ["Up to 45% fewer WISMO calls", "Verified branded sender"],
},
{
n: "Out for delivery",
ic: (
),
h: "Rider assigned & on the way",
p: "The consignee gets the rider's name, a live ETA and the delivery OTP — and a voice call goes out if they haven't opened the message, so nobody misses the doorbell.",
ch: "WhatsApp API + Voice",
tm: "08:05",
m: "Out for delivery 📦 Rider Suresh K arrives by 2 PM.
Share OTP 4821 at handover.",
b: ["Track Rider", "Not Available"],
k: ["Fewer missed doorsteps", "Number masking protects both sides"],
},
{
n: "COD collection",
ic: (
),
h: "COD confirmed before dispatch",
p: "Every cash-on-delivery consignment gets a press-1 confirmation call and a digital payment link. Orders nobody confirms never leave the hub — and never become an RTO.",
ch: "Voice IVR + Payment link",
tm: "07:30",
m: '"To confirm your COD order of ₹2,499, press 1. To pay online instead, press 2. To cancel, press 3."',
b: ["Pay ₹2,499 Online"],
k: ["Up to 32% lower RTO", "Cash converted to prepaid"],
},
{
n: "NDR / reattempt",
ic: (
),
h: "Failed delivery, saved automatically",
p: "An NDR scan triggers an instant loop: ask why, offer a new slot, confirm the address, and push the reattempt back into the TMS — all before the parcel would have been marked for return.",
ch: "WhatsApp API → SMS → Voice",
tm: "16:10",
m: "We missed you 😔 Your parcel couldn't be delivered.
Pick a new slot and we'll reattempt tomorrow.",
b: ["Reschedule", "Update Address"],
k: ["Returns converted to reattempts", "Escalates channel by channel"],
},
{
n: "Delivered & POD",
ic: (
),
h: "Delivered, POD sent, feedback captured",
p: "OTP verified at the door, proof of delivery emailed to the shipper, and a one-tap feedback survey sent to the customer while the handover is still fresh.",
ch: "SMS + Email",
tm: "14:32",
m: "Delivered ✅ OTP verified at 14:32 by Suresh K.
POD emailed to the shipper. Rate your delivery ⭐",
b: ["Rate Delivery", "Download POD"],
k: ["Automatic POD archive", "Real delivery NPS data"],
},
];
useEffect(() => {
let timer = null;
const tick = () => {
if (!journeyPaused) {
setJourneyStep((prev) => (prev + 1) % J.length);
}
};
if ("IntersectionObserver" in window && journeyRailRef.current) {
const observer = new IntersectionObserver(
(entries) => {
entries.forEach((e) => {
if (e.isIntersecting) {
if (!timer) timer = setInterval(tick, 4600);
} else {
if (timer) {
clearInterval(timer);
timer = null;
}
}
});
},
{ threshold: 0.15 },
);
observer.observe(journeyRailRef.current);
return () => {
observer.disconnect();
if (timer) clearInterval(timer);
};
} else {
timer = setInterval(tick, 4600);
return () => clearInterval(timer);
}
}, [journeyPaused]);
// 3. Testimonials Slider
const testiRailRef = useRef(null);
const handleTestiScroll = (dir) => {
if (testiRailRef.current) {
const card = testiRailRef.current.querySelector(".testi-card");
if (card) {
testiRailRef.current.scrollBy({
left: dir * (card.offsetWidth + 22),
behavior: "smooth",
});
}
}
};
useEffect(() => {
let testiAuto = setInterval(() => {
if (testiRailRef.current) {
const { scrollLeft, clientWidth, scrollWidth } = testiRailRef.current;
if (scrollLeft + clientWidth >= scrollWidth - 10) {
testiRailRef.current.scrollTo({ left: 0, behavior: "smooth" });
} else {
handleTestiScroll(1);
}
}
}, 5000);
const handleMouseEnter = () => clearInterval(testiAuto);
const handleMouseLeave = () => {
testiAuto = setInterval(() => {
if (testiRailRef.current) {
const { scrollLeft, clientWidth, scrollWidth } = testiRailRef.current;
if (scrollLeft + clientWidth >= scrollWidth - 10) {
testiRailRef.current.scrollTo({ left: 0, behavior: "smooth" });
} else {
handleTestiScroll(1);
}
}
}, 5000);
};
const rail = testiRailRef.current;
if (rail) {
rail.addEventListener("mouseenter", handleMouseEnter);
rail.addEventListener("mouseleave", handleMouseLeave);
}
return () => {
if (rail) {
rail.removeEventListener("mouseenter", handleMouseEnter);
rail.removeEventListener("mouseleave", handleMouseLeave);
}
clearInterval(testiAuto);
};
}, []);
// 4. FAQ Accordion State
const [faqOpenIdx, setFaqOpenIdx] = useState(null);
const toggleFaq = (idx) => {
setFaqOpenIdx((prev) => (prev === idx ? null : idx));
};
// Render Marquee Chips
const chipMarkup = (name, index) => (
{name[0]}
{name}
);
return (
<>