I have a React Native application and I'm seeking to add functionality that checks if there is an active internet connection when the app first starts up, and continuously thereafter.

If there is no internet connection, I'm seeking to display a message saying "Internet connection not detected" with a button to "Try again"; if there is an internet connection, I'm seeking to load a page (WebView).

I'm also seeking to support both iOS and Android devices; I've researched this independently and have found a couple libraries on GitHub. However, many require an extra step of including a permissions addition in Android Manifest XML, however I don't see an Android Manifest XML file in my app; why does only Android need a manifest?

Any help is appreciated; thanks and take care.

I am struggling to find out how can I add a button in my React-Native App which triggers the following native pop up for connecting Bluetooth devices on iOS:

https://i.stack.imgur.com/PMl2s.png

I have tested react-native-airplay-ios but there seems to be something wrong with the library.

Is there any preexisting and working library available?

I want to use 'react-native-image-picker' in my application. After importing and following the install instructions from the github instructions. I get a metro bundler crash on run. It can't seem to locate the 'react-image-picker' or it's dependencies?

I have tried initializing a new project and ONLY installing image picker. I have tried running 'react-native link' and 'react-native link react-native-image-picker' in the root. I have tried initializing the project with expo. I've checked the directories that Metro claims are missing, and they look good to me.

import React from 'react';
import {
  StyleSheet,
  ScrollView,
  View,
  Text,
  Button
} from 'react-native';
import ImagePicker from 'react-native-image-picker';

const options = {
  title: 'Select Avatar',
  customButtons: [{ name: 'fb', title: 'Choose Photo from Facebook' }],
  storageOptions: {
    skipBackup: true,
    path: 'images',
  },
};

const App = () => {
  return (
    <Button title="Select Image" onPress={() => {
      ImagePicker.showImagePicker(options, (response) => {console.log('Response = ', response);})
    }} />
  );
};

