I have installed firebase into my react native app, I will need to firebase analytics module.

app/build.gradle:

    implementation 'com.google.firebase:firebase-core:17.2.1'
    implementation "com.google.android.gms:play-services-gcm:16.0.0"
    implementation "com.google.firebase:firebase-messaging:20.0.1"
    implementation "com.google.firebase:firebase-analytics:17.2.1"

MainActivity.java

private FirebaseAnalytics mFirebaseAnalytics;

@Override
protected void onCreate(Bundle savedInstanceState) {
    SplashScreen.show(this, R.style.SplashScreenTheme);  // here
    super.onCreate(savedInstanceState);

    // Obtain the FirebaseAnalytics instance.
    mFirebaseAnalytics = FirebaseAnalytics.getInstance(this);
}

react native

import firebase from "react-native-firebase";
firebase.analytics().logEvent("your_custom_event", {"custom_parm": "cp_value"});

but I get this error on logcat console on android studio:

E/ReactNativeJS: Error: You attempted to use a firebase module that's not installed on your Android project by calling firebase.analytics().

Ensure you have:

1) Installed the required Firebase Android SDK dependency 'com.google.firebase:firebase-analytics' in your 'android/app/build.gradle' file.

2) Imported the 'io.invertase.firebase.analytics.RNFirebaseAnalyticsPackage' module in your 'MainApplication.java' file.

3) Added the 'new RNFirebaseAnalyticsPackage()' line inside of the RN 'getPackages()' method list.

See http://invertase.link/android for full setup instructions.

and in react native console I see:

D8: Program type already present: android.support.v4.app.INotificationSideChannel$Stub$Proxy

I am building an Android app and I am struggling using the AsyncStorage. I want to create a function that takes a key as input and give me back the item. My problem is that when I call this function, it returns { _40: 0, _65: 0, _55: null, _72: null } instead the value I am looking for.

Here is my code :

renderList() {

    async function save() {
        await AsyncStorage.setItem('Title', 'hello');
    }

    async function fetch(key) {
        const value = await AsyncStorage.getItem(key);
        console.log(value) ; // Return hello
        return value
    }

    save() ;
    fetch() ;

    const reponse = fetch() ;
    console.log(reponse) ; // Return { _40: 0, _65: 0, _55: null, _72: null }

    return (
        <Text style={styles.noteElementTitle}> Aa </Text>
    )
}

Edit :

I tried this :

    async function getBody() {
    await save();
    const response = await fetch('Title');
    console.log(response);
    this.setstate({ title : response}) ;
    }

    getBody() ;

But I still get an error : TypeError: undefined is not a function (evaluating 'this.setstate({ title: response })')

Im using Expo.Filesystem.downloadAsync to download large no. of files like images & videos. But it sometimes stuck indefinitely at some point. Im tying to download files inside a loop. The code is :

        let image_downloading = section.map(async (item, i) => {
            item.image !== null  ?
                await FileSystem.downloadAsync(item.image,
                    directory + item.image.split("/").reverse()[0]
                )
                    .then(({ uri }) => {
                        item['image'] = uri;
                        console.log('Finished downloading section to ', uri);
                    })
                    .catch(({error}) => {
                        console.log('errorrrrrrrrrrrrr',error)
                    })
                : null
    });
    await Promise.all(image_downloading);

Also i've tried using FileSystem.createDownloadResumable. When using createDownloadResumable the downloading is getting very slow

I'm building a Music Player and I'm focusing on the progress bar. I was able to react to swipe gestures, but I cant limit how far that gesture goes.

This is what I've done so far. I've reduced everything to the minumal:

constructor(props) {
    super(props);

    this.state = {
      pan: new Animated.ValueXY()
    };
}

componentWillMount() {
    this._panResponder = PanResponder.create({
        onMoveShouldSetResponderCapture: () => true,
        onMoveShouldSetPanResponderCapture: () => true,
        onPanResponderGrant: (e, gestureState) => {


            // Set the initial value to the current state
            let x = (this.state.pan.x._value < 0) ? 0 : this.state.pan.x._value;


            this.state.pan.setOffset({ x, y: 0 });
            this.state.pan.setValue({ x: 0, y: 0 });


        },
        onPanResponderMove: Animated.event([
            null, { dx: this.state.pan.x, dy: 0 },
        ]),
        onPanResponderRelease: (e, { vx, vy }) => {
            this.state.pan.flattenOffset();
        }
    });
}

