-Hotspot onboarding flow complete & working. Needs styling, device pi…

…cker

ios/Podfile

@@ -1,11 +1,13 @@
 require File.join(File.dirname(`node --print "require.resolve('expo/package.json')"`), "scripts/autolinking")
 require_relative '../node_modules/react-native/scripts/react_native_pods'
 require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
+require_relative '../node_modules/react-native-permissions/scripts/setup'
 
 platform :ios, '13.0'
 prepare_react_native_project!
 $RNMapboxMapsImpl = 'mapbox'
 
+
 # If you are using a `react-native-flipper` your iOS build will fail when `NO_FLIPPER=1` is set.
 # because `react-native-flipper` depends on (FlipperKit,...) that will be excluded
 #
@@ -76,6 +78,10 @@ target 'HeliumWallet' do
     $RNMapboxMaps.pre_install(installer)
   end
 
+
+  permissions_path = '../node_modules/react-native-permissions/ios'
+  setup_permissions(['BluetoothPeripheral'])
+
   post_install do |installer|
     $RNMapboxMaps.post_install(installer)
 

ios/Podfile.lock

@@ -59,7 +59,7 @@ PODS:
     - ReactCommon/turbomodule/core (= 0.71.5)
   - fmt (6.2.1)
   - glog (0.3.5)
-  - helium-react-native-sdk (1.0.0):
+  - helium-react-native-sdk (2.1.4):
     - React-Core
   - hermes-engine (0.71.5):
     - hermes-engine/Pre-built (= 0.71.5)
@@ -499,6 +499,8 @@ PODS:
     - Turf
   - RNOS (1.2.6):
     - React
+  - RNPermissions (3.9.0):
+    - React-Core
   - RNReactNativeSharedGroupPreferences (1.1.23):
     - React
   - RNReanimated (2.14.4):
@@ -633,6 +635,7 @@ DEPENDENCIES:
   - RNLocalize (from `../node_modules/react-native-localize`)
   - "rnmapbox-maps (from `../node_modules/@rnmapbox/maps`)"
   - RNOS (from `../node_modules/react-native-os`)
+  - RNPermissions (from `../node_modules/react-native-permissions`)
   - RNReactNativeSharedGroupPreferences (from `../node_modules/react-native-shared-group-preferences`)
   - RNReanimated (from `../node_modules/react-native-reanimated`)
   - RNScreens (from `../node_modules/react-native-screens`)
@@ -818,6 +821,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/@rnmapbox/maps"
   RNOS:
     :path: "../node_modules/react-native-os"
+  RNPermissions:
+    :path: "../node_modules/react-native-permissions"
   RNReactNativeSharedGroupPreferences:
     :path: "../node_modules/react-native-shared-group-preferences"
   RNReanimated:
@@ -861,17 +866,17 @@ SPEC CHECKSUMS:
   FBLazyVector: f1897022b53abf1469d6ad692ee2c69f57d967f3
   FBReactNativeSpec: 627fd07f1b9d498c9fa572e76d7f1a6b1ee9a444
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
-  glog: 791fe035093b84822da7f0870421a25839ca7870
-  helium-react-native-sdk: 32c0a7e3abc733a7f3d291013b2db31475fc6980
-  hermes-engine: 7a53ccac09146018a08239c5425625fdb79a6162
+  glog: 04b94705f318337d7ead9e6d17c019bd9b1f6b1b
+  helium-react-native-sdk: 816b3d02192e23ccb4d0be21780ea7c5ed46de4e
+  hermes-engine: 0784cadad14b011580615c496f77e0ae112eed75
   libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
   MapboxCommon: fdf7fd31c90b7b607cd9c63e37797f023c01d860
   MapboxCoreMaps: 24270c7c6b8cb71819fc2f3c549db9620ee4d019
   MapboxMaps: cb76511b98d3b95c74b0771ed105bc69f30ace6b
   MapboxMobileEvents: de50b3a4de180dd129c326e09cd12c8adaaa46d6
   MultiplatformBleAdapter: 5a6a897b006764392f9cef785e4360f54fb9477d
   OneSignalXCFramework: 81ceac017a290f23793443323090cfbe888f74ea
-  RCT-Folly: 85766c3226c7ec638f05ad7cb3cf6a268d6c4241
+  RCT-Folly: 424b8c9a7a0b9ab2886ffe9c3b041ef628fd4fb1
   RCTRequired: bd6045fbd511da5efe6db89eecb21e4e36bd7cbf
   RCTTypeSafety: c06d9f906faa69dd1c88223204c3a24767725fd8
   React: b9ea33557ef1372af247f95d110fbdea114ed3b2
