From 48cdff5aec9d625cc66e8aae9c635161476af76a Mon Sep 17 00:00:00 2001 From: Bart Akeley Date: Sun, 18 Jun 2017 20:58:43 -0500 Subject: [PATCH] google places modal integrated into create food item page --- android/app/build.gradle | 1 + android/app/src/main/AndroidManifest.xml | 4 ++ .../com/aretherecookies/MainApplication.java | 4 +- android/settings.gradle | 2 + ios/AreThereCookies.xcodeproj/project.pbxproj | 56 ++++++++++++++++++- js/modals/PlaceModal.js | 54 ------------------ js/pages/CreateFoodItem.js | 27 ++++++++- js/records/PlaceRecord.js | 10 ++-- package.json | 3 +- yarn.lock | 4 ++ 10 files changed, 100 insertions(+), 65 deletions(-) delete mode 100644 js/modals/PlaceModal.js diff --git a/android/app/build.gradle b/android/app/build.gradle index 2494547..cd0b6c0 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -127,6 +127,7 @@ android { } dependencies { + compile project(':react-native-google-places') compile fileTree(dir: "libs", include: ["*.jar"]) compile "com.android.support:appcompat-v7:23.0.1" compile "com.facebook.react:react-native:+" // From node_modules diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml index b514094..7dbf4dd 100644 --- a/android/app/src/main/AndroidManifest.xml +++ b/android/app/src/main/AndroidManifest.xml @@ -5,6 +5,7 @@ + + diff --git a/android/app/src/main/java/com/aretherecookies/MainApplication.java b/android/app/src/main/java/com/aretherecookies/MainApplication.java index a6d2296..a6efc74 100644 --- a/android/app/src/main/java/com/aretherecookies/MainApplication.java +++ b/android/app/src/main/java/com/aretherecookies/MainApplication.java @@ -3,6 +3,7 @@ package com.aretherecookies; import android.app.Application; import com.facebook.react.ReactApplication; +import com.arttitude360.reactnative.rngoogleplaces.RNGooglePlacesPackage; import com.facebook.react.ReactNativeHost; import com.facebook.react.ReactPackage; import com.facebook.react.shell.MainReactPackage; @@ -22,7 +23,8 @@ public class MainApplication extends Application implements ReactApplication { @Override protected List getPackages() { return Arrays.asList( - new MainReactPackage() + new MainReactPackage(), + new RNGooglePlacesPackage() ); } }; diff --git a/android/settings.gradle b/android/settings.gradle index f3e27d6..9b0fd6e 100644 --- a/android/settings.gradle +++ b/android/settings.gradle @@ -1,3 +1,5 @@ rootProject.name = 'AreThereCookies' +include ':react-native-google-places' +project(':react-native-google-places').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-google-places/android') include ':app' diff --git a/ios/AreThereCookies.xcodeproj/project.pbxproj b/ios/AreThereCookies.xcodeproj/project.pbxproj index 1cd0ee4..55a1547 100644 --- a/ios/AreThereCookies.xcodeproj/project.pbxproj +++ b/ios/AreThereCookies.xcodeproj/project.pbxproj @@ -5,7 +5,6 @@ }; objectVersion = 46; objects = { - /* Begin PBXBuildFile section */ 00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; }; 00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; }; @@ -36,6 +35,7 @@ 2DCD954D1E0B4F2C00145EB5 /* AreThereCookiesTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* AreThereCookiesTests.m */; }; 5E9157361DD0AC6A00FF2AA8 /* libRCTAnimation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */; }; 832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; }; + 280E457CAD9348CA8B03DD47 /* libRNGooglePlaces.a in Frameworks */ = {isa = PBXBuildFile; fileRef = ABA925E808304E17AEDC016B /* libRNGooglePlaces.a */; }; /* End PBXBuildFile section */ /* Begin PBXContainerItemProxy section */ @@ -255,6 +255,8 @@ 5E91572D1DD0AC6500FF2AA8 /* RCTAnimation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAnimation.xcodeproj; path = "../node_modules/react-native/Libraries/NativeAnimation/RCTAnimation.xcodeproj"; sourceTree = ""; }; 78C398B01ACF4ADC00677621 /* RCTLinking.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTLinking.xcodeproj; path = "../node_modules/react-native/Libraries/LinkingIOS/RCTLinking.xcodeproj"; sourceTree = ""; }; 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTText.xcodeproj; path = "../node_modules/react-native/Libraries/Text/RCTText.xcodeproj"; sourceTree = ""; }; + 8A9E50571CB24ACDB143CECA /* RNGooglePlaces.xcodeproj */ = {isa = PBXFileReference; name = "RNGooglePlaces.xcodeproj"; path = "../node_modules/react-native-google-places/ios/RNGooglePlaces.xcodeproj"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; }; + ABA925E808304E17AEDC016B /* libRNGooglePlaces.a */ = {isa = PBXFileReference; name = "libRNGooglePlaces.a"; path = "libRNGooglePlaces.a"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; }; /* End PBXFileReference section */ /* Begin PBXFrameworksBuildPhase section */ @@ -281,6 +283,7 @@ 832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */, 00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */, 139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */, + 280E457CAD9348CA8B03DD47 /* libRNGooglePlaces.a in Frameworks */, ); runOnlyForDeploymentPostprocessing = 0; }; @@ -447,6 +450,7 @@ 832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */, 00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */, 139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */, + 8A9E50571CB24ACDB143CECA /* RNGooglePlaces.xcodeproj */, ); name = Libraries; sourceTree = ""; @@ -564,7 +568,7 @@ 83CBB9F71A601CBA00E9B192 /* Project object */ = { isa = PBXProject; attributes = { - LastUpgradeCheck = 0610; + LastUpgradeCheck = 610; ORGANIZATIONNAME = Facebook; TargetAttributes = { 00E356ED1AD99517003FC87E = { @@ -972,6 +976,14 @@ ); PRODUCT_NAME = "$(TARGET_NAME)"; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/AreThereCookies.app/AreThereCookies"; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); + HEADER_SEARCH_PATHS = ( + "$(inherited)", + "$(SRCROOT)/../node_modules/react-native-google-places/ios", + ); }; name = Debug; }; @@ -989,6 +1001,14 @@ ); PRODUCT_NAME = "$(TARGET_NAME)"; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/AreThereCookies.app/AreThereCookies"; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); + HEADER_SEARCH_PATHS = ( + "$(inherited)", + "$(SRCROOT)/../node_modules/react-native-google-places/ios", + ); }; name = Release; }; @@ -1007,6 +1027,10 @@ ); PRODUCT_NAME = AreThereCookies; VERSIONING_SYSTEM = "apple-generic"; + HEADER_SEARCH_PATHS = ( + "$(inherited)", + "$(SRCROOT)/../node_modules/react-native-google-places/ios", + ); }; name = Debug; }; @@ -1024,6 +1048,10 @@ ); PRODUCT_NAME = AreThereCookies; VERSIONING_SYSTEM = "apple-generic"; + HEADER_SEARCH_PATHS = ( + "$(inherited)", + "$(SRCROOT)/../node_modules/react-native-google-places/ios", + ); }; name = Release; }; @@ -1050,6 +1078,14 @@ SDKROOT = appletvos; TARGETED_DEVICE_FAMILY = 3; TVOS_DEPLOYMENT_TARGET = 9.2; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); + HEADER_SEARCH_PATHS = ( + "$(inherited)", + "$(SRCROOT)/../node_modules/react-native-google-places/ios", + ); }; name = Debug; }; @@ -1076,6 +1112,14 @@ SDKROOT = appletvos; TARGETED_DEVICE_FAMILY = 3; TVOS_DEPLOYMENT_TARGET = 9.2; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); + HEADER_SEARCH_PATHS = ( + "$(inherited)", + "$(SRCROOT)/../node_modules/react-native-google-places/ios", + ); }; name = Release; }; @@ -1097,6 +1141,10 @@ SDKROOT = appletvos; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/AreThereCookies-tvOS.app/AreThereCookies-tvOS"; TVOS_DEPLOYMENT_TARGET = 10.1; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); }; name = Debug; }; @@ -1118,6 +1166,10 @@ SDKROOT = appletvos; TEST_HOST = "$(BUILT_PRODUCTS_DIR)/AreThereCookies-tvOS.app/AreThereCookies-tvOS"; TVOS_DEPLOYMENT_TARGET = 10.1; + LIBRARY_SEARCH_PATHS = ( + "$(inherited)", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + ); }; name = Release; }; diff --git a/js/modals/PlaceModal.js b/js/modals/PlaceModal.js deleted file mode 100644 index a70a498..0000000 --- a/js/modals/PlaceModal.js +++ /dev/null @@ -1,54 +0,0 @@ -// @flow -import React, { Component } from 'react'; -import { View } from 'react-native'; -import Modal, { TextInputHeader } from '../components/Modal'; -import typeof PlaceRecord from '../records/PlaceRecord'; - -class PlaceModal extends Component { - static displayName = 'PlaceModal'; - - props: { - isVisible: boolean, - onClose: () => void, - onUpdate: (place: PlaceRecord) => void, - }; - - state: { - place: ?PlaceRecord, - }; - - state = { - place: null, - }; - - save = () => { - const { place } = this.state; - const { onClose, onUpdate } = this.props; - - if (!place) { - return; - } - - onUpdate(place); - onClose(); - }; - - setText = (place: PlaceRecord) => { - this.setState({ place }); - }; - - render() { - const { isVisible, onClose } = this.props; - const { place } = this.state; - const text = (place || {}).name; - return ( - - - - - - ); - } -} - -export default PlaceModal; diff --git a/js/pages/CreateFoodItem.js b/js/pages/CreateFoodItem.js index 1050b08..116d17d 100644 --- a/js/pages/CreateFoodItem.js +++ b/js/pages/CreateFoodItem.js @@ -4,9 +4,11 @@ import { View, Text, TouchableOpacity } from 'react-native'; import theme from '../ui-theme'; import { Divider } from 'react-native-material-ui'; import FoodItemRecord from '../records/FoodItemRecord'; +import PlaceRecord from '../records/PlaceRecord'; import NameModal from '../modals/FoodItemNameModal'; import QuantityPicker from '../components/QuantityPicker'; import { compose, branch, withState, withHandlers, renderComponent, mapProps } from 'recompose'; +import RNGooglePlaces from 'react-native-google-places'; const fieldStyle = { paddingTop: 10, @@ -25,6 +27,12 @@ const Field = ({ onPress, text = '' }: { onPress?: Function, text: string }) => ; +const openPlaceModal = (onChoosePlace: (place: Object) => void) => () => { + RNGooglePlaces.openAutocompleteModal({ type: 'establishment' }).then(onChoosePlace).catch(error => { + throw error; + }); +}; + type Props = { foodItem: typeof FoodItemRecord, modalsVisible: { @@ -35,12 +43,26 @@ type Props = { toggleModal: Function, setFoodItem: Function, setModalsVisible: Function, + place: typeof PlaceRecord, + setPlace: Function, }; -const CreateFoodItem = ({ foodItem, toggleModal, setPropOfFoodItem }: Props) => { +const CreateFoodItem = ({ foodItem, toggleModal, setPropOfFoodItem, place, setPlace }: Props) => { + const updatePlace = ({ placeID: id, latitude, longitude, name, address }) => { + const newPlace = new PlaceRecord({ + id, + name, + address, + latitude, + longitude, + }); + setPlace(newPlace); + setPropOfFoodItem('placeId')(newPlace.id); + }; + return ( - + (prop: string) => (value: any) => { diff --git a/js/records/PlaceRecord.js b/js/records/PlaceRecord.js index 0704341..ea30889 100644 --- a/js/records/PlaceRecord.js +++ b/js/records/PlaceRecord.js @@ -1,20 +1,20 @@ // @flow -import { List, Record } from 'immutable'; +import { Record } from 'immutable'; export type Place = { id: ?number, name: string, address: string, - images: List, - thumb: string, + latitude: ?number, + longitude: ?number, }; const FoodRecordDefaults: Place = { id: null, name: '', address: '', - images: List(), - thumb: '', + latitude: null, + longitude: null, }; export default Record(FoodRecordDefaults, 'PlaceRecord'); diff --git a/package.json b/package.json index 3b02c0c..96bbfeb 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "react": "~15.4.1", "react-native": "~0.42.0", "react-native-drawer": "^2.3.0", + "react-native-google-places": "^2.1.0", "react-native-looped-carousel": "^0.1.5", "react-native-material-ui": "^1.7.0", "react-native-modal": "^2.2.0", @@ -39,4 +40,4 @@ "jest": { "preset": "react-native" } -} \ No newline at end of file +} diff --git a/yarn.lock b/yarn.lock index 424f0ed..f927415 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3551,6 +3551,10 @@ react-native-drawer@^2.3.0: dependencies: tween-functions "^1.0.1" +react-native-google-places@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/react-native-google-places/-/react-native-google-places-2.1.0.tgz#93ceb61b1349fa19d320f32c77b0441985b42d5a" + react-native-looped-carousel@^0.1.5: version "0.1.7" resolved "https://registry.yarnpkg.com/react-native-looped-carousel/-/react-native-looped-carousel-0.1.7.tgz#9e81aec732039250568e367383d0bd70ba4173e9"