render() {
    let { pan } = this.state;

    // Calculate the x and y transform from the pan value
    let [translateX, translateY] = [pan.x, pan.y];
    // Calculate the transform property and set it as a value for our style which we add below to the Animated.View component
    let imageStyle = { transform: [{ translateX }, { translateY }] };

    return (
        <View style={styles.container}>
            <Animated.View style={{imageStyle}} {...this._panResponder.panHandlers} />
        </View>
    );
}

Here there is an image showing what the problem is.

Initial position:

Wrong Position, limit exceeded:

So the idea is to stop keeping moving once the limit (left as well as right) is reached. I tried checking if _value < 0, but it didn't work since It seems to be an offset, not a position.

Well any help will be appreciated.

I am trying to serve a local JS script through a local server on a mobile app, i managed to load the viewer.html with the following code, but i couldn't find how to load the js file, i also tried using RNFS but the RNFS couldn't find the files in the device, neither the scripts or the html.

my main code:

import StaticServer from 'react-native-static-server'
import RNFetchBlob from "rn-fetch-blob";
import React, { Component } from 'react';
import { 
  View,
  Image,
  StyleSheet,
  Dimensions,
  Text
} from 'react-native';
import { WebView } from 'react-native-webview';

class ReactNativeForgeViewer extends Component {
  constructor(props) {
    super(props);
    this.state = {
      uri: null
    }
  }

  componentDidMount() {
    this.port = 8080;
    this.root = "www/";
    this.file = 'viewer.html';

    // Get HTML file from require
    let html = require('./assets/www/viewer.html');
    let {uri} = Image.resolveAssetSource(html);

    let path = `${RNFetchBlob.fs.dirs.DocumentDir}/${this.root}`;
    let dest = `${path}viewer.html`;

    // Add the directory
    RNFetchBlob.fs.mkdir(path, { NSURLIsExcludedFromBackupKey: true })
      .catch((err) => console.log(err));

    // Fetch the file
    let added;

    if (uri.indexOf("file://") > -1) {
      // Copy file in release
      added =  RNFetchBlob.fs.exists(dest).then((e) => {
        if (!e) {
          return RNFetchBlob.fs.cp(uri, dest);
        }
      });
    } else {
      // Download for development
      added = RNFetchBlob
        .config({
          fileCache : true,
        })
        .fetch('GET', uri)
        .then((res) => {
          return RNFetchBlob.fs.mv(res.path(), dest);
        })
    }

    added.then(() => {
      // Create a StaticServer
      this.server = new StaticServer(this.port, this.root, {localOnly: true});

      this.server.start().then((origin) => {
        this.setState({origin});
      });
    }).catch((err) => {
      console.error(err);
    })
  }

  componentWillUnmount() {
    if (this.server) {
      this.server.stop();
    }
  }

