react-uber-rides-estimates
v0.1.9
Published
React Component to get Uber Rides Estimates
Downloads
38
Maintainers
Readme
React UBER Rides Estimates
React Higher Order Component to get Uber Rides Estimates
This is not the wrapper for UBER Rides SDK Native Solution. Please refer to React Native UBER Rides for native solution.
Install
npm install react-uber-rides-estimates
How to use
import React, { Component } from "react";
import {
AppRegistry,
StyleSheet,
Text,
View,
ActivityIndicator,
TouchableOpacity
} from "react-native";
import UberButton from "react-uber-rides-estimates";
export default class TestingApp extends Component {
render() {
return (
<View style={styles.container}>
<UberButton
clientId="your.uber.client.id"
serverToken="your.uber.server.token"
>
{uberRides => {
if (uberRides.loading) {
return <ActivityIndicator />;
}
if (uberRides.priceEstimate) {
return <Text>{JSON.stringify(uberRides.priceEstimate)}</Text>;
}
if (uberRides.timeEstimate) {
return <Text>{JSON.stringify(uberRides.timeEstimate)}</Text>;
}
return (
<TouchableOpacity
onPress={() =>
uberRides.getPriceEstimate({
pickupLocation: {
lat: 37.775304,
long: -122.417522,
nickname: "Uber HQ",
formattedAddress: "1455 Market Street, San Francisco"
},
dropoffLocation: {
lat: 37.795079,
long: -122.4397805,
nickname: "Embarcadero",
formattedAddress: "One Embarcadero Center, San Francisco"
}
})
}
>
<View>
<Text>Ride with UBER</Text>
</View>
</TouchableOpacity>
);
}}
</UberButton>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: "#F5FCFF"
}
});
AppRegistry.registerComponent("TestingApp", () => TestingApp);
API
documentation coming soon