fix: sửa lỗi hiển thị trên browser của điện thoại

This commit is contained in:
2026-06-20 12:19:30 +07:00
parent ae74035ad5
commit fdf41e05fc
11 changed files with 135 additions and 117 deletions
+15 -6
View File
@@ -329,6 +329,15 @@ const MapContextMenu = ({ onAction }: { onAction: (action: string, latlng: L.Lat
);
};
const getMostLikedPhoto = (photos: any[]) => {
if (!photos || photos.length === 0) return null;
return [...photos].sort((a, b) => {
const likesA = a.metadata?.likedUserIds?.length || 0;
const likesB = b.metadata?.likedUserIds?.length || 0;
return likesB - likesA;
})[0];
};
export const TourDetailPage = ({
onBack,
tourId,
@@ -682,9 +691,9 @@ export const TourDetailPage = ({
// Effect to set initial selected photo for display or reset if current one is no longer in filtered list
useEffect(() => {
if (filteredPhotos.length > 0 && !selectedPhotoForDisplay) {
setSelectedPhotoForDisplay(filteredPhotos[0]);
setSelectedPhotoForDisplay(getMostLikedPhoto(filteredPhotos));
} else if (selectedPhotoForDisplay && !filteredPhotos.some(p => p.id === selectedPhotoForDisplay.id)) {
setSelectedPhotoForDisplay(filteredPhotos.length > 0 ? filteredPhotos[0] : null);
setSelectedPhotoForDisplay(filteredPhotos.length > 0 ? getMostLikedPhoto(filteredPhotos) : null);
}
}, [filteredPhotos, selectedPhotoForDisplay]);
const [isCommentModalOpen, setIsCommentModalOpen] = useState(false);
@@ -835,7 +844,7 @@ export const TourDetailPage = ({
if (currentTour && currentTour.photos && currentTour.photos.length > 0) {
// If there are photos, and no leg is selected, default to 'all' and first photo
if (selectedLegIdForPhoto === 'all' && !selectedPhotoForDisplay) {
setSelectedPhotoForDisplay(currentTour.photos[0]);
setSelectedPhotoForDisplay(getMostLikedPhoto(currentTour.photos));
} else if (selectedLegIdForPhoto !== 'all') {
// If a specific leg is selected, try to find a photo for that leg
const targetLeg = legs.find(l => l.id === selectedLegIdForPhoto);
@@ -843,9 +852,9 @@ export const TourDetailPage = ({
const locationIdsInLeg = targetLeg.locations.map((loc: any) => loc.id);
const photosInLeg = currentTour.photos.filter((p: any) => p.locationId && locationIdsInLeg.includes(p.locationId));
if (photosInLeg.length > 0 && !selectedPhotoForDisplay) {
setSelectedPhotoForDisplay(photosInLeg[0]);
setSelectedPhotoForDisplay(getMostLikedPhoto(photosInLeg));
} else if (selectedPhotoForDisplay && !photosInLeg.some(p => p.id === selectedPhotoForDisplay.id)) {
setSelectedPhotoForDisplay(photosInLeg.length > 0 ? photosInLeg[0] : null);
setSelectedPhotoForDisplay(photosInLeg.length > 0 ? getMostLikedPhoto(photosInLeg) : null);
}
}
}
@@ -1345,7 +1354,7 @@ export const TourDetailPage = ({
date: tourDateDisplay,
membersCount: currentTour?.participants?.length || 0,
budget: currentTour?.totalCost ? `${Number(currentTour.totalCost).toLocaleString()} VND` : "0 VND",
coverImage: currentTour?.photos?.[0]?.imageUrl || "https://images.unsplash.com/photo-1476514525535-07fb3b4ae5f1?q=80&w=2070&auto=format&fit=crop"
coverImage: getMostLikedPhoto(currentTour?.photos || [])?.imageUrl || "https://images.unsplash.com/photo-1476514525535-07fb3b4ae5f1?q=80&w=2070&auto=format&fit=crop"
};
return (