instamobile / react-native-firebase Goto Github PK

View Code? Open in Web Editor NEW

395.0 395.0 137.0 38 KB

React Native Firebase Starter Project with Auth, Firestore, Storage and Push Notifications

Home Page: https://instamobile.io

License: MIT License

JavaScript 100.00%

expo expo-cli firebase firestore firestore-database

react-native-firebase's People

Contributors

Stargazers

Watchers

Forkers

amit200635k vaibhaw-redapple kvkumarkv sudhir-gupta zakfong homeincorporated lindanek eventualapp afrinnusrat dalalsunil1986 rgorosterrazu rohitrock97 erniemac geovane-oliveira johnnyomara balajirao676 aditya9111 mpakaris annaeffen nangui apappas1129 hasankasamali ajulibe bennetteyee reikan69 manutromero bnelce ohitsremi felrespin mehdifad55 scibel meanhive engrsmah mog-rn tpssim chaosology-asartheen jaihan ziv22 levinkid codycoauette ogriffithjones techabib davincios bellaroyle devils-own cklapwijk raywire rudomartin sinanondul zernach jlee7737 hoonner cobycobyk suttapongw rectifierdotcurtis oliverlsanz denishue budostylz francescou2 marijor ruslankalyniak davappler sanioka benjamindavid03 janjosel chriswayg uday1kiran toriekim mckennakayyy chrischu22 agape-apps sam-frontend emmanuelconstantino19 zaghadon demo18c dxvi tiyalee ahtrahdis7 youbenuse cflores-1 asfathahamed motwanikapil manayathu hthr-wht ssiju yassinekim vaibhavindianic slim1616 ariesem sefiyetuabdullah jaswanthm mrcyrilgoud aaronbesson miguelitolaparra stanleyivan96 kocasp alipatel05 alaomichael cadenchou mamuga

react-native-firebase's Issues

White screen on initial yarn ios

Step 4 Implement the UI in the accompanying guide leads to a white screen blank expo app on iOS simulator when login and registration should be showing up.

need to change firebase config

need to change firebase config to

import firebase from "firebase/app";
import "firebase/auth";
import "firebase/firestore";

Logout

Hi, how can I remove state and logout user from this project?
I tried:
const signOut = async () => {
try {
await firebase.auth().signOut();
navigation.navigate("Login");
} catch (e) {
console.log(e);
}
}
but state wasn't removed

firebase repo is out of date

btw, this breaks the instructions here I think: https://www.freecodecamp.org/news/react-native-firebase-tutorial/

the version of firebase ends up being wrong (8, vs 7). There is a warning when running npm run android, but it's easy to miss. Things all seem fine, except you get errors once you get to the end of step 6 in your tutorial. I finally cloned your repo down and copied your version of firebase. I also ran your project repo, then tried running mine, but I had to close down expo and restart it on my phone to get it to work right. But that seemed to be what fixed it...

May want to update stuff.

FirebaseError: [code=unavailable]: Failed to get document because the client is offline

copied the code into a project as getting to know to react, when trying to log in I'm getting the FirebaseError: [code=unavailable]: Failed to get document because the client is offline, but I cant create a user and get put into the home screen so confused on what is causing this issue, anyone have any ideas on how to fix this?

The action 'NAVIGATE' with payload {"name":"Home","params":{"user":{"email":"[email protected]","id":"xxx","fullName":"test"}}} was not handled by any navigator

Running the project with expo. Receiving this error. No changes made to the files.

index.js:1 The action 'NAVIGATE' with payload {"name":"Home","params":{"user":{"email":"[email protected]","id":"xxx","fullName":"test"}}} was not handled by any navigator.

Do you have a screen named 'Home'?

If you're trying to navigate to a screen in a nested navigator, see https://reactnavigation.org/docs/nesting-navigators#navigating-to-a-screen-in-a-nested-navigator.

This is a development-only warning and won't be shown in production.

