diff --git a/client/src/components/Planner/PlacesSidebar.tsx b/client/src/components/Planner/PlacesSidebar.tsx index 62c054f..14f3129 100644 --- a/client/src/components/Planner/PlacesSidebar.tsx +++ b/client/src/components/Planner/PlacesSidebar.tsx @@ -22,17 +22,23 @@ interface PlacesSidebarProps { onDeletePlace: (placeId: number) => void days: Day[] isMobile: boolean + onCategoryFilterChange?: (categoryId: string) => void } export default function PlacesSidebar({ places, categories, assignments, selectedDayId, selectedPlaceId, - onPlaceClick, onAddPlace, onAssignToDay, onEditPlace, onDeletePlace, days, isMobile, + onPlaceClick, onAddPlace, onAssignToDay, onEditPlace, onDeletePlace, days, isMobile, onCategoryFilterChange, }: PlacesSidebarProps) { const { t } = useTranslation() const ctxMenu = useContextMenu() const [search, setSearch] = useState('') const [filter, setFilter] = useState('all') - const [categoryFilter, setCategoryFilter] = useState('') + const [categoryFilter, setCategoryFilterLocal] = useState('') + + const setCategoryFilter = (val: string) => { + setCategoryFilterLocal(val) + onCategoryFilterChange?.(val) + } const [dayPickerPlace, setDayPickerPlace] = useState(null) // Alle geplanten Ort-IDs abrufen (einem Tag zugewiesen) diff --git a/client/src/pages/TripPlannerPage.tsx b/client/src/pages/TripPlannerPage.tsx index a4ea63b..a02263d 100644 --- a/client/src/pages/TripPlannerPage.tsx +++ b/client/src/pages/TripPlannerPage.tsx @@ -116,9 +116,15 @@ export default function TripPlannerPage(): React.ReactElement | null { useTripWebSocket(tripId) + const [mapCategoryFilter, setMapCategoryFilter] = useState('') + const mapPlaces = useCallback(() => { - return places.filter(p => p.lat && p.lng) - }, [places]) + return places.filter(p => { + if (!p.lat || !p.lng) return false + if (mapCategoryFilter && String(p.category_id) !== String(mapCategoryFilter)) return false + return true + }) + }, [places, mapCategoryFilter]) const { route, routeSegments, routeInfo, setRoute, setRouteInfo, updateRouteForDay } = useRouteCalculation(tripStore, selectedDayId) @@ -496,6 +502,7 @@ export default function TripPlannerPage(): React.ReactElement | null { onAssignToDay={handleAssignToDay} onEditPlace={(place) => { setEditingPlace(place); setEditingAssignmentId(null); setShowPlaceForm(true) }} onDeletePlace={(placeId) => handleDeletePlace(placeId)} + onCategoryFilterChange={setMapCategoryFilter} /> @@ -594,7 +601,7 @@ export default function TripPlannerPage(): React.ReactElement | null {
{mobileSidebarOpen === 'left' ? { handleSelectDay(id); setMobileSidebarOpen(null) }} onPlaceClick={handlePlaceClick} onReorder={handleReorder} onUpdateDayTitle={handleUpdateDayTitle} onAssignToDay={handleAssignToDay} onRouteCalculated={(r) => { if (r) { setRoute(r.coordinates); setRouteInfo({ distance: r.distanceText, duration: r.durationText }) } }} reservations={reservations} onAddReservation={(dayId) => { setEditingReservation(null); tripStore.setSelectedDay(dayId); setShowReservationModal(true); setMobileSidebarOpen(null) }} onDayDetail={(day) => { setShowDayDetail(day); setSelectedPlaceId(null); setSelectedAssignmentId(null); setMobileSidebarOpen(null) }} accommodations={tripAccommodations} /> - : { setEditingPlace(null); setShowPlaceForm(true); setMobileSidebarOpen(null) }} onAssignToDay={handleAssignToDay} days={days} isMobile /> + : { setEditingPlace(null); setShowPlaceForm(true); setMobileSidebarOpen(null) }} onAssignToDay={handleAssignToDay} days={days} isMobile onCategoryFilterChange={setMapCategoryFilter} /> }