@@ -925,6 +930,7 @@ SPEC CHECKSUMS:
   RNLocalize: a64514b46a01375fdfae9349036b4dc7130333b5
   rnmapbox-maps: 3553325eec9e1501942bbb28702b3a44457961d2
   RNOS: 6f2f9a70895bbbfbdad7196abd952e7b01d45027
+  RNPermissions: 1d1a8318f659ffd609dd7f81de8a7ecabfb52f10
   RNReactNativeSharedGroupPreferences: de0121a4224c267bc7e9fb16c398f3f087c8da81
   RNReanimated: cc5e3aa479cb9170bcccf8204291a6950a3be128
   RNScreens: 218801c16a2782546d30bd2026bb625c0302d70f
@@ -939,6 +945,6 @@ SPEC CHECKSUMS:
   Yoga: cd7d7f509dbfac14ee7f31a6c750acb957cd5022
   ZXingObjC: fdbb269f25dd2032da343e06f10224d62f537bdb
 
-PODFILE CHECKSUM: 315053ef8dad0ea72bc8b3d40f59c1020ede650c
+PODFILE CHECKSUM: 5b4d3c6d9c5a303c84f0b5427958ba4a25671e76
 
 COCOAPODS: 1.11.3

package.json

@@ -56,7 +56,7 @@
     "@helium/lazy-distributor-sdk": "^0.2.17",
     "@helium/onboarding": "4.9.0",
     "@helium/proto-ble": "4.0.0",
-    "@helium/react-native-sdk": "1.0.0",
+    "@helium/react-native-sdk": "^2.1.4",
     "@helium/spl-utils": "^0.2.17",
     "@helium/transactions": "4.8.1",
     "@helium/treasury-management-sdk": "0.1.2",
@@ -165,6 +165,7 @@
     "react-native-onesignal": "4.4.1",
     "react-native-os": "1.2.6",
     "react-native-pager-view": "6.1.2",
+    "react-native-permissions": "^3.9.0",
     "react-native-qrcode-svg": "6.1.2",
     "react-native-randombytes": "3.6.1",
     "react-native-reanimated": "2.14.4",

src/App.tsx

@@ -1,6 +1,7 @@
 import { BottomSheetModalProvider } from '@gorhom/bottom-sheet'
 import { PortalHost, PortalProvider } from '@gorhom/portal'
 import { AccountContext } from '@helium/account-fetch-cache-hooks'
+import { OnboardingProvider } from '@helium/react-native-sdk'
 import { DarkTheme, NavigationContainer } from '@react-navigation/native'
 import MapboxGL from '@rnmapbox/maps'
 import { ThemeProvider } from '@shopify/restyle'
@@ -21,7 +22,6 @@ import NetworkAwareStatusBar from './components/NetworkAwareStatusBar'
 import SplashScreen from './components/SplashScreen'
 import WalletConnectProvider from './features/dappLogin/WalletConnectProvider'
 import LockScreen from './features/lock/LockScreen'
-import OnboardingProvider from './features/onboarding/OnboardingProvider'
 import SecurityScreen from './features/security/SecurityScreen'
 import useMount from './hooks/useMount'
 import { navigationRef } from './navigation/NavigationHelper'

src/features/collectables/AssertLocationScreen.tsx

@@ -13,10 +13,13 @@ import Text from '@components/Text'
 import TextInput from '@components/TextInput'
 import { HotspotType } from '@helium/onboarding'
 import useAlert from '@hooks/useAlert'
+import { useEntityKey } from '@hooks/useEntityKey'
 import { useForwardGeo } from '@hooks/useForwardGeo'
+import { useIotInfo } from '@hooks/useIotInfo'
+import { useMobileInfo } from '@hooks/useMobileInfo'
 import { useReverseGeo } from '@hooks/useReverseGeo'
 import useSubmitTxn from '@hooks/useSubmitTxn'
-import { RouteProp, useRoute } from '@react-navigation/native'
+import { RouteProp, useNavigation, useRoute } from '@react-navigation/native'
 import MapboxGL from '@rnmapbox/maps'
 import turfBbox from '@turf/bbox'
 import { points } from '@turf/helpers'
@@ -26,27 +29,27 @@ import React, {
   useCallback,
   useEffect,
   useMemo,
-  useState,
   useRef,
+  useState,
 } from 'react'
 import { useTranslation } from 'react-i18next'
 import {
   Alert,
-  KeyboardAvoidingView,
   Keyboard,
+  KeyboardAvoidingView,
   TouchableWithoutFeedback,
 } from 'react-native'
 import { Config } from 'react-native-config'
 import { Edge } from 'react-native-safe-area-context'
 import 'text-encoding-polyfill'
