react-native-radar 3.7.6-beta.1 → 3.7.6-beta.4

package/android/build.gradle

@@ -18,7 +18,7 @@ android {
         minSdkVersion 16
         targetSdkVersion 31
         versionCode 1
-        versionName '3.7.6-beta.1'
+        versionName '3.7.5'
     }
     lintOptions {
         abortOnError false

package/ios/RNRadar.h

@@ -1,5 +1,4 @@
 #import <RadarSDK/RadarSDK.h>
-#import <RadarSDK/RadarSettings.h>
 #import <React/RCTBridgeModule.h>
 #import <React/RCTEventEmitter.h>
 

package/ios/RNRadar.m

@@ -139,14 +139,6 @@ RCT_EXPORT_METHOD(setAnonymousTrackingEnabled:(BOOL)enabled) {
     [Radar setAnonymousTrackingEnabled:enabled];
 }
 
-RCT_EXPORT_METHOD(host:(RCTPromiseResolveBlock)resolve reject:(RCTPromiseRejectBlock)reject) {
-    resolve([RadarSettings host]);
-}
-
-RCT_EXPORT_METHOD(publishableKey:(RCTPromiseResolveBlock)resolve reject:(RCTPromiseRejectBlock)reject) {
-    resolve([RadarSettings publishableKey]);
-}
-
 RCT_REMAP_METHOD(getPermissionsStatus, getPermissionsStatusWithResolver:(RCTPromiseResolveBlock)resolve rejecter:(RCTPromiseRejectBlock)reject) {
     CLAuthorizationStatus status = [CLLocationManager authorizationStatus];
     NSString *statusStr;
@@ -737,16 +729,19 @@ RCT_EXPORT_METHOD(autocomplete:(NSDictionary *)optionsDict resolve:(RCTPromiseRe
     }
 
     NSDictionary *nearDict = optionsDict[@"near"];
-    CLLocation *near = nil;
-    if (nearDict && [nearDict isKindOfClass:[NSDictionary class]]) {
-        double latitude = [RCTConvert double:nearDict[@"latitude"]];
-        double longitude = [RCTConvert double:nearDict[@"longitude"]];
-        NSDate *timestamp = [NSDate new];
-        near = [[CLLocation alloc] initWithCoordinate:CLLocationCoordinate2DMake(latitude, longitude) altitude:-1 horizontalAccuracy:5 verticalAccuracy:-1 timestamp:timestamp];
-    }
+    if (nearDict == nil || ![nearDict isKindOfClass:[NSDictionary class]]) {
+        if (reject) {
+            reject([Radar stringForStatus:RadarStatusErrorBadRequest], [Radar stringForStatus:RadarStatusErrorBadRequest], nil);
+        }
 
+        return;
+    }
 
     NSString *query = optionsDict[@"query"];
+    double latitude = [RCTConvert double:nearDict[@"latitude"]];
+    double longitude = [RCTConvert double:nearDict[@"longitude"]];
+    NSDate *timestamp = [NSDate new];
+    CLLocation *near = [[CLLocation alloc] initWithCoordinate:CLLocationCoordinate2DMake(latitude, longitude) altitude:-1 horizontalAccuracy:5 verticalAccuracy:-1 timestamp:timestamp];
     NSNumber *limitNumber = optionsDict[@"limit"];
     int limit;
     if (limitNumber != nil && [limitNumber isKindOfClass:[NSNumber class]]) {

package/js/index.js

@@ -1,12 +1,9 @@
 import { Platform } from 'react-native';
 
 let module = {};
-if (Platform.OS === 'web') {
-  module = require('./index.web').default;
-} else {
+if (Platform.OS === 'web')
+  module =  require('./index.web').default;
+else
   module = require('./index.native').default;
-}
-export default module;
 
-export { default as Autocomplete } from './ui/autocomplete';
-export { default as Map } from './ui/map';
+export default module;

package/package.json

@@ -3,7 +3,7 @@
   "description": "React Native module for Radar, the leading geofencing and location tracking platform",
   "homepage": "https://radar.com",
   "license": "Apache-2.0",
-  "version": "3.7.6-beta.1",
+  "version": "3.7.6-beta.4",
   "main": "js/index.js",
   "files": [
     "android",
@@ -13,7 +13,9 @@
     "react-native-radar.podspec"
   ],
   "scripts": {
-    "test": "jest ./test/*.test.js"
+    "test": "jest ./test/*.test.js",
+    "check-latest-tag": "node ./scripts/check-latest-tag.cjs",
+    "check-beta-tag": "node ./scripts/check-beta-tag.cjs"
   },
   "jest": {
     "preset": "react-native",
@@ -25,8 +27,7 @@
   },
   "peerDependencies": {
     "react": ">= 16.8.6",
-    "react-native": ">= 0.60.0",
-    "@maplibre/maplibre-react-native": "^9.0.1"
+    "react-native": ">= 0.60.0"
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",

package/js/helpers.js

@@ -1,15 +0,0 @@
-import { NativeModules, Platform } from 'react-native';
-
-if (!NativeModules.RNRadar && (Platform.OS === 'ios' || Platform.OS === 'android')) {
-  throw new Error('NativeModules.RNRadar is undefined');
-}
-
-const getHost = () => (
-  NativeModules.RNRadar.host()
-);
-
-const getPublishableKey = () => (
-  NativeModules.RNRadar.publishableKey()
-);
-
-export { getHost, getPublishableKey };

package/js/ui/README.md

@@ -1,67 +0,0 @@
-## Example usage
-
-We provide UI elements for autocomplete & maps to make building easy.
-
-If you're using the Map element, you'll need to install [Maplibre React Native](https://github.com/maplibre/maplibre-react-native).
-```
-npm install @maplibre/maplibre-react-native
-```
-
-Then make sure to complete required [platform specific installation steps](https://github.com/maplibre/maplibre-react-native/blob/main/docs/GettingStarted.md#review-platform-specific-info) as well.
-
-### Adding a map
-
-We've taken care of linking the map tile server to the map, so all you need to do is make sure you've initialized the Radar SDK and use `<Map>`
-
-```
-import {StyleSheet, View} from 'react-native';
-import Radar, { Map } from 'react-native-radar';
-
-export default function App() {
-    Radar.initialize('prj_place_your_own_token_here');
-    
-    // A quirk of Map Libre requires us to set their deprecated access token to null
-    MapLibreGL.setAccessToken(null);
-
-    return (
-        <View style={styles.page}>
-            <Map />
-        </View>
-    );
-}
-```
-
-TODO: fill in details on customization, including using MapLibre elements
-
-### Adding an address autocomplete
-
-Adding an address search autocomplete is similarly easy. Our `<Autocomplete>` element is comprised of a TextInput and Flatlist with the results.
-
-The example below provides optional `location` and `onSelect` props to the component. Providing a location will improve autocomplete result quality. Without it, the API utilizes the IP address location to rank results.
-
-```
-import Radar, { Map } from 'react-native-radar';
-
-export default function App() {
-    const [location, setLocation] = useState(null);
-
-    Radar.trackOnce().then((result) => {
-        setLocation({
-          latitude: result.location.latitude,
-          longitude: result.location.longitude,
-        });
-      });
-
-    const onSelect (selectedAddress) => {
-        // Do something with the selected address
-    }
-
-    return (
-        <View style={style.page}>
-            <Autocomplete location={location} onSelect={onSelect} />
-        </View>
-    );
-}
-```
-
-TODO: fill in details of customization

package/js/ui/autocomplete.jsx

@@ -1,280 +0,0 @@
-// Autocomplete.js
-import React, { useState, useCallback, useRef } from 'react';
-import {
-  View,
-  TextInput,
-  FlatList,
-  TouchableOpacity,
-  Text,
-  StyleSheet,
-  Image,
-} from 'react-native';
-import Radar from '../index.native';
-
-const defaultStyles = StyleSheet.create({
-  container: {
-    width: '100%',
-    alignItems: 'center',
-    justifyContent: 'center',
-    padding: 8,
-  },
-  inputContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    width: '95%',
-    backgroundColor: 'white',
-    borderRadius: 5,
-    shadowColor: "#061A2B",
-    shadowOffset: {
-      width: 0,
-      height: 4,
-    },
-    shadowOpacity: 0.1,
-    shadowRadius: 12,
-    elevation: 5,
-  },
-  inputIcon: {
-    marginLeft: 10,
-    height: 18,
-    width: 18,
-    backgroundColor: 'white',
-    color: 'white',
-  },
-  input: {
-    flex: 1,
-    backgroundColor: 'white',
-    height: 40,
-    fontSize: 14,
-    paddingTop: 2,
-    paddingHorizontal: 8,
-    borderRadius: 5,
-    shadowOpacity: 0,
-  },
-  inputFocused: {
-    shadowColor: "#81BEFF",
-    shadowOffset: {
-      width: 0,
-      height: 0,
-    },
-    shadowOpacity: 1,
-    shadowRadius: 4,
-    elevation: 4,
-  },
-  resultListWrapper: {
-    width: '95%',
-    marginTop: 8,
-    backgroundColor: 'white',
-    borderRadius: 5,
-    paddingVertical: 8,
-    paddingHorizontal: 8,
-    shadowColor: "#061A2B",
-    shadowOffset: {
-      width: 0,
-      height: 4,
-    },
-    shadowOpacity: 0.1,
-    shadowRadius: 12,
-    elevation: 5,
-  },
-  resultList: {
-    width: '100%',
-  },
-  resultItem: {
-    paddingRight: 16,
-    paddingVertical: 8,
-    height: 56,
-    fontSize: 12,
-  },
-  addressContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  pinIconContainer: {
-    width: 28,
-  },
-  pinIcon: {
-    height: 20,
-    width: 20,
-    marginRight: 8,
-    marginBottom: 14,
-  },
-  addressTextContainer: {
-    flex: 1,
-  },
-  addressText: {
-    fontSize: 14,
-    color: '#000',
-    fontWeight: '600',
-  },
-  addressSubtext: {
-    fontSize: 12,
-    color: '#5A6872',
-  },
-  footerContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    padding: 10,
-    alignSelf: 'flex-end',
-  },
-  footerText: {
-    marginTop: 2,
-    marginRight: 4,
-    fontSize: 10,
-    color: '#5A6872',
-  },
-  logo: {
-    width: 50,
-    height: 15,
-    resizeMode: 'contain',
-  },
-});
-
-const defaultAutocompleteOptions = {
-  debounceMS: 200,
-  threshold: 3,
-  limit: 8,
-  placeholder: 'Search address',
-  showPin: true,
-};
-
-const autocompleteUI = ({ options = {}, onSelect, location, style = {} }) => {
-  const [query, setQuery] = useState('');
-  const [results, setResults] = useState([]);
-  const [isOpen, setIsOpen] = useState(false);
-  const [isInputFocused, setInputFocused] = useState(false);
-  const timerRef = useRef(null);
-
-  const config = { ...defaultAutocompleteOptions, ...options };
-
-  const fetchResults = useCallback(async (searchQuery) => {
-    if (searchQuery.length < config.threshold) return;
-
-    const params = { query: searchQuery, limit: config.limit };
-
-    if (location && location.latitude && location.longitude) {
-      params.near = location;
-    }
-
-    try {
-      const result = await Radar.autocomplete(params);
-      setResults(result.addresses);
-      setIsOpen(true);
-    } catch (error) {
-      if (config.onError && typeof config.onError === 'function') {
-        config.onError(error);
-      }
-    }
-  }, [config]);
-
-  const handleInput = useCallback(
-    (text) => {
-      setQuery(text);
-
-      // Clear the existing timer
-      if (timerRef.current) {
-        clearTimeout(timerRef.current);
-      }
-
-      if (text.length < config.threshold) {
-        return;
-      }
-
-      // Set the new timer
-      timerRef.current = setTimeout(() => {
-        fetchResults(text);
-      }, config.debounceMS);
-    },
-    [config, fetchResults],
-  );
-
-  const handleSelect = (item) => {
-    setQuery(item.formattedAddress);
-    setIsOpen(false);
-
-    if (typeof onSelect === 'function') {
-      onSelect(item);
-    }
-  };
-
-  const renderFooter = () => {
-    if (results.length === 0) return null;
-
-    return (
-      <View style={styles.footerContainer}>
-        <View style={{ flexDirection: 'row', alignItems: 'center' }}>
-          <Text style={styles.footerText}>Powered by</Text>
-          <Image source={require('./radar-logo.png')} resizeMode="contain" style={defaultStyles.logo} />
-        </View>
-      </View>
-    );
-  };
-
-  const renderItem = ({ item }) => (
-    <TouchableOpacity style={styles.resultItem} onPress={() => handleSelect(item)}>
-      <View style={styles.addressContainer}>
-        <View style={styles.pinIconContainer}>
-          {config.showPin ? (
-            <Image source={require('./marker.png')} style={styles.pinIcon} />
-          ) : null}
-        </View>
-        <View style={styles.addressTextContainer}>
-          <Text numberOfLines={1} style={styles.addressText}>
-            {item.addressLabel || item?.placeLabel}
-          </Text>
-          <Text numberOfLines={1} style={styles.addressSubtext}>
-            {item?.formattedAddress?.replace(`${item?.addressLabel || item?.placeLabel}, `, '')}
-          </Text>
-        </View>
-      </View>
-    </TouchableOpacity>
-  );
-
-  const styles = {
-    ...defaultStyles,
-    container: StyleSheet.compose(defaultStyles.container, style.container),
-    input: StyleSheet.compose(defaultStyles.input, style.input),
-    resultList: StyleSheet.compose(defaultStyles.resultList, style.resultList),
-    resultItem: StyleSheet.compose(defaultStyles.resultItem, style.resultItem),
-    addressContainer: StyleSheet.compose(defaultStyles.addressContainer, style.addressContainer),
-    pinIconContainer: StyleSheet.compose(defaultStyles.pinIconContainer, style.pinIconContainer),
-    pinIcon: StyleSheet.compose(defaultStyles.pinIcon, style.pinIcon),
-    addressTextContainer: StyleSheet.compose(defaultStyles.addressTextContainer, style.addressTextContainer),
-    addressText: StyleSheet.compose(defaultStyles.addressText, style.addressText),
-    addressSubtext: StyleSheet.compose(defaultStyles.addressSubtext, style.addressSubtext),
-    footerContainer: StyleSheet.compose(defaultStyles.footerContainer, style.footerContainer),
-    footerText: StyleSheet.compose(defaultStyles.footerText, style.footerText),
-  };
-
-  const inputStyle = isInputFocused
-    ? StyleSheet.compose(styles.inputContainer, defaultStyles.inputFocused)
-    : styles.inputContainer;
-
-  return (
-    <View style={styles.container}>
-      <View style={inputStyle}>
-        <Image source={require('./search.png')} style={styles.inputIcon} />
-        <TextInput
-          style={styles.input}
-          onChangeText={handleInput}
-          onFocus={() => setInputFocused(true)}
-          onBlur={() => setInputFocused(false)}
-          value={query}
-          placeholder={config.placeholder}
-        />
-      </View>
-      {isOpen && (
-        <View style={defaultStyles.resultListWrapper}>
-          <FlatList
-            style={styles.resultList}
-            data={results}
-            renderItem={renderItem}
-            keyExtractor={(item) => item.formattedAddress + item.postalCode}
-            ListFooterComponent={renderFooter}
-          />
-        </View>
-      )}
-    </View>
-  );
-};
-
-export default autocompleteUI;

package/js/ui/map.jsx

@@ -1,66 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { StyleSheet, View, Image } from 'react-native';
-import MapLibreGL from '@maplibre/maplibre-react-native';
-import { getHost, getPublishableKey } from '../helpers';
-
-const DEFAULT_STYLE = 'radar-default-v1';
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-  map: {
-    flex: 1,
-  },
-  logo: {
-    position: 'absolute',
-    bottom: -10,
-    left: 5,
-    width: 50,
-    height: 50,
-    resizeMode: 'contain',
-  },
-});
-
-const createStyleURL = async (style = DEFAULT_STYLE) => {
-  const host = await getHost();
-  const publishableKey = await getPublishableKey();
-  return `${host}/maps/styles/${style}?publishableKey=${publishableKey}`;
-};
-
-const RadarMap = ({ mapOptions, children }) => {
-  const [styleURL, setStyleURL] = useState(null);
-
-  useEffect(() => {
-    createStyleURL(mapOptions?.mapStyle || DEFAULT_STYLE).then((result) => {
-      setStyleURL(result);
-    });
-  }, [mapOptions]);
-
-  if (!styleURL) {
-    return null;
-  }
-
-  return (
-    <View style={styles.container}>
-      <MapLibreGL.MapView
-        style={styles.map}
-        pitchEnabled={false}
-        compassEnabled={false}
-        logoEnabled={false}
-        attributionEnabled
-        onRegionDidChange={mapOptions.onRegionDidChange ? mapOptions.onRegionDidChange : null}
-        styleURL={styleURL}
-      >
-        <MapLibreGL.UserLocation />
-        {children}
-      </MapLibreGL.MapView>
-      <Image
-        source={require('./map-logo.png')}
-        style={styles.logo}
-      />
-    </View>
-  );
-};
-
-export default RadarMap;