error: bundling failed: Error: While trying to resolve module react-native-image-picker from file /Users/owenmorris/Documents/GitHub/fecebook/App.js, the package /Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/package.json was successfully found. However, this package itself specifies a main module field that could not be resolved (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/src/index.ts. Indeed, none of these files exist:

• /Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/src/index.ts(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)
• /Users/owenmorris/Documents/GitHub/fecebook/node_modules/react-native-image-picker/src/index.ts/index(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx) at ResolutionRequest.resolveDependency (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:65:15) at DependencyGraph.resolveDependency (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/node-haste/DependencyGraph.js:283:16) at Object.resolve (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/lib/transformHelpers.js:264:42) at /Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:399:31 at Array.map () at resolveDependencies (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:18) at /Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:269:33 at Generator.next () at asyncGeneratorStep (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:87:24) at _next (/Users/owenmorris/Documents/GitHub/fecebook/node_modules/metro/src/DeltaBundler/traverseDependencies.js:107:9) BUNDLE [ios, dev] ./index.js ░░░░░░░░░░░░░░░░ 0.0% (0/1), failed.

I am setting up IOS dev for React Native (0.61) app which has the working android version. What I did was to copy src of components and package.json file after react native environment is setup by following online post (installed xcode command line tool 10.2). But launching run-ios failed:

$ react-native run-ios
error Could not find "Podfile.lock" at /Users/mine/Documents/code/js/emps_fe6/ios/Podfile.lock. Did you run "pod install" in iOS directory?
error Could not find the following native modules: RNCAsyncStorage, RNDeviceInfo, RNGestureHandler, RNKeychain, BVLinearGradient, RNLocalize, RNReanimated, RNVectorIcons, react-native-video. Did you forget to run "pod install" ?
info Found Xcode project "emps_fe6.xcodeproj"
xcrun: error: unable to find utility "simctl", not a developer tool or in PATH
error Could not parse the simulator list output. Run CLI with --verbose flag for more details.
Error: Command failed: xcrun simctl list --json devices
xcrun: error: unable to find utility "simctl", not a developer tool or in PATH

    at checkExecSyncError (child_process.js:629:11)
    at Object.execFileSync (child_process.js:647:13)
    at runOnSimulator (/Usersamine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli-platform-ios/build/commands/runIOS/index.js:130:54)
    at Object.runIOS [as func] (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli-platform-ios/build/commands/runIOS/index.js:100:12)
    at Command.handleAction (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli/build/index.js:164:23)
    at Command.listener (/Users/mine/Documents/code/js/emps_fe6/node_modules/commander/index.js:315:8)
    at Command.emit (events.js:198:13)
    at Command.parseArgs (/Users/amine/Documents/code/js/emps_fe6/node_modules/commander/index.js:651:12)
    at Command.parse (/Users/mine/Documents/code/js/emps_fe6/node_modules/commander/index.js:474:21)
    at setupAndRun (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli/build/index.js:237:24)

Here is the output of react native info:

$ react-native info
info Fetching system and libraries information...
System:
    OS: macOS High Sierra 10.13.6
    CPU: (8) x64 Intel(R) Core(TM) i7-2675QM CPU @ 2.20GHz
    Memory: 194.93 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.17.0 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.11.3 - /usr/local/bin/npm
  IDEs:
    Xcode: /undefined - /usr/bin/xcodebuild
  npmPackages:
    react: 16.11.0 => 16.11.0 
    react-native: 0.61.2 => 0.61.2 
  npmGlobalPackages:
    react-native-cli: 2.0.1

Here is the package.json:

"dependencies": {
    "@react-native-community/async-storage": "^1.6.2",
    "moment": "^2.24.0",
    "react": "16.11.0",
    "react-native": "0.61.2",
    "react-native-cli": "^2.0.1",
    "react-native-confirmation-code-field": "^4.1.0",
    "react-native-device-info": "^4.0.1",
    "react-native-elements": "^1.2.6",
    "react-native-gesture-handler": "^1.4.1",
    "react-native-gifted-chat": "^0.11.3",
    "react-native-keychain": "^4.0.1",
    "react-native-linear-gradient": "^2.5.6",
    "react-native-localize": "^1.3.1",
    "react-native-modal": "^11.4.0",
    "react-native-modal-datetime-picker": "^7.6.0",
    "react-native-reanimated": "^1.3.0",
    "react-native-segmented-control-tab": "^3.4.1",
    "react-native-vector-icons": "^6.6.0",
    "react-native-video": "^5.0.2",
    "react-navigation": "^4.0.10",
    "react-navigation-stack": "^1.10.2",
    "react-navigation-tabs": "^2.5.6",
    "simctl": "^2.0.0",
    "socket.io-client": "2.1.1",
    "xcode": "^2.0.0"
  },

In the error message, there mentioned quite a few modules which are missing. But those modules have been installed as it shows in the package.json. I am not sure about what the error message means. Also I installed the simctl but scrum simctl still can not find it. I am using VS Code as IDE.

UPDATE:

created an empty Podfile.lock under /ios, the error becomes when run-ios:

error Cannot read property 'SPEC CHECKSUMS' of undefined. Run CLI with --verbose flag for more details.
TypeError: Cannot read property 'SPEC CHECKSUMS' of undefined
    at getDependenciesFromPodfileLock (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli-platform-ios/build/link-pods/getDependenciesFromPodfileLock.js:63:58)
    at warnAboutPodInstall (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli-platform-ios/build/link/warnAboutPodInstall.js:43:67)
    at Object.runIOS [as func] (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli-platform-ios/build/commands/runIOS/index.js:80:36)
    at Command.handleAction (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli/build/index.js:164:23)
    at Command.listener (/Users/mine/Documents/code/js/emps_fe6/node_modules/commander/index.js:315:8)
    at Command.emit (events.js:198:13)
    at Command.parseArgs (/Users/mine/Documents/code/js/emps_fe6/node_modules/commander/index.js:651:12)
    at Command.parse (/Users/mine/Documents/code/js/emps_fe6/node_modules/commander/index.js:474:21)
    at setupAndRun (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli/build/index.js:237:24)
    at Object.run (/Users/mine/Documents/code/js/emps_fe6/node_modules/@react-native-community/cli/build/index.js:184:11)

While uploading app, I got this from apple,

TMS-90809: Deprecated API Usage - Apple will stop accepting submissions of new apps that use UIWebView APIs starting from April 2020. See https://developer.apple.com/documentation/uikit/uiwebview for more information.

I tried searching for the "UIWebView" in the project search option in vs code but no luck, but there is 'react-native-web' is used in the application. Could this (react-native-web) be the reason for getting a warning? And if some other component is using webView how could I identify it?

Any help would be appreciated. Thank you.

PS: Solution for windows is having high priority as I am on windows and don't have a mac system accessible right now, or else answers for any OS are welcome.

I have upgraded the existing react native project from react native 0.59.6 to 0.61.5.

react-native upgrade command not working. So I have done the manual upgrade using upgrade helper. Resolved some post issues. Now project build success.

But After rendering into the ios emulator from Xcode, it is giving the following error.

I am not using Component.propTypes anywhere. package.lock.json have some packages with prop-types. I am not sure what it is doing exactly. Otherwise, inside my project, I am not using prop-types also. Please find my package.lock.json below,

package.lock.json

...
...
..."prop-types": {"version": "15.7.2","resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz","integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==","requires": {"loose-envify": "^1.4.0","object-assign": "^4.1.1","react-is": "^16.8.1"
      }
    },
...."react": {"version": "16.9.0","resolved": "https://registry.npmjs.org/react/-/react-16.9.0.tgz","integrity": "sha512-+7LQnFBwkiw+BobzOF6N//BdoNw0ouwmSJTEm9cglOOmsg/TMiFHZLe2sEoN5M7LgJTj9oHH0gxklfnQe66S1w==","requires": {"loose-envify": "^1.1.0","object-assign": "^4.1.1","prop-types": "^15.6.2"
      }
    },
....

package.json

{"name": "wasfat","version": "1.0.3","private": true,"rnpm": {"assets": ["app/assets/fonts/corbel"
    ]
  },"scripts": {"prepare-repository": "npm i -g react-native-cli yarn;yarn install; react- native link","emulator": "emulator -avd Nexus5V6L23_x86_64 -scale 1.0","clean": "watchman watch-del-all && npm cache clean && cd android && ./gradlew clean && cd ..","test": "jest","postinstall": "rm -rf node_modules/react-native-twitter-signin/node_modules","android": "react-native run-android","ios": "react-native run-ios","start": "react-native start","lint": "eslint ."
  },"dependencies": {"jetifier": "^1.6.5","react": "16.9.0","react-native": "^0.61.5","react-native-actionsheet": "^2.4.2","react-native-android-keyboard-adjust": "^1.2.0","react-native-aws3": "0.0.8","react-native-deep-linking": "^2.2.0","react-native-device-info": "^5.3.1","react-native-double-tap": "^1.0.1","react-native-drawer": "^2.5.1","react-native-elements": "^1.0.0","react-native-exception-handler": "^2.10.8","react-native-fbsdk": "^1.1.0","react-native-firebase": "^5.5.6","react-native-gesture-handler": "^1.1.0","react-native-google-signin": "^1.2.3","react-native-hide-with-keyboard": "^1.2.0","react-native-image-crop-picker": "^0.25.3","react-native-image-picker": "^0.28.1","react-native-image-slider": "^2.0.3","react-native-image-view": "^2.1.5","react-native-keyboard-avoiding-view": "^1.0.0","react-native-keyboard-aware-scroll-view": "^0.8.0","react-native-keyboard-aware-scrollview": "^2.0.0","react-native-keyboard-aware-view": "0.0.14","react-native-keyboard-listener": "^1.1.0","react-native-modal": "^11.1.0","react-native-paper": "^2.15.0","react-native-picker-select": "^6.2.0","react-native-popup-menu": "^0.15.6","react-native-progress": "^3.6.0","react-native-read-more-text": "^1.1.0","react-native-responsive-image": "^2.3.1","react-native-responsive-screen": "^1.2.1","react-native-s3-upload": "0.0.12","react-native-share": "^1.2.1","react-native-side-drawer": "^1.1.9","react-native-side-menu": "^1.1.3","react-native-simple-toast": "0.0.8","react-native-snap-carousel": "^3.8.0","react-native-swiper-flatlist": "^1.0.10","react-native-twitter-signin": "^1.1.1","react-native-vector-icons": "^6.6.0","react-native-video": "^4.4.4","react-native-video-controls": "^2.2.3","react-native-video-player": "^0.10.0","react-native-view-more-text": "^2.1.0","react-navigation": "^3.3.0","react-redux": "^7.1.0","react-spinkit": "^3.0.0","redux": "^4.0.4"
  },"devDependencies": {"@babel/core": "^7.6.2","@babel/runtime": "^7.6.2","@react-native-community/eslint-config": "^0.0.5","babel-jest": "^24.9.0","eslint": "^6.5.1","jest": "^24.9.0","metro-react-native-babel-preset": "^0.56.0","react-test-renderer": "16.9.0"
  },"jest": {"preset": "react-native"
  }
}

I have found this https://reactjs.org/warnings/dont-call-proptypes.html regarding this issue. But I am not sure how to use it. Because according to this. some third party libraries using propTypes directly. But how to handle it?

There is no help in 0.61 version Github issues. Please suggest some workarounds for this issue.

Thanks for any help.

I made a component but the text is only appearing on Iphone X and not smaller devices like Iphone 8, not sure if i'm missing something ?

const TextComponent = () => {
    return (
        <SafeAreaView style={{ flex: 1, backgroundColor: 'green' }}>
            <Image
                style={styles.emptyStimageateImage}
                source={require('./pic.png')} />
            <Text style={styles.title}>{title}</Text>
            <Text style={styles.content}>{partOne}</Text>
            <Text style={styles.content}>{partTwo}</Text>
        </SafeAreaView>
    )
}

const styles = StyleSheet.create({
    image: {
        width: wp('100%'),
        height: wp('80%'),
    },
    title: {
        fontSize: 20,
        color: 'red',
        padding: 10,
        fontWeight: 700
    },
    content: {
        fontSize: 700,
        color: 'green',
        padding: 10,
    }
})

export default TextComponent

I know I can use import {Linking} from 'react-native' in order to use Linking.canOpenURL(url) and open another app.

I can open PowerPoint by doing this: Linking.canOpenURL('ms-powerpoint://app') but I need to open a file there.

According to Microsoft's Documentation I should be able to do this:

Linking.canOpenURL('ms-powerpoint:ofv|u|https://blablabla.com/file.pptx') but the app tells me:

"Sorry, file.pptx is stored in an unsupported server location."

Another thing I thought was to first download the file and send the local path but, although it opens PowerPoint and shows a "Downloading/Opening" message, it shows like if it was a blank session.

Here's a small snippet of code:

import React from 'react';
import {Button, Linking} from 'react-native';
import RNFS, {DownloadFileOptions} from 'react-native-fs';

function ShowPPTComponent(props) { 

  function openFile() {
    const {file} = props;

    const temporalStoragePath = `${RNFS.DocumentDirectoryPath}/${file.name}.${file.extension}`;

    const options = {
      fromUrl: file.url,
      toFile: temporalStoragePath,
    };

    // Downloads the file.
    RNFS.downloadFile(options as DownloadFileOptions).promise.then(() => {
      const url = `ms-powerpoint:ofv|u|${temporalStoragePath}`;
      // Goes to PowerPoint
      return Linking.openURL(url);
    });
  }

  return (
     <Button onPress={openFile} title="Open in PowerPoint" />
  );
}

INFO PLIST

<key>LSApplicationQueriesSchemes</key>
    <array>
      <string>launch-ppt</string>
      <string>powerpoint</string>
      <string>ms-powerpoint</string>
      <string>open-ppt</string>
    </array>
  <key>LSSupportsOpeningDocumentsInPlace</key>
    <true/>
  <key>UIFileSharingEnabled</key>
    <true/>
  <key>UISupportsDocumentBrowser</key>
    <true/>

Notes:

In another place of the app I've shown the IOS Share options and I was able to select PowerPoint and open the file and it works perfectly. So both the file and the PowerPoint application are doing good.

(The idea here is to not show the IOS Share Modal but directly open PowerPoint with a file).

Thanks in advance !

I created a React Native project with the last version: react-native init project --version 0.61.4 and when I try to run the project on Apple TV simulator I get this error:

ld: library not found for -lPods-ReactNativeTest-tvOS

What I can do to fix this?

Thank you, Claudiu

I have a problem in react-native, this problem is the next,

ld: library not found for -lFirebaseInstallations clang: error: linker command failed with exit code 1 (use -v to see invocation)

Please help me with to solve this problem. Thanks in advance.

It's a Podfile in for this project enter image description here

platform :ios, '9.0'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
target 'application' do
 # Pods for mobile
 pod 'FBLazyVector', :path => "../node_modules/react-native/Libraries/FBLazyVector"
 pod 'FBReactNativeSpec', :path => "../node_modules/react-native/Libraries/FBReactNativeSpec"
 pod 'RCTRequired', :path => "../node_modules/react-native/Libraries/RCTRequired"
 pod 'RCTTypeSafety', :path => "../node_modules/react-native/Libraries/TypeSafety"
 pod 'React', :path => '../node_modules/react-native/'
 pod 'React-Core', :path => '../node_modules/react-native/'
 pod 'React-CoreModules', :path => '../node_modules/react-native/React/CoreModules'
 pod 'React-Core/DevSupport', :path => '../node_modules/react-native/'
 pod 'React-RCTActionSheet', :path => '../node_modules/react-native/Libraries/ActionSheetIOS'
 pod 'React-RCTAnimation', :path => '../node_modules/react-native/Libraries/NativeAnimation'
 pod 'React-RCTBlob', :path => '../node_modules/react-native/Libraries/Blob'
 pod 'React-RCTImage', :path => '../node_modules/react-native/Libraries/Image'
 pod 'React-RCTLinking', :path => '../node_modules/react-native/Libraries/LinkingIOS'
 pod 'React-RCTNetwork', :path => '../node_modules/react-native/Libraries/Network'
 pod 'React-RCTSettings', :path => '../node_modules/react-native/Libraries/Settings'
 pod 'React-RCTText', :path => '../node_modules/react-native/Libraries/Text'
 pod 'React-RCTVibration', :path => '../node_modules/react-native/Libraries/Vibration'
 pod 'React-Core/RCTWebSocket', :path => '../node_modules/react-native/'

 pod 'React-cxxreact', :path => '../node_modules/react-native/ReactCommon/cxxreact'
 pod 'React-jsi', :path => '../node_modules/react-native/ReactCommon/jsi'
 pod 'React-jsiexecutor', :path => '../node_modules/react-native/ReactCommon/jsiexecutor'
 pod 'React-jsinspector', :path => '../node_modules/react-native/ReactCommon/jsinspector'
 pod 'ReactCommon/jscallinvoker', :path => "../node_modules/react-native/ReactCommon"
 pod 'ReactCommon/turbomodule/core', :path => "../node_modules/react-native/ReactCommon"
 pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga'

 pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
 pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
 pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
 pod 'RNFirebase', :path => '../node_modules/react-native-firebase/ios'

 pod 'Firebase/AdMob', '~> 6.13.0'
 pod 'Firebase/Auth', '~> 6.13.0'
 pod 'Firebase/Core', '~> 6.13.0'
 pod 'Firebase/Database', '~> 6.13.0'
 pod 'Firebase/Functions', '~> 6.13.0'
 pod 'Firebase/DynamicLinks', '~> 6.13.0'
 pod 'Firebase/Firestore', '~> 6.13.0'
 pod 'Firebase/Messaging', '~> 6.13.0'
 pod 'Firebase/RemoteConfig', '~> 6.13.0'
 pod 'Firebase/Storage', '~> 6.13.0'
 pod 'Firebase/Performance', '~> 6.13.0'
 pod 'Firebase/Analytics', '~> 6.13.0'
 # Crashlytics
 pod 'Fabric', '~> 1.9.0'
 pod 'Crashlytics', '~> 3.12.0'

 pod 'GoogleSignIn'
 pod 'FBSDKCoreKit'
 pod 'FBSDKLoginKit'
 pod 'FBSDKShareKit'
 target 'mobileTests' do
   inherit! :search_paths
   # Pods for testing
 end

 use_native_modules!
end

target 'mobile-tvOS' do
 # Pods for mobile-tvOS

 target 'mobile-tvOSTests' do
   inherit! :search_paths
   # Pods for testing
 end

endcode

Seems like RNRF is using safeAreaView or something to add extra padding below the rendered tabbar:

Which is good and all because it makes sure my tab bar clicking experience wouldn't be interfered with the bottom bit of iPhone X screen as you can see in the image.

But I just need to access that padding to modify it to my liking. i.e. the height of the padding and if I want to disable the padding altogether and just expand the buttons themselves to the bottom of the screen.

So far I can only modify its color by adding backgroundColor to tabBarStyle props on the Scene component.

Been reading the docs to see if there's any specific mention of styling for iPhone X but no luck.

Is there anything I can do to modify the padding level?

Any pointers would be greatly appreciated :D

I want to create a react native firebase project. But when I follow the setup instructions from https://invertase.io/oss/react-native-firebase/quick-start/new-project and run the following commands, I cannot resolve some cocoapod errors. I tried to run the following commmands:

npx react-native init --template=@react-native-firebase/template HelloApp

✔ Downloading template ✔ Copying template ✔ Processing template ⠏ Installing CocoaPods dependencies (this may take a few minutes)internal/modules/cjs/loader.js:979   throw err;   ^

Error: Cannot find module '/Users/me/Desktop/HelloApp/ios/undefined'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:976:15)
    at Function.Module._load (internal/modules/cjs/loader.js:859:27)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47 {   code: 'MODULE_NOT_FOUND',   requireStack: [] }