The action 'NAVIGATE' with payload {"name":"Home","params":{"user":{"email":"[email protected]","id":"xxx","fullName":"test"}}} was not handled by any navigator #3

May you please assist with this. Thank you

Component Exception Can't find variable: user

After completing every step I get an the error mentioned in the title when trying to navigate to the HomeScreen:
On line 50 of App.js: {props => <HomeScreen {...props} extraData={user} />}
I've even tried copying and pasting every line of the source code on the repo rather than following the steps on the tutorial to see if it was some sort of typing mistake on my behalf but have found no fix to this.
Any ideas?

firebase is not defined

I am new to JavaScript, may be i am missing something obvious. Ideally it should have worked as it is.

I run the app and in Registration screen I get the following error. I tried googling for the issue and tried to include

  <head>
    <script src='https://cdn.firebase.com/js/client/2.2.1/firebase.js'></script>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
  </head>

I still get the error below. What am i missing ?

Uncaught ReferenceError: firebase is not defined
at onRegisterPress (RegistrationScreen.js:21:1)
at onPress (RegistrationScreen.js:96:1)
at onClick (PressResponder.js:348:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
at invokeGuardedCallback (react-dom.development.js:4277:1)
at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:4291:1)
at executeDispatch (react-dom.development.js:9041:1)
at processDispatchQueueItemsInOrder (react-dom.development.js:9073:1)
at processDispatchQueue (react-dom.development.js:9086:1)

expo build:android failed with error code 500

I run expo build:android to generate apk but it failed with error code 500.

at C:\Users\E7470\Documents\MEGA\Source Codes\reactnative\rn-firebase\node_modules\metro\src\JSTransformer\worker.js:367:33 iOS Bundling failed 5858ms Packager URL http://127.0.0.1:19001/node_modules\expo\AppEntry.bundle?dev=false&hot=false&minify=true&platform=ios returned unexpected code 500. Please open your project in the Expo app and see if there are any errors. Also scroll up and make sure there were no errors or warnings when opening your project.

com.facebook.react.bridge.ReadableNativeMap cannot be cast to java.lang.string

I keep getting this error when filling the form and pressing the register button.

`@firebase/firestore: Firestore (7.19.0): Could not reach Cloud Firestore backend. Backend didn't respond within 10 seconds.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.
[Tue Aug 25 2020 12:57:48.133]  ERROR    The action 'NAVIGATE' with payload {"name":"Home","params":{"user":{"id":"4Foqi2I28cTIosFxwnYNmPHD2g53","email":"[email protected]","fullName":"Jukka"}}} was not handled by any navigator.
`
`
import 'react-native-gesture-handler';
import React, { useEffect, useState } from 'react'
import { NavigationContainer } from '@react-navigation/native'
import { createStackNavigator } from '@react-navigation/stack'
import { LoginScreen, HomeScreen, RegistrationScreen } from '../screens'
import {decode, encode} from 'base-64'
if (!global.btoa) {  global.btoa = encode }
if (!global.atob) { global.atob = decode }

const Stack = createStackNavigator();

export default function App() {

  const [loading, setLoading] = useState(true)
  const [user, setUser] = useState(null)

  return (
    <NavigationContainer>
      <Stack.Navigator>
        { user ? (
          <Stack.Screen name="Home">
            {props => <HomeScreen {...props} extraData={user} />}
          </Stack.Screen>
        ) : (
          <>
            <Stack.Screen name="Login" component={LoginScreen} />
            <Stack.Screen name="Registration" component={RegistrationScreen} />
          </>
        )}
      </Stack.Navigator>
    </NavigationContainer>
  );
}`