  render() {
    if (!this.state.origin) {
      return (
        <View style={styles.container}>
          <Text>Carregando...</Text>
        </View>
      );
    }

    return (
      <View style={styles.webViewContainer}>
        <WebView
          javaScriptEnabled={true}
          scalesPageToFit={true}
          style={styles.webView}
          scrollEnabled={false}
          source={{uri: `${this.state.origin}/www/${this.file}`}} />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  webViewContainer: {
    flex:1, 
    height: Dimensions.get('window').height, 
    width: Dimensions.get('window').width
  },
  webView: {
    backgroundColor: `#FFFFFF`,
    flex: 1
  }
});

export default ReactNativeForgeViewer;

My Viewer.html code:

<!doctype html>
<html lang="en">
  <head>
    <meta name="viewport" content="width=device-width, height=device-height, minimal-ui, minimum-scale=1.0, initial-scale=1, user-scalable=no"/>
    <link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/style.min.css" type="text/css" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="mobile-web-app-capable" content="yes">
    <title>
      Forge Viewer
    </title>
    <meta charset="utf-8">
    <style>
      .viewer {
        background: whitesmoke;
        height: 100vh;
        width: 100vw;
      }
      body {
        margin:0
      }
    </style>
  </head>
  <body>
    <div id="viewer" class="viewer"></div>
    <!-- <script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.min.js"></script> -->
    <script src= "http://localhost:8080/www/lmv/3.3/viewer3D.min.js"></script>
    <script src="http://localhost:8080/www/viewer.js"></script>
  </body>
</html>

i don't get any message error

i have been trying to use a TouchableOpacity inside a react-native-mapsMarker heres the code:

<MapView.Marker
     coordinate={{
     latitude: marker.lat,
     longitude: marker.lng
     }}
     anchor={{ x: 0, y: 0 }}
     centerOffset={{ x: 0, y: 0 }}
     calloutOffset={{ x: 0, y: 0}}
     title={marker.title}
     description="Sample Description">
<TouchableOpacity
     onLongPress={() => {console.log("MARKER LONG PRESSED")}}
     delayLongPress={1000}
     onPress={()=>{console.log("MARKER PRESSED")}}
>
     // here i have a custom image for the marker
</TouchableOpacity>
</MapView.Marker>

now the problem is this works fine on ios both the onPress and onLongPress events get invoked but on android none of them gets called this is so confusing and i dont know why. is there something i am missing here or something i should be adding?

and also i am importing ToucahbleOpacity from react-native-gesture-handler. i tried importing it from react-native but that just doesnt work on both platforms

Whenever I run react-native run-android while keeping the emulator running, I get this error. react-native run-ios wroks completely fine.

Error: Command failed: ./gradlew app:installDebug -PreactNativeDevServerPort=8081
:ReactNative:Failed to parse React Native CLI configuration: groovy.json.JsonException: Unable to determine the current character, it is not a string, number, array, or object

The current character read is 'E' with an int value of 69
Unable to determine the current character, it is not a string, number, array, or object
line number 1
index number 0
Error: Invalid attribute nameLine: 16Column: 18Char: .    at error (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/sax/lib/sax.js:651:10)    at strictFail (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/sax/lib/sax.js:677:7)    at SAXParser.write (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/sax/lib/sax.js:1313:13)    at new XmlDocument (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/xmldoc/lib/xmldoc.js:261:15)    at readManifest (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/@react-native-community/cli-platform-android/build/config/readManifest.js:38:10)    at Object.projectConfig (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/@react-native-community/cli-platform-android/build/config/index.js:59:46)    at Object.get project [as project] (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/react-native/node_modules/@react-native-community/cli/build/tools/config/index.js:114:50)    at /Users/yashatreya/Desktop/Realyze/Realyze/node_modules/react-native/node_modules/@react-native-community/cli/build/commands/config/config.js:8:452    at Array.forEach (<anonymous>)    at _objectSpread (/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/react-native/node_modules/@react-native-community/cli/build/commands/config/config.js:8:392)
^

FAILURE: Build failed with an exception.

* Where:
Script '/Users/yashatreya/Desktop/Realyze/Realyze/node_modules/@react-native-community/cli-platform-android/native_modules.gradle' line: 201

* What went wrong:
A problem occurred evaluating script.
> Failed to parse React Native CLI configuration. Expected running 'npx --quiet --no-install react-native config' command from '/Users/yashatreya/Desktop/Realyze/Realyze' directory to output valid JSON, but it didn't. This may be caused by npx resolving to a legacy global react-native binary. Please make sure to uninstall any global 'react-native' binaries: 'npm uninstall -g react-native react-native-cli' and try again

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

As indicated in the error message, I tried running npm uninstall -g react-native react-native-cli but it didn’t work.

Info about my environment:

System:
    OS: macOS 10.15
    CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
    Memory: 29.68 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 12.13.0 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.12.0 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.0, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5977832
    Xcode: 11.0/11A420a - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0 
    react-native: ^0.61.4 => 0.61.4 
  npmGlobalPackages:
    react-native-cli: 2.0.1

android/app/build.gradle below:

apply plugin: "com.android.application"

import com.android.build.OutputFile
project.ext.react = [
    entryFile: "index.js",
    enableHermes: false,  // clean and rebuild if changing
]

apply from: "../../node_modules/react-native/react.gradle"

def enableSeparateBuildPerCPUArchitecture = false
def enableProguardInReleaseBuilds = false

def jscFlavor = 'org.webkit:android-jsc:+' 

def enableHermes = project.ext.react.get("enableHermes", false);

android {
    compileSdkVersion rootProject.ext.compileSdkVersion

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    defaultConfig {
        applicationId "com.realyze"
        minSdkVersion 21 
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
        multiDexEnabled true

    }
    // rootProject.ext.minSdkVersion
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
        }
    }
    signingConfigs {
        debug {
            storeFile file('debug.keystore')
            storePassword 'android'
            keyAlias 'androiddebugkey'
            keyPassword 'android'
        }
    }
    buildTypes {
        debug {
            signingConfig signingConfigs.debug
        }
        release {
            // Caution! In production, you need to generate your own keystore file.
            // see https://facebook.github.io/react-native/docs/signed-apk-android.
            signingConfig signingConfigs.debug
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
    // applicationVariants are e.g. debug, release
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            // For each separate APK per architecture, set a unique version code as described here:
            // https://developer.android.com/studio/build/configure-apk-splits.html
            def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
            def abi = output.getFilter(OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }

        }
    }
}

