chore: moving route elsewhere and align

This commit is contained in:
2025-11-24 23:51:39 +01:00
parent e301110184
commit d66bed4b99
2 changed files with 166 additions and 166 deletions

View File

@@ -9,98 +9,98 @@ import { transformProduct, type Flight, type AirlineProduct } from '@/lib/airlin
import type { EventName } from '@/lib/events';
const dispatchInteraction = (eventName: EventName, productId?: string, metadata?: Record<string, unknown>) => {
const e = new CustomEvent('definedInteraction', {
detail: { eventName, productId, metadata },
});
document.dispatchEvent(e);
const e = new CustomEvent('definedInteraction', {
detail: { eventName, productId, metadata },
});
document.dispatchEvent(e);
};
export default function AirlineProductPage() {
const params = useParams();
const router = useRouter();
const { addItem } = useCart();
const [product, setProduct] = useState<Flight | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [added, setAdded] = useState(false);
const params = useParams();
const router = useRouter();
const { addItem } = useCart();
const [product, setProduct] = useState<Flight | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [added, setAdded] = useState(false);
const productId = params.id as string;
const productId = params.id as string;
useEffect(() => {
const fetchProduct = async () => {
try {
const res = await fetch(`/api/products/${productId}`);
if (!res.ok) throw new Error(`Failed to fetch: ${res.status}`);
const json = await res.json();
const transformed = transformProduct(json.data as AirlineProduct);
setProduct(transformed);
useEffect(() => {
const fetchProduct = async () => {
try {
const res = await fetch(`/api/products/${productId}`);
if (!res.ok) throw new Error(`Failed to fetch: ${res.status}`);
const json = await res.json();
const transformed = transformProduct(json.data as AirlineProduct);
setProduct(transformed);
// fire learn_more_about_item event when product loads
dispatchInteraction('learn_more_about_item', productId, {
type: 'airline',
dateIndex: transformed.dateIndex,
flightType: transformed.flightType,
// fire learn_more_about_item event when product loads
dispatchInteraction('learn_more_about_item', productId, {
type: 'airline',
dateIndex: transformed.dateIndex,
flightType: transformed.flightType,
});
} catch (e) {
setError(e instanceof Error ? e.message : 'Failed to load product');
console.error('[FETCH_FLIGHT_ERROR]', e);
} finally {
setLoading(false);
}
};
fetchProduct();
}, [productId]);
const handleAddToCart = () => {
if (!product) return;
addItem({
id: productId,
type: 'airline',
name: product.flightType,
price: product.basePrice,
metadata: {
departure: product.departure,
arrival: product.arrival,
duration: product.duration,
cabinClass: product.cabinClass,
},
dateIndex: product.dateIndex,
});
} catch (e) {
setError(e instanceof Error ? e.message : 'Failed to load product');
console.error('[FETCH_FLIGHT_ERROR]', e);
} finally {
setLoading(false);
}
dispatchInteraction('add_item_to_cart', productId, {
type: 'airline',
price: product.basePrice,
});
setAdded(true);
setTimeout(() => setAdded(false), 2000);
};
fetchProduct();
}, [productId]);
const handleAddToCart = () => {
if (!product) return;
return (
<>
<Navigation />
<main className="max-w-4xl mx-auto px-4 py-8">
{loading && <div className="text-center py-8">Loading flight details...</div>}
{error && <div className="text-red-500 text-center py-8">{error}</div>}
addItem({
id: productId,
type: 'airline',
name: product.flightType,
price: product.basePrice,
metadata: {
departure: product.departure,
arrival: product.arrival,
duration: product.duration,
cabinClass: product.cabinClass,
},
dateIndex: product.dateIndex,
});
{!loading && !error && product && (
<>
<button
onClick={() => router.back()}
className="mt-6 text-blue-600 hover:underline"
>
Back to flights
</button>
<AirlineDetails
product={product}
onAddToCart={handleAddToCart}
addedToCart={added}
/>
dispatchInteraction('add_item_to_cart', productId, {
type: 'airline',
price: product.basePrice,
});
setAdded(true);
setTimeout(() => setAdded(false), 2000);
};
return (
<>
<Navigation />
<main className="max-w-4xl mx-auto px-4 py-8">
{loading && <div className="text-center py-8">Loading flight details...</div>}
{error && <div className="text-red-500 text-center py-8">{error}</div>}
{!loading && !error && product && (
<>
<AirlineDetails
product={product}
onAddToCart={handleAddToCart}
addedToCart={added}
/>
<button
onClick={() => router.back()}
className="mt-6 text-blue-600 hover:underline"
>
Back to flights
</button>
</>
)}
</main>
</>
);
</>
)}
</main>
</>
);
}

View File

@@ -9,98 +9,98 @@ import { transformProduct, type Hotel, type HotelProduct } from '@/lib/hotel-uti
import type { EventName } from '@/lib/events';
const dispatchInteraction = (eventName: EventName, productId?: string, metadata?: Record<string, unknown>) => {
const e = new CustomEvent('definedInteraction', {
detail: { eventName, productId, metadata },
});
document.dispatchEvent(e);
const e = new CustomEvent('definedInteraction', {
detail: { eventName, productId, metadata },
});
document.dispatchEvent(e);
};
export default function HotelProductPage() {
const params = useParams();
const router = useRouter();
const { addItem } = useCart();
const [product, setProduct] = useState<Hotel | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [added, setAdded] = useState(false);
const params = useParams();
const router = useRouter();
const { addItem } = useCart();
const [product, setProduct] = useState<Hotel | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const [added, setAdded] = useState(false);
const productId = params.id as string;
const productId = params.id as string;
useEffect(() => {
const fetchProduct = async () => {
try {
const res = await fetch(`/api/products/${productId}`);
if (!res.ok) throw new Error(`Failed to fetch: ${res.status}`);
const json = await res.json();
const transformed = transformProduct(json.data as HotelProduct);
setProduct(transformed);
useEffect(() => {
const fetchProduct = async () => {
try {
const res = await fetch(`/api/products/${productId}`);
if (!res.ok) throw new Error(`Failed to fetch: ${res.status}`);
const json = await res.json();
const transformed = transformProduct(json.data as HotelProduct);
setProduct(transformed);
// fire learn_more_about_item event when product loads
dispatchInteraction('learn_more_about_item', productId, {
type: 'hotel',
dateIndex: transformed.dateIndex,
roomType: transformed.roomType,
// fire learn_more_about_item event when product loads
dispatchInteraction('learn_more_about_item', productId, {
type: 'hotel',
dateIndex: transformed.dateIndex,
roomType: transformed.roomType,
});
} catch (e) {
setError(e instanceof Error ? e.message : 'Failed to load product');
console.error('[FETCH_HOTEL_ERROR]', e);
} finally {
setLoading(false);
}
};
fetchProduct();
}, [productId]);
const handleAddToCart = () => {
if (!product) return;
addItem({
id: productId,
type: 'hotel',
name: product.name,
price: product.pricePerNight,
metadata: {
roomType: product.roomType,
nights: product.nights,
checkIn: product.checkIn,
checkOut: product.checkOut,
},
dateIndex: product.dateIndex,
});
} catch (e) {
setError(e instanceof Error ? e.message : 'Failed to load product');
console.error('[FETCH_HOTEL_ERROR]', e);
} finally {
setLoading(false);
}
dispatchInteraction('add_item_to_cart', productId, {
type: 'hotel',
price: product.pricePerNight,
});
setAdded(true);
setTimeout(() => setAdded(false), 2000);
};
fetchProduct();
}, [productId]);
const handleAddToCart = () => {
if (!product) return;
return (
<>
<Navigation />
<main className="max-w-4xl mx-auto px-4 py-8">
{loading && <div className="text-center py-8">Loading hotel details...</div>}
{error && <div className="text-red-500 text-center py-8">{error}</div>}
addItem({
id: productId,
type: 'hotel',
name: product.name,
price: product.pricePerNight,
metadata: {
roomType: product.roomType,
nights: product.nights,
checkIn: product.checkIn,
checkOut: product.checkOut,
},
dateIndex: product.dateIndex,
});
{!loading && !error && product && (
<>
<button
onClick={() => router.back()}
className="mt-6 text-blue-600 hover:underline"
>
Back to rooms
</button>
<HotelDetails
product={product}
onAddToCart={handleAddToCart}
addedToCart={added}
/>
dispatchInteraction('add_item_to_cart', productId, {
type: 'hotel',
price: product.pricePerNight,
});
setAdded(true);
setTimeout(() => setAdded(false), 2000);
};
return (
<>
<Navigation />
<main className="max-w-4xl mx-auto px-4 py-8">
{loading && <div className="text-center py-8">Loading hotel details...</div>}
{error && <div className="text-red-500 text-center py-8">{error}</div>}
{!loading && !error && product && (
<>
<HotelDetails
product={product}
onAddToCart={handleAddToCart}
addedToCart={added}
/>
<button
onClick={() => router.back()}
className="mt-6 text-blue-600 hover:underline"
>
Back to rooms
</button>
</>
)}
</main>
</>
);
</>
)}
</main>
</>
);
}