Questions tagged [reactfire]

53 questions
13
votes
3 answers

Firebase hosting + React with webpack

Is there a way to add Firebase hosting to React project that utilizes webpack? Specifically, I am trying to add it to https://github.com/mxstbr/react-boilerplate This is my firebase.json file { "hosting": { "firebase": "name", "public":…
astiefel
  • 2,038
  • 2
  • 16
  • 22
5
votes
2 answers

Reactfire, aren't mixins deprecated?

I am browsing the reactfire github and they use mixins. I thought they were deprecated? Am I behind the times?
omgj
  • 1,369
  • 3
  • 12
  • 18
4
votes
0 answers

Reactfire fails in Next/React app due to "Attempted import error"

I'm wrapping the children of my Next root layout with the Reactfire providers I need: import './globals.css'; import { AuthProvider, FirebaseAppProvider } from 'reactfire'; import { auth, firebaseConfig } from '../config/firebase'; export default…
4
votes
1 answer

How to setup App Check in dev environment and last next js 13.4 project with app directory and reactfire?

I was unable to use "firebese app check" in a Next.js 13.4 project with the "app" directory in development mode. I tried using ReactFire, but I only encountered errors. The latest version of Next.js is in SSR, so I attempted to use effects to access…
4
votes
3 answers

How to use firestore emulator with reactfire?

I have set up firestore locally following the firebase docs and I can test firebase functions easily. I would love to develop locally with an local firestore database. In the docs they provide the following code: // Initialize your Web app as…
Marian Rick
  • 3,350
  • 4
  • 31
  • 67
3
votes
1 answer

Firebase v9: Get documents after user auth (with reactfire)

I am using the new Firebase SDK v9 with React (Next.js) and ReactFire. I want to get a firestore sub-collection by the user auth id: import { useFirestore, useFirestoreCollectionData, useSigninCheck } from "reactfire"; import { collection } from…
3
votes
0 answers

How do I type this data? It's an object, but I can't find what type of object so if I don't set it as any code won't recognize bool var on the data

I'm sorry I tried googling it, tried reading the documents which came up with and other stackoverflow posts which mentioned using 'DocumentSnapshot' or firestore.documentdata. but it didn't work. I tried object too. Only any works…
3
votes
3 answers

Missing permissions error message right after login

I have an "Uncaught FirebaseError: Missing or insufficient permissions." error when I sign into my app. The problem occurs on the redirection immediately after login. I currently have no error boundaries so a blank white screen with this error…
rm4
  • 711
  • 4
  • 15
3
votes
2 answers

EPERM error installing ReactFire in jspm

I'm trying to install ReactFire with jspm. The command I use is: jspm install npm:reactfire It installs a bunch of dependencies, then gives this error: warn Error on build Error: EPERM: operation not permitted, open…
aldel
  • 6,489
  • 1
  • 27
  • 32
2
votes
1 answer

Firebase realtime database leaks protected data in websocket connection?

I have defined a realtime database rule as follows: { "rules": { ".read": false, ".write": false, "devices": { ".read": "auth.uid != null && query.orderByChild == 'ownerUid' && query.equalTo == auth.uid", "$device": { …
2
votes
1 answer

getting unexcepted response from firestore

I'm learning these times how to work with Firebase and react Now, I created a "users" collection and add a test doc to it named "one" as I show below. However, When I tried to get this doc I get many data which probably has nothing to do with that…
2
votes
0 answers

How to update when data is loaded with ReactFire and Express.js?

Using this code from the ReactFire tutorial: import React, { Component, Suspense } from 'react'; import { render } from 'react-dom'; import 'firebase/database'; import { FirebaseAppProvider, useFirestoreDocData, useFirestore, SuspenseWithPerf }…
2
votes
2 answers

How to enable persistence on reactfire?

I'd like to implement Firestore offline persistence on my PWA React app using the reactfire library. const firestore = useFirestore().enablePersistence(); let documentReference = firestore .collection("food") .doc("milkshake"); const {…
2
votes
1 answer

Retrieve Data from a Many-to-Many Structure Similar to Prase query.include

We are migrating an app from Parse to Firebase and I'd like to build a UI where I can show the student name along with the classroom that s/he belongs to from the following Firebase data structure. For example, the class room name for aluck is 10th…
1
vote
1 answer

integrate firestore from v8 to v9

I am looking to retrieve my sub collection "messages" within the "channels" collection and display them on my chat page. I tried different tactics like useEffect but with no result. How would I change this line of code from v8 to v9?: const…
1
2 3 4