`import React, {useState} from 'react';
import {Image, Text, TextInput, TouchableOpacity, View, ToastAndroid , Alert} from 'react-native';
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
import styles from './RegisterStyle';
import { firebase } from '../../firebase/config'

export default function RegistrationScreen({navigation}) {
  const [fullName, setFullName] = useState('');
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');
  const [confirmPassword, setConfirmPassword] = useState('');

  const onFooterLinkPress = () => {
    navigation.navigate('Login');
  };

  const onRegisterPress = () => {
    if (password !== confirmPassword) {
      ToastAndroid.show("Passwords does not match!", ToastAndroid.SHORT);
      return
    }

    firebase
      .auth()
      .createUserWithEmailAndPassword(email, password)
      .then((response) => {
        const uid = response.user.uid
        const data = {
          id: uid,
          email,
          fullName
        }
        const usersRef = firebase.firestore().collection('users')
        usersRef
          .doc(uid)
          .set(data)
          .then(() => {
            navigation.navigate('Home', {user: data})
          })
      })

  };

  return (
    <View style={styles.container}>
      <KeyboardAwareScrollView
        style={{flex: 1, width: '100%'}}
        keyboardShouldPersistTaps="always">
        <Image
          style={styles.logo}
          source={require('../../../assets/icon.png')}
        />
        <TextInput
          style={styles.input}
          placeholder="Full Name"
          placeholderTextColor="#aaaaaa"
          onChangeText={(text) => setFullName(text)}
          value={fullName}
          underlineColorAndroid="transparent"
          autoCapitalize="none"
        />
        <TextInput
          style={styles.input}
          placeholder="E-mail"
          placeholderTextColor="#aaaaaa"
          onChangeText={(text) => setEmail(text)}
          value={email}
          underlineColorAndroid="transparent"
          autoCapitalize="none"
        />
        <TextInput
          style={styles.input}
          placeholderTextColor="#aaaaaa"
          secureTextEntry
          placeholder="Password"
          onChangeText={(text) => setPassword(text)}
          value={password}
          underlineColorAndroid="transparent"
          autoCapitalize="none"
        />
        <TextInput
          style={styles.input}
          placeholderTextColor="#aaaaaa"
          secureTextEntry
          placeholder="Confirm Password"
          onChangeText={(text) => setConfirmPassword(text)}
          value={confirmPassword}
          underlineColorAndroid="transparent"
          autoCapitalize="none"
        />
        <TouchableOpacity
          style={styles.button}
          onPress={() => onRegisterPress()}>
          <Text style={styles.buttonTitle}>Create account</Text>
        </TouchableOpacity>
        <View style={styles.footerView}>
          <Text style={styles.footerText}>
            Already got an account?{' '}
            <Text onPress={onFooterLinkPress} style={styles.footerLink}>
              Log in
            </Text>
          </Text>
        </View>
      </KeyboardAwareScrollView>
    </View>
  );
}
`
`import React, {useState} from 'react';
import {Image, Text, TextInput, TouchableOpacity, View, ToastAndroid} from 'react-native';
import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
import styles from './LoginStyle';
import { firebase } from '../../firebase/config'

export default function LoginScreen({navigation}) {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');

  const onFooterLinkPress = () => {
    navigation.navigate('Registration');
  };

  const onLoginPress = () => {
    firebase
    .auth()
    .signInWithEmailAndPassword(email, password)
    .then((response) => {
        const uid = response.user.uid
        const usersRef = firebase.firestore().collection('users')
        usersRef
            .doc(uid)
            .get()
            .then(firestoreDocument => {
                if (!firestoreDocument.exists) {
                  ToastAndroid.show("User does not exist anymore.", ToastAndroid.SHORT);
                  return;
                }
                const user = firestoreDocument.data()
                navigation.navigate('Home', {user})
            })
    })
  };

  return (
    <View style={styles.container}>
      <KeyboardAwareScrollView
        style={{flex: 1, width: '100%'}}
        keyboardShouldPersistTaps="always">
        <Image
          style={styles.logo}
          source={require('../../../assets/icon.png')}
        />
        <TextInput
          style={styles.input}
          placeholder="E-mail"
          placeholderTextColor="#aaaaaa"
          onChangeText={(text) => setEmail(text)}
          value={email}
          underlineColorAndroid="transparent"
          autoCapitalize="none"
        />
        <TextInput
          style={styles.input}
          placeholderTextColor="#aaaaaa"
          secureTextEntry
          placeholder="Password"
          onChangeText={(text) => setPassword(text)}
          value={password}
          underlineColorAndroid="transparent"
          autoCapitalize="none"
        />
        <TouchableOpacity style={styles.button} onPress={() => onLoginPress()}>
          <Text style={styles.buttonTitle}>Log in</Text>
        </TouchableOpacity>
        <View style={styles.footerView}>
          <Text style={styles.footerText}>
            Don't have an account?{' '}
            <Text onPress={onFooterLinkPress} style={styles.footerLink}>
              Sign up
            </Text>
          </Text>
        </View>
      </KeyboardAwareScrollView>
    </View>
  );
}
`

