How to use the reactfire.useFirebaseApp function in reactfire

To help you get started, we’ve selected a few reactfire examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github prescottprue / generator-react-firebase / examples / react-firebase / src / routes / Projects / components / ProjectTile / ProjectTile.js View on Github external
function ProjectTile({ name, projectId, showDelete }) {
  const classes = useStyles()
  const history = useHistory()
  const firebase = useFirebaseApp()

  function goToProject() {
    return history.push(`${LIST_PATH}/${projectId}`)
  }

  function deleteProject() {
    return firebase
      .firestore()
      .collection('projects')
      .doc(projectId)
      .delete()
      .catch(err => {
        console.error('Error:', err) // eslint-disable-line no-console
        return Promise.reject(err)
      })
  }
github prescottprue / generator-react-firebase / examples / react-firebase / src / routes / Account / components / AccountEditor / AccountEditor.js View on Github external
function AccountEditor() {
  const classes = useStyles()
  const firebase = useFirebaseApp()
  const auth = useUser()
  const accountRef = firebase.database().ref(`users/${auth.uid}`)
  const profileSnap = useDatabaseObject(accountRef)
  const profile = profileSnap.snapshot.val()

  function updateAccount(newAccount) {
    return firebase
      .updateProfile(newAccount)
      .then(() => accountRef.update(newAccount))
      .catch(error => {
        console.error('Error updating profile', error.message || error) // eslint-disable-line no-console
        return Promise.reject(error)
      })
  }

  return (
github prescottprue / generator-react-firebase / examples / react-firebase / src / routes / Projects / components / ProjectsList / ProjectsList.js View on Github external
function useProjectsList() {
  // Get current user (loading handled by Suspense in ProjectsList)
  const auth = useUser()
  const firebase = useFirebaseApp()

  // Create a ref for projects owned by the current user
  const projectsRef = firebase
    .database()
    .ref('projects')
    .orderByChild('createdBy')
    .equalTo(auth.uid)

  // Query for projects (loading handled by Suspense in ProjectsList)
  const projects = useDatabaseList(projectsRef)

  // New dialog
  const [newDialogOpen, changeDialogState] = useState(false)
  const toggleDialog = () => changeDialogState(!newDialogOpen)

  function addProject(newInstance) {
github FirebaseExtended / reactfire / sample / src / App.js View on Github external
const App = () => {
  const firebaseApp = useFirebaseApp();

  // Kick off fetches for SDKs and data that
  // we know our components will eventually need.
  //
  // This is OPTIONAL but encouraged as part of the render-as-you-fetch pattern
  // https://reactjs.org/docs/concurrent-mode-suspense.html#approach-3-render-as-you-fetch-using-suspense
  preloadSDKs(firebaseApp).then(preloadData(firebaseApp));

  return (
    <>
      <h1>
         ReactFire Demo 
      </h1>
      <div>
        
          </div>
github prescottprue / generator-react-firebase / examples / react-firebase / src / containers / Navbar / AccountMenu.js View on Github external
function AccountMenu() {
  const classes = useStyles()
  const [anchorEl, setMenu] = useState(null)
  const history = useHistory()
  const firebase = useFirebaseApp()

  function closeAccountMenu(e) {
    setMenu(null)
  }
  function handleMenu(e) {
    setMenu(e.target)
  }
  function handleLogout() {
    closeAccountMenu()
    // redirect to '/' handled by UserIsAuthenticated HOC
    return firebase.auth().signOut()
  }
  function goToAccount() {
    closeAccountMenu()
    history.push(ACCOUNT_PATH)
  }
github prescottprue / generator-react-firebase / examples / react-firebase / src / routes / Signup / components / SignupPage / SignupPage.js View on Github external
function SignupPage() {
  const classes = useStyles()
  const firebase = useFirebaseApp()

  function googleLogin() {
    const provider = new firebase.auth.GoogleAuthProvider()
    return firebase.auth().signInWithPopup(provider)
  }

  function emailSignup(creds) {
    return firebase
      .auth()
      .createUserWithEmailAndPassword(creds.email, creds.password)
  }

  return (
    <div>
      
        </div>
github prescottprue / generator-react-firebase / examples / react-firebase / src / routes / Login / components / LoginPage / LoginPage.js View on Github external
function LoginPage() {
  const classes = useStyles()
  const firebase = useFirebaseApp()

  function googleLogin() {
    const provider = new firebase.auth.GoogleAuthProvider()
    return firebase.auth().signInWithPopup(provider)
  }

  function emailLogin(creds) {
    return firebase
      .auth()
      .signInWithEmailAndPassword(creds.email, creds.password)
  }

  return (
    <div>
      
        </div>