dependencies {
    implementation project(':react-native-push-notification')
    implementation project(':react-native-sound')
    implementation project(':react-native-audio')
    implementation 'com.android.support:multidex:2.0.1'
    implementation project(':react-native-gesture-handler')
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.facebook.react:react-native:+"  // From node_modules
    implementation 'androidx.appcompat:appcompat:1.1.0-rc01'
    implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02'
    implementation 'com.google.firebase:firebase-analytics:17.2.0'
    implementation 'com.google.firebase:firebase-auth:19.1.0'
    implementation project(path: ":@react-native-firebase_auth")
    implementation project(path: ":@react-native-firebase_messaging")
    implementation project(path: ":@react-native-firebase_database")
    implementation project(':react-native-datetimepicker')
    implementation project(path: ":@react-native-firebase_firestore")
    implementation project(path: ":@react-native-firebase_functions")
}

    if (enableHermes) {
        def hermesPath = "../../node_modules/hermes-engine/android/";
        debugImplementation files(hermesPath + "hermes-debug.aar")
        releaseImplementation files(hermesPath + "hermes-release.aar")
    } else {
        implementation jscFlavor
    }
// }

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}

apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)
apply plugin: 'com.google.gms.google-services'

android/build.gradle below :

buildscript {
    ext {
        buildToolsVersion = "28.0.3"
        minSdkVersion = 16
        compileSdkVersion = 28
        targetSdkVersion = 28
    }
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath "com.android.tools.build:gradle:3.4.2"
        classpath 'com.google.gms:google-services:4.3.2'
    }
}

allprojects {
    repositories {
        mavenLocal()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }

        google()
        jcenter()
        maven { url 'https://jitpack.io' }
    }
}

Initially I was getting this error: react-native build error: Could not find method implementation() for arguments [jscFlavor] on project ':app' of type org.gradle.api.Project but now I am getting the above.

I have an axios call to a presigned url in s3 for upload, this work well in IOS but trow "Netowork Error" in android.

The code is pretty simple but without any other information (the response is empty) I do not kwno how to solve this.

            axios.post(presignedPostData.url, formData, config)
                .then(function (response) { 
                })
                .catch(function (err) { console.log('S3err',err, err.response) })

I use react-native with expo, the axios call work in ios and also in the web version.

UPDATE

The problem seems relative to formdata, if for example I remove the formdata obviously my post not work but the error (missing pre-conditions...) and the status (412) code are ok, but with formdata I've not error description nor status code..

UPDATE 2: the formdata, autogenerated from s3.createPresignedPost (they work in ios and web)