`(parameter) response: firebase.auth.UserCredential
Object is possibly 'null'`

Issue with navigation handler when navigate to a new screen

The action 'NAVIGATE' with payload {"name":"Home","params":{"user":{"email":"xxxx","id":"xxx","fullName":"test"}}} was not handled by any navigator #3

Firebase crashing after installation

After installing firebase I get the following error and message:

I'm using an android emulator and a physical device to test. Both got disconected from metro after the installation.

package.json:

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "expo": "~38.0.1",
    "expo-status-bar": "^1.0.0",
    "firebase": "^7.15.5",
    "react": "~16.11.0",
    "react-dom": "~16.11.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-38.0.0.tar.gz",
    "react-native-web": "~0.11.7"
  },
  "devDependencies": {
    "@babel/core": "^7.8.6",
    "babel-preset-expo": "~8.1.0"
  },
  "private": true
}

events.js:292
      throw er; // Unhandled 'error' event
      ^

Error: EPERM: operation not permitted, lstat 'C:\Users\joaquin\Desktop\WORKSPACE\react-native-firebase\node_modules\.bin\atob'
Emitted 'error' event on NodeWatcher instance at:
    at NodeWatcher.<anonymous> (C:\Users\joaquin\Desktop\WORKSPACE\react-native-firebase\node_modules\sane\src\node_watcher.js:291:16)
    at FSReqCallback.oncomplete (fs.js:175:21) {
  errno: -4048,
  code: 'EPERM',
  syscall: 'lstat',
  path: 'C:\\Users\\joaquin\\Desktop\\WORKSPACE\\react-native-firebase\\node_modules\\.bin\\atob'
}

Cannot connect to the Metro server.

Try the following to fix the issue:
- Ensure that the Metro server is running and available on the same network  
- Ensure that your device/emulator is connected to your machine and has USB debugging enabled - run 'adb devices' to see a list of connected devices      
- If you're on a physical device connected to the same machine, run 'adb reverse tcp:8081 tcp:8081' to forward requests from your device
- If your device is on the same Wi-Fi network, set 'Debug server host & port 
for device' in 'Dev settings' to your machine's IP address and the port of the local dev server - e.g. 10.0.1.1:8081

URL: 192.168.1.33:19001

Error: Connection reset
* [native code]:null in __expoConsoleLog
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:75431:20 in warn
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:73222:23 in registerWarning
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:73139:33 in warnImpl
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:73084:20 in warn
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:113031:22 in warn
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:36848:18 in setHMRUnavailableReason    
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:36783:31 in <unknown>
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:37321:34 in emit
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:37040:18 in onerror
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:34551:30 in dispatchEvent
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:35256:30 in <unknown>
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:3898:41 in emit
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:3254:48 in __callFunction
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:2976:30 in <unknown>
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:3208:14 in __guard
* http://192.168.1.33:19001/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&minify=false&hot=false:2975:20 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue

I saw another message telling that the firebase sdk needed to be in version 7.9.0. But your repo has 7.14.0