Compare commits

..

No commits in common. "f711c9d610a9857586d09f319eff4088ae7c2b1f" and "dde3256c6eba26cbbb42b9261315ca5543482cfd" have entirely different histories.

6 changed files with 90 additions and 282 deletions

View File

@ -2,7 +2,6 @@ import React from 'react';
import {View, Text } from "react-native";
import { useTheme } from "react-native-paper";
import Profile from "@/components/Profile";
import LocationScreen from "@/components/Location";
import Status from "@/components/Status";
import TopNav from "@/components/TopNav";
import DrawerMenu from "@/components/DrawerMenu";
@ -32,8 +31,6 @@ const Index = () => {
setUserName,
userImage,
setUserImage,
park,
setPark,
userStatus,
setUserStatus,
setUserDataChanged,
@ -66,9 +63,11 @@ const Index = () => {
aboutVisible={isAboutActive}
privacyVisible={isPrivacyActive}
bugVisible={isBugActive}
locationVisible={isLocationActive}
toggleAbout={() => setAboutActive(!isAboutActive)}
togglePrivacy={() => setPrivacyActive(!isPrivacyActive)}
toggleBug={() => setBugActive(!isBugActive)}
toggleLocation={() => setLocationActive(!isLocationActive)}
/>
<TopNav
toggleMenu={() => setMenuActive(!isMenuActive)}
@ -95,14 +94,6 @@ const Index = () => {
setChanged={setUserDataChanged}
onClose={() => setProfileActive(false)}
/>
<LocationScreen
visible={isLocationActive}
currentTheme={currentTheme}
park={park}
setPark={setPark}
setChanged={setUserDataChanged}
onClose={() => setLocationActive(false)}
/>
</View>
);
};

View File

@ -3,18 +3,20 @@ import { Portal, Button, Dialog, useTheme } from "react-native-paper";
import About from "@/components/About";
import Privacy from "@/components/Privacy";
import Broken from "@/components/Broken";
import Location from "@/components/Location";
interface DialogsProps {
aboutVisible: boolean;
privacyVisible: boolean;
bugVisible: boolean;
locationVisible: boolean;
toggleAbout: () => void;
togglePrivacy: () => void;
toggleBug: () => void;
toggleLocation: () => void;
}
const Dialogs: React.FC<DialogsProps> = ({ aboutVisible, privacyVisible, bugVisible, toggleAbout, togglePrivacy, toggleBug }) => {
const Dialogs: React.FC<DialogsProps> = ({ aboutVisible, privacyVisible, bugVisible, locationVisible, toggleAbout, togglePrivacy, toggleBug, toggleLocation }) => {
const theme = useTheme();
return (
<Portal>
@ -54,6 +56,18 @@ const Dialogs: React.FC<DialogsProps> = ({ aboutVisible, privacyVisible, bugVisi
</Button>
</Dialog.Actions>
</Dialog>
<Dialog visible={locationVisible} onDismiss={() => toggleLocation()}
style={{backgroundColor: theme.colors.primaryContainer}}>
<Dialog.Title style={{color: theme.colors.primary, textAlign: 'center'}}>Location</Dialog.Title>
<Location />
<Dialog.Actions style={{justifyContent: "center"}}>
<Button onPress={() => toggleLocation()} mode="contained"
style={{backgroundColor: theme.colors.inversePrimary}}
labelStyle={{color: theme.colors.primary}}>
Close
</Button>
</Dialog.Actions>
</Dialog>
</Portal>
)
}

View File

@ -1,84 +1,34 @@
import React, {useEffect, useState} from "react";
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 React, { useState } from "react";
import { Dialog, TextInput, useTheme, Button, Text } from "react-native-paper";
import { View } from "react-native";
import axios from "axios";
import * as Location from "expo-location";
import log from "@/util/log";
interface LocationScreenProps {
visible: boolean;
setChanged: (dataChanged: boolean) => void;
currentTheme: string;
park: string;
setPark: (data: string) => void;
onClose: () => void;
}
interface Park {
Id: string;
name: string;
address: string;
city: string;
state: string;
zip: string;
location: {
coordinates: [number, number];
};
}
import log from "@/util/log"
export const API_URL = process.env.EXPO_PUBLIC_API_URL;
const BUTTON_WIDTH = 260;
const LocationScreen: React.FC<LocationScreenProps> = ({ visible, park, setPark, setChanged, onClose }) => {
const LocationComponent = () => {
const theme = useTheme();
const [zip, setZip] = useState("");
const [distance, setDistance] = useState(25);
const [loading, setLoading] = useState(false);
const [locLoading, setLocLoading] = useState(false);
const [parks, setParks] = useState<Park[]>([]);
const [hasSearched, setHasSearched] = useState(false);
const [selectedPark, setSelectedPark] = useState<Park | null>(null);
useEffect(() => {
if (visible) {
if (park) {
setSelectedPark(JSON.parse(park) as Park | null);
}
}
}, [visible]);
// Call the parks endpoint with coordinates
const fetchNearbyParks = async (longitude: number, latitude: number) => {
try {
const response = await axios.post(API_URL + "/parkLookup", { "Lon": longitude, "Lat": latitude, "Dist": distance });
log.debug("Nearby Parks:", response.data);
setParks(response.data);
} catch (err) {
log.error("Nearby Parks Error:", err);
setParks([]);
} finally {
setHasSearched(true);
}
};
// Zip code handler
const handleSubmit = async () => {
if (!zip) return;
setLoading(true);
try {
const response = await axios.post(API_URL + "/zipLookup", { zip });
log.debug("Zip Lookup Response:", response.data);
const longitude = response.data[0];
const latitude = response.data[1];
await fetchNearbyParks(longitude, latitude);
log.error(response.data);
const long = response.data[0];
const lat = response.data[1];
} catch (err) {
log.error(err);
}
setLoading(false);
};
// Geolocation handler
const handleGetLocation = async () => {
setLocLoading(true);
try {
@ -90,181 +40,67 @@ const LocationScreen: React.FC<LocationScreenProps> = ({ visible, park, setPark,
}
let location = await Location.getCurrentPositionAsync({});
const { longitude, latitude } = location.coords;
log.debug([longitude, latitude]);
await fetchNearbyParks(longitude, latitude);
log.error([longitude, latitude]);
} catch (err) {
log.error("Location Error:", err);
}
setLocLoading(false);
};
// Render each park item
const renderItem = ({ item }: { item: Park }) => (
<List.Item
title={item.name}
description={
`${item.address}\n${item.city}, ${item.state} ${item.zip}`
}
left={props => <List.Icon {...props} icon="paw" />}
style={{
backgroundColor: theme.colors.surface,
borderRadius: 8,
marginBottom: 8,
elevation: 1,
}}
titleStyle={{ fontWeight: "bold" }}
descriptionNumberOfLines={2}
onPress={() => {
setSelectedPark(item);
const parkString = JSON.stringify(item)
if ( park !== parkString ) {
setChanged(true);
}
setPark(parkString);
setParks([]);
setHasSearched(false);
}}
/>
);
return (
<Portal>
<Dialog visible={visible}
onDismiss={onClose}
style={{ backgroundColor: theme.colors.background }} >
<Dialog.Title style={{ color: theme.colors.primary, textAlign: 'center' }}>Location</Dialog.Title>
<Dialog.Content style={{ maxHeight: 500, justifyContent: "center", alignItems: "center" }}>
<View style={{ alignItems: "center", width: "100%" }}>
{/* If a park is selected, show only that park info and change button */}
{selectedPark ? (
<View style={{ width: BUTTON_WIDTH, alignItems: "center" }}>
<List.Item
title={selectedPark.name}
description={
`${selectedPark.address}\n${selectedPark.city}, ${selectedPark.state} ${selectedPark.zip}`
}
left={props => <List.Icon {...props} icon="paw" />}
style={{
backgroundColor: theme.colors.surface,
borderRadius: 8,
marginBottom: 8,
elevation: 1,
width: "100%"
}}
titleStyle={{ fontWeight: "bold" }}
descriptionNumberOfLines={2}
/>
<Button
mode="outlined"
onPress={() => {
setSelectedPark(null);
setParks([]);
setHasSearched(false);
}}
style={{ marginTop: 16, width: "100%" }}
>
Change Park
</Button>
</View>
) : (
// Otherwise show location lookup tools and park list
<>
<Button
mode="outlined"
onPress={handleGetLocation}
loading={locLoading}
disabled={locLoading}
style={{ marginBottom: 12, width: BUTTON_WIDTH }}
>
Use My Location
</Button>
<Text style={{ marginBottom: 12, color: theme.colors.primary, fontWeight: "bold" }}>OR</Text>
<View style={{
flexDirection: "row",
alignItems: "center",
width: BUTTON_WIDTH,
justifyContent: "center",
marginBottom: 4,
}}>
<TextInput
label="Enter Zip Code"
mode="outlined"
value={zip}
onChangeText={setZip}
style={{
flex: 3,
marginRight: 6,
fontFamily: "SpaceReg",
minWidth: 0,
}}
placeholderTextColor={theme.colors.primary}
textColor={theme.colors.primary}
theme={{ colors: { text: theme.colors.primary } }}
/>
<Button
mode="contained"
onPress={handleSubmit}
loading={loading}
disabled={!zip || loading}
style={{
flex: 2,
minWidth: 0,
height: 50,
}}
contentStyle={{ height: 50 }}
>
Submit
</Button>
</View>
<View style={{ width: BUTTON_WIDTH, marginTop: 10, alignItems: "center" }}>
<Text style={{ color: theme.colors.primary, marginBottom: 2 }}>
Distance: {distance} mile{distance !== 1 ? "s" : ""}
</Text>
<Slider
style={{ width: "100%", height: 36 }}
minimumValue={1}
maximumValue={40}
step={1}
value={distance}
onValueChange={setDistance}
minimumTrackTintColor={theme.colors.primary}
maximumTrackTintColor={theme.colors.onSurfaceDisabled || "#ccc"}
thumbTintColor={theme.colors.primary}
/>
</View>
{/* Parks List */}
{hasSearched && (
<View style={{ width: BUTTON_WIDTH, marginTop: 18, maxHeight: 200 }}>
<Text style={{
fontWeight: "bold",
fontSize: 18,
marginBottom: parks.length > 0 ? 8 : 2,
color: theme.colors.primary
}}>
Nearby Dogparks
</Text>
{parks.length > 0 ? (
<FlatList
data={parks}
keyExtractor={(item) => item.Id}
renderItem={renderItem}
showsVerticalScrollIndicator={false}
style={{ maxHeight: 170 }}
/>
) : (
<Text style={{ color: theme.colors.onSurface, textAlign: "center", marginTop: 12 }}>
No parks found in range.
</Text>
)}
</View>
)}
</>
)}
</View>
</Dialog.Content>
</Dialog>
</Portal>
<Dialog.Content style={{ maxHeight: 360, justifyContent: "center", alignItems: "center" }}>
<View style={{ alignItems: "center", width: "100%" }}>
<Button
mode="outlined"
onPress={handleGetLocation}
loading={locLoading}
disabled={locLoading}
style={{ marginBottom: 12, width: BUTTON_WIDTH }}
>
Use My Location
</Button>
<Text style={{ marginBottom: 12, color: theme.colors.primary, fontWeight: "bold" }}>OR</Text>
<View
style={{
flexDirection: "row",
alignItems: "center",
width: BUTTON_WIDTH,
justifyContent: "center",
}}
>
<TextInput
label="Enter Zip Code"
mode="outlined"
value={zip}
onChangeText={setZip}
style={{
flex: 3,
marginRight: 6,
fontFamily: "SpaceReg",
minWidth: 0,
}}
placeholderTextColor={theme.colors.primary}
textColor={theme.colors.primary}
theme={{ colors: { text: theme.colors.primary } }}
/>
<Button
mode="contained"
onPress={handleSubmit}
loading={loading}
disabled={!zip || loading}
style={{
flex: 2,
minWidth: 0,
height: 50,
}}
contentStyle={{ height: 50 }}
>
Submit
</Button>
</View>
</View>
</Dialog.Content>
);
};
export default LocationScreen;
export default LocationComponent;

View File

@ -26,8 +26,6 @@ interface UserContextType {
setUserName: (name: string) => void;
userImage: string;
setUserImage: (image: string) => void;
park: string;
setPark: (park: string) => void;
userStatus: string;
setUserStatus: (status: string) => void;
setUserDataChanged: (changed: boolean) => void;
@ -54,7 +52,6 @@ export const UserProvider: React.FC<UserProviderProps> = ({ children }) => {
const [userId, setUserId] = useState("");
const [userName, setUserName] = useState("");
const [userImage, setUserImage] = useState("");
const [park, setPark] = useState("");
const [userStatus, setUserStatus] = useState("none");
const [userDataChanged, setUserDataChanged] = useState(false);
const [isLoading, setIsLoading] = useState(true);
@ -68,8 +65,7 @@ export const UserProvider: React.FC<UserProviderProps> = ({ children }) => {
const storedUserName = await AsyncStorage.getItem("userName");
const storedUserImage = await AsyncStorage.getItem("userImage");
const storedUserTheme = await AsyncStorage.getItem("theme");
const storedPark = await AsyncStorage.getItem("park");
log.debug("Stored park: ", storedPark);
log.debug("Stored theme: ", storedUserTheme);
if (storedUserId) {
setUserId(storedUserId);
setUserName(storedUserName || "");
@ -83,13 +79,6 @@ export const UserProvider: React.FC<UserProviderProps> = ({ children }) => {
setTheme("blue")
setProfileActive(true);
}
if(storedPark) {
setPark(storedPark);
setLocationActive(false);
} else {
setPark("");
setLocationActive(true);
}
} catch (error) {
log.error("Error loading user data:", error);
} finally {
@ -109,8 +98,7 @@ export const UserProvider: React.FC<UserProviderProps> = ({ children }) => {
await AsyncStorage.setItem("userName", userName);
await AsyncStorage.setItem("userImage", userImage);
await AsyncStorage.setItem("theme", currentTheme);
await AsyncStorage.setItem("park", park);
log.debug("Current park: ", park);
log.debug("Current theme: ", currentTheme);
setUserDataChanged(false);
} catch (error) {
log.error("Error saving user data:", error);
@ -172,8 +160,6 @@ export const UserProvider: React.FC<UserProviderProps> = ({ children }) => {
setUserName,
userImage,
setUserImage,
park,
setPark,
userStatus,
setUserStatus,
setUserDataChanged,

17
package-lock.json generated
View File

@ -11,7 +11,6 @@
"@expo/metro-runtime": "~4.0.1",
"@expo/vector-icons": "^14.0.2",
"@react-native-async-storage/async-storage": "~2.1.1",
"@react-native-community/slider": "^4.5.6",
"@react-navigation/bottom-tabs": "^7.2.0",
"@react-navigation/native": "^7.0.14",
"axios": "~1.8.4",
@ -22,7 +21,6 @@
"expo-haptics": "~14.0.1",
"expo-image-picker": "~16.0.6",
"expo-linking": "~7.0.4",
"expo-location": "^18.0.10",
"expo-router": "~4.0.16",
"expo-splash-screen": "~0.29.20",
"expo-status-bar": "~2.0.1",
@ -3599,12 +3597,6 @@
"react-native": "^0.0.0-0 || >=0.65 <1.0"
}
},
"node_modules/@react-native-community/slider": {
"version": "4.5.6",
"resolved": "https://registry.npmjs.org/@react-native-community/slider/-/slider-4.5.6.tgz",
"integrity": "sha512-UhLPFeqx0YfPLrEz8ffT3uqAyXWu6iqFjohNsbp4cOU7hnJwg2RXtDnYHoHMr7MOkZDVdlLMdrSrAuzY6KGqrg==",
"license": "MIT"
},
"node_modules/@react-native/assets-registry": {
"version": "0.77.1",
"resolved": "https://registry.npmjs.org/@react-native/assets-registry/-/assets-registry-0.77.1.tgz",
@ -7316,15 +7308,6 @@
"react-native": "*"
}
},
"node_modules/expo-location": {
"version": "18.0.10",
"resolved": "https://registry.npmjs.org/expo-location/-/expo-location-18.0.10.tgz",
"integrity": "sha512-R0Iioz0UZ9Ts8TACPngh8uDFbajJhVa5/igLqWB8Pq/gp8UHuwj7PC8XbZV7avsFoShYjaxrOhf4U7IONeKLgg==",
"license": "MIT",
"peerDependencies": {
"expo": "*"
}
},
"node_modules/expo-modules-autolinking": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/expo-modules-autolinking/-/expo-modules-autolinking-2.0.5.tgz",

View File

@ -15,21 +15,15 @@
"preset": "jest-expo"
},
"dependencies": {
"@expo/metro-runtime": "~4.0.1",
"@expo/vector-icons": "^14.0.2",
"@react-native-async-storage/async-storage": "~2.1.1",
"@react-native-community/slider": "^4.5.6",
"@react-navigation/bottom-tabs": "^7.2.0",
"@react-navigation/native": "^7.0.14",
"axios": "~1.8.4",
"expo": "~52.0.25",
"expo-blur": "~14.0.2",
"expo-constants": "~17.0.4",
"expo-font": "~13.0.3",
"expo-haptics": "~14.0.1",
"expo-image-picker": "~16.0.6",
"expo-linking": "~7.0.4",
"expo-location": "^18.0.10",
"expo-router": "~4.0.16",
"expo-splash-screen": "~0.29.20",
"expo-status-bar": "~2.0.1",
@ -41,15 +35,19 @@
"react-native": "0.77.1",
"react-native-gesture-handler": "~2.20.2",
"react-native-logs": "~5.3.0",
"react-native-paper": "~5.13.1",
"react-native-reanimated": "~3.16.1",
"react-native-safe-area-context": "4.12.0",
"react-native-screens": "~4.4.0",
"react-native-vector-icons": "~10.2.0",
"react-native-web": "~0.19.13",
"react-native-webview": "13.12.5",
"react-use-websocket": "~4.13.0",
"uuid": "~11.0.5"
"@react-native-async-storage/async-storage": "~2.1.1",
"expo-image-picker": "~16.0.6",
"axios": "~1.8.4",
"uuid": "~11.0.5",
"react-native-paper": "~5.13.1",
"react-native-vector-icons": "~10.2.0",
"@expo/metro-runtime": "~4.0.1"
},
"devDependencies": {
"@babel/core": "^7.25.2",