{"_parts":[["Content-Type","video/mp4"],["key","src-058ef4d0-0d49-11ea-8478-3b47e74a5983.mp4"],["acl","public-read"],["bucket","my.bucket"],["X-Amz-Algorithm","AWS4-HMAC-SHA256"],["X-Amz-Credential","mycredentials"],["Policy","mypolicy"],["X-Amz-Signature","mysignature"],["file",{"cancelled":false,"width":1280,"type":"video","uri":"file:///data/user/0/host.exp.exponent/cache/ExperienceData/%myapp%252Fmyapp/ImagePicker/8d68fafa-5c47-4436-9323-dc0d8702dc5d.mp4","rotation":90,"height":720,"duration":1280}]]}

Also tested with fetch (in place of axios), same problem.

UPDATE 3

If I use FyleSystem

`import * as FileSystem from 'expo-file-system';

//mediaArray['file'] = file;
mediaArray['fileALT'] = FileSystem.cacheDirectory+name

I'm able to du the upload with code 204 but the file uploaded isn't right. Maybe there is a permission problem on imagepicker. Still not working the process but with this new informations maybe someone can have an idea.

I've built an App with react-native and expo. Installed it on my Android-TV and my Android-TV emulator.

The app works when I run it through the ES File Explorer app, however when I try to run it regularly by clicking it on the Android-TV app section I get a constant white screen.

Built the apk with expo through $exp build:android. App.json code:

 {
  "expo": {
    "name": "CommuniTV",
    "description": "The future of watching TV is here!",
    "slug": "CommuniTV",
    "privacy": "public",
    "sdkVersion": "26.0.0",
    "platforms": ["ios", "android"],
    "version": "1.0.4",
    "orientation": "landscape",
    "entryPoint": "./App.js",
    "icon": "./assets/icon.png",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "package": "project.communiTV.com",
      "versionCode": 104,
      "permissions": [],
      "icon": "./AppIcon.png",
      "adaptiveIcon": {
        "foregroundImage": "./launcherIcon.png" // size is 1024x1024
      }
    }
  }
}

Couldn't find any solution on the web and I'm stuck.

Any suggestions? First screenshot - I click here I get a white screen

Second screenshot - I'll start it from here the App works fine

I read in a Github post "I am using react-native v0.59.9 which uses gradle v5.4.1.". I've used React Native for a while and been able to emulate on Android, but don't recall ever installing Gradle. When I create a React Native app, does it automatically come with Gradle? If so, is there ever a need for me to worry about the Gradle version, or does a given React Native version always come with the corresponding Gradle version?

when i run ./gradlew bundleRelease, I have repeatedly encountered errors like this

java.lang.RuntimeException: Cannot start "jarsigner" process, please add it to the PATH

I found it when it was 99% run

I'm trying to connect pre-populated sqlite db file to my react-native app. I'm using separate database connect file. File name is 'Database.js'. My .sqlite file location is

android\app\src\main\assets\data

This is src\db\Database.js file

var React = require('react-native');
var SQLite = require('react-native-sqlite-storage')
var db = SQLite.openDatabase({name : 'oneManagerDB', createFromLocation : '~data/oneManager.sqlite'});
export default DBController =
{
    _connection:db,
}

And use it other places.

Example of use login.js. file in root of project filder

import DBController from './src/db/Database';
export default class Login extends Component {
constructor(props) {
    super(props);

    this.state = {
               email: '',
               password: '',
               loading: false,
             };
  }

  _startSession(){
    DBController._connection.transaction(function(tx) {

                        console.log('stat se');
                        tx.executeSql(
                          'UPDATE session SET value=? WHERE param=?',
                          [
                            this.state.email,
                            'user-name'
                          ],
                          (tx, results) => {
                          console.log('Results', results.rowsAffected);
                          console.log('value', this.state.email);
                          }
                        );
                      });
  }
...
...
}

Following error show in console with running app on android virtual Device

2019-11-23 11:48:04.883 20947-27177/com.awesomeproject I/ReactNativeJS: OPEN database: oneManagerDB
2019-11-23 11:48:04.888 20947-27182/com.awesomeproject E/unknown:SQLitePlugin: pre-populated DB asset NOT FOUND in app bundle www subdirectory: data/oneManager.sqlite
2019-11-23 11:48:04.888 20947-27182/com.awesomeproject E/unknown:SQLitePlugin: Unable to import pre-populated db asset
2019-11-23 11:48:04.889 20947-27182/com.awesomeproject E/unknown:SQLitePlugin: Unexpected error opening database, stopping db thread
    java.lang.Exception: Unable to import pre-populated db asset
        at org.pgsqlite.SQLitePlugin.openDatabase(SQLitePlugin.java:395)
        at org.pgsqlite.SQLitePlugin.access$000(SQLitePlugin.java:49)
        at org.pgsqlite.SQLitePlugin$DBRunner.run(SQLitePlugin.java:904)
        at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1167)
        at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:641)
        at java.lang.Thread.run(Thread.java:764)

Please help me to resolve this

I'm trying to create a text input box with react native.

The template (which works), is something like:

const App: () => React$Node = () => {

  return (
    <>
      <Text>Hello world</Text>
    </>
  );
};

export default App;

I've attempted the following text input scheme:

const App: () => React$Node = () => {

  constructor(props) {
    super(props);
    this.state = {text: ''};
  }

  return (
    <>
      <Text>Hello world</Text>
      <TextInput
        style={{height: 40}}
        placeholder="Type here to translate!"
        onChangeText={(text) => this.setState({text})}
        value={this.state.text}
      />
      <Text style={{padding: 10, fontSize: 42}}>
        {this.state.text.split('').map((word) => word && '🍕').join('')}
      </Text>
    </>
  );
};

I get the following error:

Error: TransformError SyntaxError: [Path]\App.js: Unexpected token, expected ";"

Usually, the format (which also works), is something like this:

export default class PizzaTranslator extends Component {
  constructor(props) {
    super(props);
    this.state = {text: ''};
  }

  render() {
    return (
      <View style={{padding: 10}}>
        <TextInput
          style={{height: 40}}
          placeholder="Type here to translate!"
          onChangeText={(text) => this.setState({text})}
          value={this.state.text}
        />
        <Text style={{padding: 10, fontSize: 42}}>
          {this.state.text.split('').map((word) => word && '🍕').join('')}
        </Text>
      </View>
    );
  }
}

But I figure, there should be a way to just add a text input to the template with arrow functions. Is there something obvious I'm missing?

I have my project built with react native. In order to launch the application on android emulator, I run the following commands:

react-native start

react-native run-android

The application then launches on the emulator. But when I reload the application on emulator, I get the following error:

Any idea what can be done here so that application reloads properly.

All my firebase dependencies are using 12.0.1 version as I see on my build.gradle file.

subprojects {
    project.configurations.all {
        resolutionStrategy.eachDependency { details ->
            if (details.requested.group == 'com.google.firebase') {
                details.useVersion '12.0.1'
            }
        }
    }
}

On sync it throws an error saying, Could not find com.google.firebase:firebase-bom:12.0.1. I guess it means there is no version of 12.0.1 for firebase-bom. The version I can see on the official website is 24.1.0

com.google.firebase:firebase-bom:24.1.0

Thus how can I modify my build.gradle file to load version 24.1.0 for firebase-bom module.

My attempt so far:

subprojects {
    project.configurations.all {
        resolutionStrategy.eachDependency { details ->
            if (details.requested.group == 'com.google.firebase') {
                details.useVersion '12.0.1'
            }
            if (details.requested.group == 'com.google.firebase'&& details.requested.module == 'firebase-bom') {
                details.useVersion '24.1.0'
            }
        }
    }
}

But this does not work. Can someone help me with how to set a different version for a specific module name.

I am unable to run any react native app for android on my windows machine, I followed all steps stated on the official documentation but still doest work. I keep getting this error

* What went wrong:
Execution failed for task ':app:checkDebugDuplicateClasses'.
> 1 exception was raised by workers:
  java.util.zip.ZipException

I'm using the latest version of NPM and React Native as of this time. I need to know how to fix this so the app builds successfully and runs on my virtual or real device, thanks.

I am trying to open a another app(https://play.google.com/store/apps/details?id=com.inova.velocity) from my app. But there are all the tutorial just redirecting url to playstore only.(I found a github link(https://github.com/FiberJW/react-native-app-link) and it opens the app for iOS only, but for Android it is redirecting to playstore). Is there is any way to solve this problem?

Linking.canOpenURL('market://details?id=com.inova.velocity')
      .then((canOpen) => {
        if (canOpen) { 
          console.log('open app'); 
          return Linking.openURL('market://details?id=com.inova.velocity')
                 };
        }).catch(err => console.log('An error occurred', err));

I am trying to run my react-native app on android. the documentation says I need to run "adb reverse tcp:8081 tcp:8081"

but my adb (version 1.0.31) does not have a "reverse" command.

also the adb documentation (https://developer.android.com/studio/command-line/adb.html#commandsummary) is not mentioning this command.

did they remove it? is there a workaround?

I setup a react native environment and created a new project using react native cli. But it fails when I run react-native run-android

This is what I get in my terminal. Can anyone please help?

PS C:\Users\Mahali\Documents\Work\Code\Project> npx react-native run-android info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag. Jetifier found 864 file(s) to forward-jetify. Using 8 workers... info Starting JS server...

info Installing the app...

[Fatal Error] versionedparcelable-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] lifecycle-runtime-2.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] documentfile-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] localbroadcastmanager-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] print-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] loader-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] legacy-support-core-ui-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] lifecycle-viewmodel-2.0.0.pom:2:1: Content is not allowed in prolog. FAILURE: Build failed with an exception. * What went wrong:

Could not determine the dependencies of task ':app:mergeDebugAssets'.
> Could not resolve all task dependencies for configuration ':app:debugRuntimeClasspath'. > Could not resolve androidx.lifecycle:lifecycle-runtime:2.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.core:core:1.0.1

> Could not resolve androidx.lifecycle:lifecycle-runtime:2.0.0.

> Could not parse POM https://dl.google.com/dl/android/maven2/androidx/lifecycle/lifecycle-runtime/2.0.0/lifecycle-runtime-2.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.versionedparcelable:versionedparcelable:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.core:core:1.0.1

> Could not resolve androidx.versionedparcelable:versionedparcelable:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/versionedparcelable/versionedparcelable/1.0.0/versionedparcelable-1.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.documentfile:documentfile:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 > Could not resolve androidx.documentfile:documentfile:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/documentfile/documentfile/1.0.0/documentfile-1.0.0.pom> Content is not allowed in prolog.

> Could not resolve androidx.loader:loader:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.fragment:fragment:1.0.0
> Could not resolve androidx.loader:loader:1.0.0.

> Could not parse POM https://dl.google.com/dl/android/maven2/androidx/loader/loader/1.0.0/loader-1.0.0.pom> Content is not allowed in prolog.

> Could not resolve androidx.localbroadcastmanager:localbroadcastmanager:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 > Could not resolve androidx.localbroadcastmanager:localbroadcastmanager:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/localbroadcastmanager/localbroadcastmanager/1.0.0/localbroadcastmanager-1.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.print:print:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 > Could not resolve androidx.print:print:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/print/print/1.0.0/print-1.0.0.pom> Content is not allowed in prolog.

> Could not resolve androidx.legacy:legacy-support-core-ui:1.0.0. Required by: project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.fragment:fragment:1.0.0 project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.vectordrawable:vectordrawable-animated:1.0.0 > Could not resolve androidx.legacy:legacy-support-core-ui:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/legacy/legacy-support-core-ui/1.0.0/legacy-support-core-ui-1.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.lifecycle:lifecycle-viewmodel:2.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.fragment:fragment:1.0.0
> Could not resolve androidx.lifecycle:lifecycle-viewmodel:2.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/lifecycle/lifecycle-viewmodel/2.0.0/lifecycle-viewmodel-2.0.0.pom> Content is not allowed in prolog. * Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. * Get more help at https://help.gradle.orgBUILD FAILED in 14s error Failed to install the app. Make sure you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details.Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081

[Fatal Error] versionedparcelable-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] lifecycle-runtime-2.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] documentfile-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] localbroadcastmanager-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] print-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] loader-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] legacy-support-core-ui-1.0.0.pom:2:1: Content is not allowed in prolog. [Fatal Error] lifecycle-viewmodel-2.0.0.pom:2:1: Content is not allowed in prolog. FAILURE: Build failed with an exception. * What went wrong:

Could not determine the dependencies of task ':app:mergeDebugAssets'.

> Could not resolve all task dependencies for configuration ':app:debugRuntimeClasspath'. > Could not resolve androidx.lifecycle:lifecycle-runtime:2.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.core:core:1.0.1

> Could not resolve androidx.lifecycle:lifecycle-runtime:2.0.0.

> Could not parse POM https://dl.google.com/dl/android/maven2/androidx/lifecycle/lifecycle-runtime/2.0.0/lifecycle-runtime-2.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.versionedparcelable:versionedparcelable:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.core:core:1.0.1

> Could not resolve androidx.versionedparcelable:versionedparcelable:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/versionedparcelable/versionedparcelable/1.0.0/versionedparcelable-1.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.documentfile:documentfile:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 > Could not resolve androidx.documentfile:documentfile:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/documentfile/documentfile/1.0.0/documentfile-1.0.0.pom> Content is not allowed in prolog.

> Could not resolve androidx.loader:loader:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.fragment:fragment:1.0.0
> Could not resolve androidx.loader:loader:1.0.0.

> Could not parse POM https://dl.google.com/dl/android/maven2/androidx/loader/loader/1.0.0/loader-1.0.0.pom> Content is not allowed in prolog.

> Could not resolve androidx.localbroadcastmanager:localbroadcastmanager:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 > Could not resolve androidx.localbroadcastmanager:localbroadcastmanager:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/localbroadcastmanager/localbroadcastmanager/1.0.0/localbroadcastmanager-1.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.print:print:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.legacy:legacy-support-core-utils:1.0.0 > Could not resolve androidx.print:print:1.0.0.

> Could not parse POM https://dl.google.com/dl/android/maven2/androidx/print/print/1.0.0/print-1.0.0.pom> Content is not allowed in prolog.

> Could not resolve androidx.legacy:legacy-support-core-ui:1.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.fragment:fragment:1.0.0 project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.vectordrawable:vectordrawable-animated:1.0.0 > Could not resolve androidx.legacy:legacy-support-core-ui:1.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/legacy/legacy-support-core-ui/1.0.0/legacy-support-core-ui-1.0.0.pom> Content is not allowed in prolog. > Could not resolve androidx.lifecycle:lifecycle-viewmodel:2.0.0. Required by:

project :app > com.facebook.react:react-native:0.61.3 > androidx.appcompat:appcompat:1.0.2 > androidx.fragment:fragment:1.0.0
> Could not resolve androidx.lifecycle:lifecycle-viewmodel:2.0.0. > Could not parse POM https://dl.google.com/dl/android/maven2/androidx/lifecycle/lifecycle-viewmodel/2.0.0/lifecycle-viewmodel-2.0.0.pom> Content is not allowed in prolog. * Try:

Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. * Get more help at https://help.gradle.orgBUILD FAILED in 14s at checkExecSyncError (child_process.js:603:11)

at execFileSync (child_process.js:621:15)

at runOnAllDevices (C:\Users\Mahali\Documents\Work\Code\Project\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:94:39) at buildAndRun (C:\Users\Mahali\Documents\Work\Code\Project\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\index.js:158:41) at C:\Users\Mahali\Documents\Work\Code\Project\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\index.js:125:12 at processTicksAndRejections (internal/process/task_queues.js:93:5) at async Command.handleAction (C:\Users\Mahali\Documents\Work\Code\Project\node_modules\react-native\node_modules\@react-native-community\cli\build\index.js:164:9)

I've installed react-native-cli globally:

npm install -g react-native-cli

Then run:

react-native init AwesomeProject
cd AwesomeProject

I got the following structure:

-- AwesomeProject   
---- node_modules      
------ react-native    

When I run react-native run-android I get an error:
Command run-android unrecognized. Did you mean to run this inside a react-native project?

When I run react-native start I get the same.

react-native -v
prints:
react-native-cli: 0.2.0
react-native: n/a - not inside a React Native project directory

What I'm doing wrong?