Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 6 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@ This is the beta release of the Google Driver SDK package for React Native. It i

| | Android | iOS |
| ------------------------------- | ------- | --------- |
| **Minimum mobile OS supported** | SDK 24+ | iOS 16.0+ |
| **Minimum mobile OS supported** | SDK 26+ | iOS 16.0+ |
| **Compile/Target SDK** | SDK 36+ | - |

* A React Native project
* A Google Cloud project
Expand Down Expand Up @@ -100,16 +101,18 @@ dependencies {

#### Minimum SDK Requirements for Android

The `minSdkVersion` for your Android project must be set to 24 or higher in `android/app/build.gradle`:
The `minSdkVersion` for your Android project must be set to 26 or higher in `android/app/build.gradle`:

```groovy
android {
defaultConfig {
minSdkVersion 24
minSdkVersion 26
}
}
```

The `compileSdkVersion` and `targetSdkVersion` should be set to 36 or higher.

#### Set Google Maps API Key

To securely store your API key, it is recommended to use the [Google Maps Secrets Gradle Plugin](https://developers.google.com/maps/documentation/android-sdk/secrets-gradle-plugin). This plugin helps manage API keys without exposing them in your app's source code.
Expand Down
8 changes: 4 additions & 4 deletions android/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -40,16 +40,16 @@ if (isNewArchitectureEnabled()) {
android {
namespace "com.google.android.react.driversdk"

compileSdkVersion 35
compileSdkVersion 36

compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}

defaultConfig {
minSdkVersion 23
targetSdkVersion 34
minSdkVersion 26
targetSdkVersion 36
versionCode 1
// get version name from package.json version
versionName "1.0"
Expand Down Expand Up @@ -85,7 +85,7 @@ repositories {
}

dependencies {
implementation 'com.google.android.libraries.mapsplatform.transportation:transportation-driver:6.2.0'
implementation 'com.google.android.libraries.mapsplatform.transportation:transportation-driver:7.0.0'
implementation 'com.facebook.react:react-native:+'
implementation 'com.android.support:multidex:1.0.3'
implementation 'androidx.constraintlayout:constraintlayout:2.1.4'
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -137,7 +137,7 @@ public void setLocationReportingInterval(int interval, Promise promise) {
return;
}

vehicleReporter.setLocationReportingInterval(new Long(interval), TimeUnit.SECONDS);
vehicleReporter.setLocationReportingInterval(Long.valueOf(interval), TimeUnit.SECONDS);
} catch (Exception e) {
promise.reject(e.toString(), e.getMessage(), e);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,7 @@ public void setLocationReportingInterval(int interval, Promise promise) {
return;
}

vehicleReporter.setLocationReportingInterval(new Long(interval), TimeUnit.SECONDS);
vehicleReporter.setLocationReportingInterval(Long.valueOf(interval), TimeUnit.SECONDS);
} catch (Exception e) {
promise.reject(e.toString(), e.getMessage(), e);
}
Expand Down
4 changes: 4 additions & 0 deletions example/.env.sample
Original file line number Diff line number Diff line change
Expand Up @@ -34,5 +34,9 @@ IOS_HOST=localhost
LMFS_PORT=8091
ODRD_PORT=8092

# Optional: Set vehicle IDs for the example apps (can also be set in the app UI or code)
# LMFS_VEHICLE_ID=your_lmfs_vehicle_id
# ODRD_VEHICLE_ID=your_odrd_vehicle_id

# This is typically `~/.config/gcloud` on MacOS and Linux, or `%APPDATA%\gcloud` on Windows. See ./tools/backend/README.md for more details.
GCLOUD_CONFIG_DIR=~/.config/gcloud
8 changes: 7 additions & 1 deletion example/LMFS/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,13 @@ This is a sample application that show cases developers how to integrate with th

1. This library depends on the LMFS backend available in https://github.com/googlemaps/last-mile-fleet-solution-samples/tree/main/backend. This package provides docker-compose files to run the backend services at `/example/tools/backend` folder. For more information, please refer to the [README](../tools/backend/README.md) file in the tools/backend folder of the example app.
2. Once the backend is setup, create a delivery vehicle and keep the vehicleId handy. In order to make it easier to create vehicles with tasks, you can use the `/upload-delivery-config.html` endpoint on the backend. [example json](https://raw.githubusercontent.com/googlemaps/last-mile-fleet-solution-samples/main/backend/src/test/resources/test.json)
3. Go to the [App.tsx](/example/LMFS/src/App.tsx) file and update the VEHICLE_ID from the endpoint response.
3. Configure the VEHICLE_ID using one of the following methods:
- **Option 1: .env file (Recommended)** - Add the vehicle ID to your `.env` file in the `example` folder:
```
LMFS_VEHICLE_ID=your_vehicle_id
```
- **Option 2: Direct Input** - When you start the app, you can enter the vehicle ID directly in the "VEHICLE_ID Not Configured" screen.
- **Option 3: Code Update** - Go to the [App.tsx](/example/LMFS/src/App.tsx) file and update the VEHICLE_ID_DEFAULT constant with your vehicle ID.

## Setup

Expand Down
2 changes: 1 addition & 1 deletion example/LMFS/android/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ def enableDesugaring = true
buildscript {
ext {
buildToolsVersion = "36.0.0"
minSdkVersion = 34
minSdkVersion = 26
compileSdkVersion = 36
targetSdkVersion = 36
ndkVersion = "27.1.12297006"
Expand Down
10 changes: 8 additions & 2 deletions example/LMFS/babel.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,14 @@ module.exports = getConfig(
{
envName: 'APP_ENV',
path: '../.env',
allowlist: ['PROJECT_ID', 'ANDROID_HOST', 'IOS_HOST', 'LMFS_PORT'],
allowUndefined: false,
allowlist: [
'PROJECT_ID',
'ANDROID_HOST',
'IOS_HOST',
'LMFS_PORT',
'LMFS_VEHICLE_ID',
],
allowUndefined: true,
verbose: false,
},
],
Expand Down
1 change: 1 addition & 0 deletions example/LMFS/env.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,4 +19,5 @@ declare module '@env' {
export const ANDROID_HOST: string;
export const IOS_HOST: string;
export const LMFS_PORT: number;
export const LMFS_VEHICLE_ID: string;
}
142 changes: 111 additions & 31 deletions example/LMFS/src/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
import {
StyleSheet,
Text,
TextInput,
View,
Platform,
Modal,
Expand Down Expand Up @@ -46,6 +47,7 @@ import {
ANDROID_HOST,
IOS_HOST,
LMFS_PORT,
LMFS_VEHICLE_ID,
} from '@env';
import usePermissions from './checkPermissions';

Expand All @@ -56,7 +58,12 @@ const BASE_URL =
: `http://${IOS_HOST}:${LMFS_PORT}`;

// Update this vehicle id from the response from the /upload-delivery-config.html backend endpoint.
const VEHICLE_ID = ''; // ADD_VEHICLE_ID_HERE
// Can also be set via LMFS_VEHICLE_ID in .env file or as environment variable:
// See README.md for configuration options.
const VEHICLE_ID_DEFAULT = LMFS_VEHICLE_ID || ''; // ADD_VEHICLE_ID_HERE

// New location reporting interval in seconds that is applied via menu action.
const NEW_LOCATION_REPORTING_INTERVAL_SECONDS = 20;

const termsAndConditionsDialogOptions: TermsAndConditionsDialogOptions = {
title: 'RN LMFS Sample',
Expand All @@ -78,6 +85,9 @@ function LMFSSampleApp() {
useState(false);
const [authToken, setAuthToken] = useState<string | null>(null);
const [driverSdkVersion, setDriverSdkVersion] = useState<string>('');
const [vehicleId, setVehicleId] = useState<string>(VEHICLE_ID_DEFAULT);
const [tempVehicleId, setTempVehicleId] =
useState<string>(VEHICLE_ID_DEFAULT);

const clearInstance = useCallback(async () => {
await deliveryDriverApi.clearInstance();
Expand Down Expand Up @@ -153,7 +163,33 @@ function LMFSSampleApp() {
[onArrival, onNavigationReady, onNavigationInitError, onRouteStatusResult]
);

const fetchAuthToken = useCallback(async () => {
if (!vehicleId) {
console.log('Vehicle ID not set, skipping auth token fetch');
return;
}
try {
console.log('Fetching auth token...');
const tokenUrl = BASE_URL + '/token/delivery_driver/' + vehicleId;
const response = await fetch(tokenUrl);
const { token } = await response.json();
console.log('Got token:', token);

setAuthToken(token);
} catch (error) {
console.log(
'There has been a problem connecting to the provider, please make sure it is running. ',
error
);
}
}, [vehicleId]);

useEffect(() => {
if (!vehicleId) {
console.log('Vehicle ID not set, skipping initialization');
return;
}

console.log('Init LMFS Example app');
removeListeners(navigationCallbacks);
addListeners(navigationCallbacks);
Expand All @@ -167,31 +203,21 @@ function LMFSSampleApp() {
removeListeners(navigationCallbacks);
clearInstance();
};
}, [clearInstance, navigationCallbacks, addListeners, removeListeners]);

const fetchAuthToken = async () => {
try {
console.log('Fetching auth token...');
const tokenUrl = BASE_URL + '/token/delivery_driver/' + VEHICLE_ID;
const response = await fetch(tokenUrl);
const { token } = await response.json();
console.log('Got token:', token);

setAuthToken(token);
} catch (error) {
console.log(
'There has been a problem connecting to the provider, please make sure it is running. ',
error
);
}
};
}, [
clearInstance,
navigationCallbacks,
addListeners,
removeListeners,
vehicleId,
fetchAuthToken,
]);

const createInstance = async () => {
try {
console.log('Creating LMFS instance');
await deliveryDriverApi.initialize(
PROVIDER_ID,
VEHICLE_ID,
vehicleId,
_tokenContext => {
console.log('onGetToken call, return token: ', authToken);
// Check if the token is expired, in such case request a new one.
Expand Down Expand Up @@ -237,11 +263,14 @@ function LMFSSampleApp() {
}
};

const setUpdateInterval = async () => {
const setLocationReportingInterval = async () => {
try {
await deliveryDriverApi
.getDeliveryVehicleReporter()
.setLocationReportingInterval(20);
.setLocationReportingInterval(NEW_LOCATION_REPORTING_INTERVAL_SECONDS);
console.log(
`Location reporting interval set to ${NEW_LOCATION_REPORTING_INTERVAL_SECONDS} seconds`
);
} catch (e) {
console.error(e);
}
Expand Down Expand Up @@ -313,19 +342,54 @@ function LMFSSampleApp() {
const controlsButtonColor = '#d32f2f';
const controlsButtonColorPressed = '#a12020';

if (!VEHICLE_ID) {
const handleSetVehicleId = () => {
if (tempVehicleId.trim()) {
setVehicleId(tempVehicleId.trim());
}
};

if (!vehicleId) {
return (
<SafeAreaView style={styles.container} edges={['top', 'bottom']}>
<View style={styles.alertContainer}>
<Text style={styles.alertTitle}>VEHICLE_ID Not Configured</Text>
<Text style={styles.alertMessage}>
Please set the VEHICLE_ID in App.tsx before running the app.
Please set the VEHICLE_ID to continue.
</Text>
<Text style={styles.alertInstructions}>
To configure:
{'\n'}1. Follow the setup instructions in the README
{'\n'}2. Create a delivery vehicle using the backend
{'\n'}3. Update VEHICLE_ID in example/LMFS/src/App.tsx
You can configure the vehicle ID in one of three ways:
{'\n'}
{'\n'}1. Add it to your .env file:
{'\n'} LMFS_VEHICLE_ID=your_vehicle_id
{'\n'}
{'\n'}2. Enter it directly below:
</Text>
<View style={styles.inputContainer}>
<TextInput
style={styles.input}
placeholder="Enter Vehicle ID"
placeholderTextColor="#999"
value={tempVehicleId}
onChangeText={setTempVehicleId}
autoCapitalize="none"
autoCorrect={false}
/>
<View style={styles.buttonWrapper}>
<ActionButton
title="Set Vehicle ID"
onPress={handleSetVehicleId}
backgroundColor={buttonBackgroundColor}
pressedBackgroundColor={buttonBackgroundColorPressed}
/>
</View>
</View>
<Text style={styles.alertInstructions}>
{'\n'}3. Update VEHICLE_ID_DEFAULT in example/LMFS/src/App.tsx
{'\n'}
{'\n'}To create a vehicle:
{'\n'}• Follow the setup instructions in the README
{'\n'}• Create a delivery vehicle using the backend
{'\n'}• Use the vehicle ID from the response
{'\n'}
{'\n'}See README.md for detailed instructions.
</Text>
Expand Down Expand Up @@ -355,7 +419,7 @@ function LMFSSampleApp() {
numberOfLines={1}
ellipsizeMode="tail"
>
Vehicle ID: {VEHICLE_ID || 'Not set'}
Vehicle ID: {vehicleId || 'Not set'}
</Text>
<Text
style={styles.versionText}
Expand Down Expand Up @@ -402,8 +466,8 @@ function LMFSSampleApp() {
</View>
<View style={styles.buttonWrapper}>
<ActionButton
title="Update time interval"
onPress={setUpdateInterval}
title={`Set Location Reporting Interval to ${NEW_LOCATION_REPORTING_INTERVAL_SECONDS}s`}
onPress={setLocationReportingInterval}
backgroundColor={buttonBackgroundColor}
pressedBackgroundColor={buttonBackgroundColorPressed}
/>
Expand Down Expand Up @@ -642,6 +706,22 @@ const styles = StyleSheet.create({
color: '#0b1a2a',
fontWeight: '600',
},
inputContainer: {
marginVertical: 16,
width: '100%',
maxWidth: 400,
},
input: {
backgroundColor: '#ffffff',
borderWidth: 1,
borderColor: '#ccc',
borderRadius: 8,
paddingVertical: 12,
paddingHorizontal: 16,
fontSize: 16,
color: '#0b1a2a',
marginBottom: 12,
},
});

export default App;
8 changes: 7 additions & 1 deletion example/ODRD/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,13 @@ curl -X POST http://localhost:8092/vehicle/new \
}'
```

1. Go to the [App.tsx](/example/ODRD/App.tsx) file and update the VEHICLE_ID according to your configuration.
1. Configure the VEHICLE_ID using one of the following methods:
- **Option 1: .env file (Recommended)** - Add the vehicle ID to your `.env` file in the `example` folder:
```
ODRD_VEHICLE_ID=your_vehicle_id
```
- **Option 2: Direct Input** - When you start the app, you can enter the vehicle ID directly in the "VEHICLE_ID Not Configured" screen.
- **Option 3: Code Update** - Go to the [App.tsx](/example/ODRD/src/App.tsx) file and update the VEHICLE_ID_DEFAULT constant with your vehicle ID.

## Setup

Expand Down
2 changes: 1 addition & 1 deletion example/ODRD/android/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ def enableDesugaring = true
buildscript {
ext {
buildToolsVersion = "36.0.0"
minSdkVersion = 34
minSdkVersion = 26
compileSdkVersion = 36
targetSdkVersion = 36
ndkVersion = "27.1.12297006"
Expand Down
Loading