diff --git a/app/index.tsx b/app/index.tsx index ac7854e..1a9a6d9 100644 --- a/app/index.tsx +++ b/app/index.tsx @@ -95,7 +95,6 @@ const Index = () => { /> setLocationActive(false)} diff --git a/components/Location.tsx b/components/Location.tsx index ecad934..ad14bfa 100644 --- a/components/Location.tsx +++ b/components/Location.tsx @@ -1,5 +1,5 @@ import React, { useState } from "react"; -import {Dialog, TextInput, useTheme, Button, Text, List, Portal} from "react-native-paper"; +import { Dialog, TextInput, useTheme, Button, Text, List, Portal } from "react-native-paper"; import { View, FlatList } from "react-native"; import Slider from "@react-native-community/slider"; import axios from "axios"; @@ -9,7 +9,6 @@ import log from "@/util/log"; interface LocationScreenProps { visible: boolean; setChanged: (dataChanged: boolean) => void; - setTheme: (theme: string) => void; currentTheme: string; onClose: () => void; } @@ -29,7 +28,7 @@ type Park = { }; }; -const LocationScreen: React.FC = ({ visible, setTheme, currentTheme, setChanged, onClose }) => { +const LocationScreen: React.FC = ({ visible, currentTheme, setChanged, onClose }) => { const theme = useTheme(); const [zip, setZip] = useState(""); const [distance, setDistance] = useState(25); @@ -37,6 +36,7 @@ const LocationScreen: React.FC = ({ visible, setTheme, curr const [locLoading, setLocLoading] = useState(false); const [parks, setParks] = useState([]); const [hasSearched, setHasSearched] = useState(false); + const [selectedParkId, setSelectedParkId] = useState(null); // Call the parks endpoint with coordinates const fetchNearbyParks = async (longitude: number, latitude: number) => { @@ -104,101 +104,145 @@ const LocationScreen: React.FC = ({ visible, setTheme, curr }} titleStyle={{ fontWeight: "bold" }} descriptionNumberOfLines={2} + onPress={() => setSelectedParkId(item.Id)} /> ); + // Find the selected park, if one is selected + const selectedPark = selectedParkId + ? parks.find(p => p.Id === selectedParkId) + : null; + return ( - { - onClose(); - }} - style={{ backgroundColor: theme.colors.background }}> - Location + + Location - - OR - - - - - - - Distance: {distance} mile{distance !== 1 ? "s" : ""} - - - - {/* Parks List */} - {hasSearched && ( - - - Nearby Dogparks - - {parks != null ? ( - String(idx)} - renderItem={renderItem} - showsVerticalScrollIndicator={false} - style={{ maxHeight: 170 }} - /> - ) : ( - - No parks found in range. - - )} + {/* If a park is selected, show only that park info and change button */} + {selectedPark ? ( + + } + style={{ + backgroundColor: theme.colors.surface, + borderRadius: 8, + marginBottom: 8, + elevation: 1, + width: "100%" + }} + titleStyle={{ fontWeight: "bold" }} + descriptionNumberOfLines={2} + /> + + ) : ( + // Otherwise show location lookup tools and park list + <> + + OR + + + + + + + Distance: {distance} mile{distance !== 1 ? "s" : ""} + + + + {/* Parks List */} + {hasSearched && ( + + 0 ? 8 : 2, + color: theme.colors.primary + }}> + Nearby Dogparks + + {parks.length > 0 ? ( + item.Id} + renderItem={renderItem} + showsVerticalScrollIndicator={false} + style={{ maxHeight: 170 }} + /> + ) : ( + + No parks found in range. + + )} + + )} + )}