In the following code, you can see that the second useCollec

I solved it like this but I don't like it. <div class="highlight highlight-source-

useCollection - chain requests by using previous data in refs about react-firebase-hooks HOT 6 CLOSED

csfrequency commented on May 31, 2024

useCollection - chain requests by using previous data in refs

from react-firebase-hooks.

Comments (6)

nmaves commented on May 31, 2024 4

This is a standard react hooks issue. You need to conditional send the second firebase reference.

const [organisation, loadingOrganisation, errorOrganisation] = useCollection(
    firebase.firestore().collection('organisations').where("members", "array-contains", user.uid),
    {
      snapshotListenOptions: { includeMetadataChanges: true },
    }
  );

  const [projects, loadingProjects, errorProjects] = useCollection(
    organisation && firebase.firestore().collection('organisations').doc(organisation[0].id).collection("projects"),
    {
      snapshotListenOptions: { includeMetadataChanges: true },
    }
  );

from react-firebase-hooks.

benjamin-sommer commented on May 31, 2024

Thanks, that worked!

from react-firebase-hooks.

nmaves commented on May 31, 2024

You're welcome.

from react-firebase-hooks.

chrisbianca commented on May 31, 2024

Closing as this has been answered

from react-firebase-hooks.

ZakKa89 commented on May 31, 2024

with v5 of this api and v9 of firebase I'm running into issues. Before, I could do something like:

  const [processCollection, loading] = useCollectionData<ProcessDoc>(
    projectId &&
      firebase
        .firestore()
        .collection('projects')
        .doc(projectId)
        .collection('processes')
        // .where("state", "==", "published"),
        .orderBy('index', 'asc'),
    {
      snapshotListenOptions: { includeMetadataChanges: true },
      idField: 'id',
    }
  );

Now I can't do that since I have to set the ref first:

  const projectRef = doc(getFirestore(), 'projects', projectId);

  const processesRef = collection(projectRef, 'processes').withConverter(
    processConverter
  );

  const [processCollection, loading, error] =
    useCollectionData<ProcessDoc>(processesRef);

Any ideas on how to prevent executing the projectRef, processesRef based on if the projectId is truthy? It seems to be a firebase issue but I can't find a solution online.

from react-firebase-hooks.

ZakKa89 commented on May 31, 2024

I solved it like this but I don't like it.

   const projectRef = projectId && doc(db, 'projects', projectId);

  const processesRef =
    projectRef &&
    collection(projectRef, 'processes').withConverter(processConverter);

  const orderedProcessesQuery =
    processesRef && query(processesRef, orderBy('index', 'asc'));

  const [processCollection, loading, error] = useCollectionData<ProcessDoc>(
    orderedProcessesQuery
  );