added use my location geolookup w/ expo-location
This commit is contained in:
parent
b9341478f9
commit
dee2183ce3
@ -2,15 +2,18 @@ import React, { useState } from "react";
|
|||||||
import { Dialog, TextInput, useTheme, Button } from "react-native-paper";
|
import { Dialog, TextInput, useTheme, Button } from "react-native-paper";
|
||||||
import { View } from "react-native";
|
import { View } from "react-native";
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
import * as Location from "expo-location";
|
||||||
import log from "@/util/log"
|
import log from "@/util/log"
|
||||||
|
|
||||||
export const API_URL = process.env.EXPO_PUBLIC_API_URL;
|
export const API_URL = process.env.EXPO_PUBLIC_API_URL;
|
||||||
|
|
||||||
const Location = () => {
|
const LocationComponent = () => {
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
const [zip, setZip] = useState("");
|
const [zip, setZip] = useState("");
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
|
const [locLoading, setLocLoading] = useState(false);
|
||||||
|
|
||||||
|
// Handle submit by zip
|
||||||
const handleSubmit = async () => {
|
const handleSubmit = async () => {
|
||||||
if (!zip) return;
|
if (!zip) return;
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
@ -19,14 +22,33 @@ const Location = () => {
|
|||||||
log.error(response.data);
|
log.error(response.data);
|
||||||
const long = response.data[0];
|
const long = response.data[0];
|
||||||
const lat = response.data[1];
|
const lat = response.data[1];
|
||||||
|
// Do something with long/lat as needed
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
// Optionally handle error
|
|
||||||
log.error(err);
|
log.error(err);
|
||||||
}
|
}
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Handle device geolocation
|
||||||
|
const handleGetLocation = async () => {
|
||||||
|
setLocLoading(true);
|
||||||
|
try {
|
||||||
|
let { status } = await Location.requestForegroundPermissionsAsync();
|
||||||
|
if (status !== 'granted') {
|
||||||
|
log.error("Permission to access location was denied");
|
||||||
|
setLocLoading(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let location = await Location.getCurrentPositionAsync({});
|
||||||
|
const { longitude, latitude } = location.coords;
|
||||||
|
log.error([longitude, latitude]);
|
||||||
|
// Do something with longitude/latitude as needed
|
||||||
|
} catch (err) {
|
||||||
|
log.error("Location Error:", err);
|
||||||
|
}
|
||||||
|
setLocLoading(false);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Dialog.Content style={{ maxHeight: 300 }}>
|
<Dialog.Content style={{ maxHeight: 300 }}>
|
||||||
<View style={{ flexDirection: "row", alignItems: "center", padding: 16 }}>
|
<View style={{ flexDirection: "row", alignItems: "center", padding: 16 }}>
|
||||||
@ -45,12 +67,21 @@ const Location = () => {
|
|||||||
onPress={handleSubmit}
|
onPress={handleSubmit}
|
||||||
loading={loading}
|
loading={loading}
|
||||||
disabled={!zip || loading}
|
disabled={!zip || loading}
|
||||||
|
style={{ marginRight: 6 }}
|
||||||
>
|
>
|
||||||
Submit
|
Submit
|
||||||
</Button>
|
</Button>
|
||||||
|
<Button
|
||||||
|
mode="outlined"
|
||||||
|
onPress={handleGetLocation}
|
||||||
|
loading={locLoading}
|
||||||
|
disabled={locLoading}
|
||||||
|
>
|
||||||
|
Use My Location
|
||||||
|
</Button>
|
||||||
</View>
|
</View>
|
||||||
</Dialog.Content>
|
</Dialog.Content>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Location;
|
export default LocationComponent;
|
||||||
|
Loading…
Reference in New Issue
Block a user