-import { useEntityKey } from '@hooks/useEntityKey'
-import { useIotInfo } from '@hooks/useIotInfo'
-import { useMobileInfo } from '@hooks/useMobileInfo'
 import { parseH3BNLocation } from '../../utils/h3'
 import { removeDashAndCapitalize } from '../../utils/hotspotNftsUtils'
 import * as Logger from '../../utils/logger'
 import { MAX_MAP_ZOOM, MIN_MAP_ZOOM } from '../../utils/mapbox'
-import { CollectableStackParamList } from './collectablesTypes'
+import {
+  CollectableNavigationProp,
+  CollectableStackParamList,
+} from './collectablesTypes'
 
 const BUTTON_HEIGHT = 65
 type Route = RouteProp<CollectableStackParamList, 'AssertLocationScreen'>
@@ -74,6 +77,7 @@ const AssertLocationScreen = () => {
   const reverseGeo = useReverseGeo(mapCenter)
   const forwardGeo = useForwardGeo()
   const { submitUpdateEntityInfo } = useSubmitTxn()
+  const collectNav = useNavigation<CollectableNavigationProp>()
 
   const {
     content: { metadata },
@@ -251,6 +255,7 @@ const AssertLocationScreen = () => {
             decimalGain: gain,
           })
           setAsserting(false)
+          collectNav.navigate('HotspotDetailsScreen', { collectable })
         } catch (error) {
           setAsserting(false)
           Logger.error(error)
@@ -259,15 +264,14 @@ const AssertLocationScreen = () => {
       }
     },
     [
-      entityKey,
       mapCenter,
-      elevation,
-      gain,
+      entityKey,
       hideElevGain,
-      setAsserting,
-      setTransactionError,
       submitUpdateEntityInfo,
-      // nav,
+      elevation,
+      gain,
+      collectNav,
+      collectable,
     ],
   )
 

src/features/collectables/CollectablesNavigator.tsx

@@ -21,6 +21,7 @@ import CollectionScreen from './CollectionScreen'
 import NftDetailsScreen from './NftDetailsScreen'
 import AntennaSetupScreen from './AntennaSetupScreen'
 import SettingUpAntennaScreen from './SettingUpAntennaScreen'
+import HotspotBLENav from '../hotspot-onboarding/HotspotBLENav'
 
 const CollectablesStack = createStackNavigator()
 
@@ -113,6 +114,12 @@ const CollectablesStackScreen = () => {
         name="TransferCompleteScreen"
         component={TransferCompleteScreen}
       />
+      <CollectablesStack.Screen
+        key="HotspotBLENavigator"
+        name="HotspotBLENavigator"
+        component={HotspotBLENav}
+        options={screenOptions}
+      />
     </CollectablesStack.Navigator>
   )
 }

src/features/collectables/HotspotList.tsx

@@ -149,6 +149,10 @@ const HotspotList = () => {
     navigation.navigate('ClaimAllRewardsScreen')
   }, [navigation])
 
+  const handleNavigateToHotspotOnboard = useCallback(() => {
+    navigation.navigate('HotspotBLENavigator')
+  }, [navigation])
+
   const toggleFiltersOpen = useCallback(
     (open) => () => {
       setFiltersOpen(open)
@@ -267,7 +271,6 @@ const HotspotList = () => {
           titleColorDisabled="secondaryText"
           title={t('collectablesScreen.hotspots.claimAllRewards')}
           titleColor="black"
-          marginBottom="m"
           disabled={
             (pendingIotRewards &&
               pendingIotRewards.eq(new BN('0')) &&
@@ -277,6 +280,20 @@ const HotspotList = () => {
           }
           onPress={handleNavigateToClaimRewards}
         />
+        <ButtonPressable
+          flexGrow={1}
+          marginTop="l"
+          borderRadius="round"
+          borderWidth={2}
+          borderColor="white"
+          backgroundColor="transparent"
+          backgroundColorOpacityPressed={0.7}
+          titleColorDisabled="secondaryText"
+          title={t('collectablesScreen.hotspots.new')}
+          titleColor="white"
+          marginBottom="m"
+          onPress={handleNavigateToHotspotOnboard}
+        />
       </Box>
     )
   }, [
@@ -290,6 +307,7 @@ const HotspotList = () => {
     toggleFiltersOpen,
     hotspotsWithMeta,
     pageAmount,
+    handleNavigateToHotspotOnboard,
   ])
 
   const renderCollectable = useCallback(

src/features/collectables/collectablesTypes.ts

@@ -47,6 +47,7 @@ export type CollectableStackParamList = {
   PaymentQrScanner: undefined
   AddressBookNavigator: undefined
   ScanAddress: undefined
+  HotspotBLENavigator: undefined
 }
 
 export type CollectableNavigationProp =