✖ Installing CocoaPods dependencies (this may take a few minutes) error Error: Failed to install CocoaPods dependencies for iOS project, which is required by this template. Please try again manually: "cd ./HelloApp/ios && pod install". CocoaPods documentation: https://cocoapods.org/

The I trield to install the cocoapod deps manually:

cd ./HelloApp/ios && pod install

> > internal/modules/cjs/loader.js:979   throw err;   ^
> > 
> > Error: Cannot find module '/Users/me/Desktop/HelloApp/ios/undefined'> >     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:976:15)
> >     at Function.Module._load (internal/modules/cjs/loader.js:859:27)
> >     at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
> >     at internal/main/run_main_module.js:17:47 {   code: 'MODULE_NOT_FOUND',   requireStack: [] }
> > 
> > [!] Invalid `Podfile` file: 767: unexpected token at ''.
> > 
> >  #  from /Users/me/Desktop/HelloApp/ios/Podfile:46  # 
> > -------------------------------------------  #  
> >  >    use_native_modules!  #  end  #  -------------------------------------------

Then I tried to update Cocoapod:

pod install --repo-update

 internal/modules/cjs/loader.js:979   throw err;   ^

Error: Cannot find module '/Users/me/Desktop/HelloApp/ios/undefined'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:976:15)
    at Function.Module._load (internal/modules/cjs/loader.js:859:27)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
    at internal/main/run_main_module.js:17:47 {   code: 'MODULE_NOT_FOUND',   requireStack: [] }

[!] Invalid `Podfile` file: 767: unexpected token at ''.

 #  from /Users/me/Desktop/HelloApp/ios/Podfile:46  # 
-------------------------------------------  #  
 >    use_native_modules!  #  end  #  -------------------------------------------

But none of them were able to solve the cocoapod error. How can I install the firebase template correctly?

I have reffed this link https://agostini.tech/2019/02/25/generating-strong-passwords-with-autofill/
for storing password and autofilling in React Native which is for iOS platform but that is not working for automatic store password this is working for manual store. this is working for auto fill password which is already saved manually but not showing the bottom sheet dialogue for use my own password.

I've done some research but, at the time of writing, I cannot find any way of a React Native app integrating with the new iOS 11 password autofilling system.

Do we need to use entitlement certificates (as mentioned here: Password AutoFill for iOS App and https://willowtreeapps.com/ideas/password-autofill-in-ios-11)

The part I'm not sure is how that integrates with React Native?!

I'm sure I'm missing something simple. I have a React Native project working and I'm attempting to get it on the app stores. Following those instructions, after I have created my provisioning profile in the Apple Developer Dashboard, it says to double click the developer provisioning profile to launch xcode. It's these instructions exactly:

Now find the files you just downloaded on your computer, and double-click each of them in turn, causing Xcode to launch. Verify the profiles are there by opening a project or starting a new one for this test.

So I double-click my file, and xcode does launch but no windows open up. I do not have an xcode project for my react native app so I have nothing to open. There is no menus for 'build settings' or 'general' so I'm not sure how to proceed.

For reference, here is my react native directory structure:

my_project/
    .expo/
    assets/
    node_modules/
    src/
    .bablerc
    .gitignore
    App.js
    app.json
    package-lock.json
    package.json
    README.md

Did I miss a step somewhere? How do I get an xcode project from this?

I have a big Problem with React Native: i need a container which is horizontal and vertical scrollable and only loads/render the inner elements if they are in the viewport (huge amount of data). I tried something with FlatLists, but I'm not happy with it.

I also prepared an example for my idea: https://i.stack.imgur.com/p2Sll.jpg

• the green lines are the horizontal lists (should be loaded/displayed when scrolling vertically)
• within the green list the blue items should be rendered when they are in the viewport (horizontally)
• the red list as "header" should always be fixed when scrolling horizontally (this list scrolls vertically only)

I've tried out a lot of ideas. Currently I'm loading a "Container FlatList" where the horizontal lists are included. My problem here: horizontal "rendering in viewport" is not possible, because the FlatLists have scrollEnabled=false (because I have to be able to scroll the whole container, not just the single FlatLists).

My current setup is the following (simplified scheme):

<FlatList vertical numColumns={2}>
  <FlatList vertical scrollEnabled={false} /> // the red list
  <ScrollView horizontal>
    <FlatList vertical scrollEnabled={false}> // green lists container
      <FlatList horizontal scrollEnabled={false}> // (multiple) green lists
        <View /> // (multiple) blue items [here is the problem]
      </FlatList>
    </FlatList>
  </ScrollView>
</FlatList>

Does anyone have an idea how to solve this problem? Is this technically possible with React Native?

I'm pleased if we can discuss it.

I'm trying to open a file to be linked to another app (Instagram) on my iPhone. I edit this video file so i'm not getting it directly from my camera roll, but i have a link to it locally which i've logged on my physical device below:

uri:

"private/var/mobile/Containers/Data/Application/(Long filename).mp4"

What i'm trying to to with this is:

shareToApp = (uri) => {
        amendedURI = 'file://' + uri;       
        let encodedURL = encodeURIComponent(amendedURI);  
        let instagramURL = 'instagram://library?AssetPath=${' + encodedURL + '}';
        return Linking.openURL(instagramURL);
}

but the screen where you share to 'Feed' or 'Stories' doesn't display my video.

Is there something in the uri path which prevents me from achieving this?

I am trying to load a local svg file in react-native with react-native-svg library, i have already installed it but i can't figure out how to do it with local svg files. the file is located in "./assets/bg.svg" and i am using expo. please write the exact code if you know.

Im getting several errors while building react native ios version . All those errors are in objective c , ie native lang, I'm suing cocopods in my project i have used pod install Im getting several errors like this and i don't know what to do.

Mac Os version 10.10.5 Xcode version 7.2.1 RN version 0.61.5Here is the image i have attachedenter image description here

I'm trying to open a file to be linked to another app (Instagram) on my iPhone. I edit this video file so i'm not getting it directly from my camera roll, but i have a link to it locally which i've logged on my physical device below:

uri:

"private/var/mobile/Containers/Data/Application/(Long filename).mp4"

What i'm trying to to with this is:

shareToApp = (uri) => {
        amendedURI = 'file://' + uri;       
        let encodedURL = encodeURIComponent(amendedURI);  
        let instagramURL = 'instagram://library?AssetPath=${' + encodedURL + '}';
        return Linking.openURL(instagramURL);
}

but the screen where you share to 'Feed' or 'Stories' doesn't display my video.

Is there something in the uri path which prevents me from achieving this?