How can I get uid of all documents if I use useFirestoreCollectionData hook ?

[catrawalkar]

Version info

React:

Firebase:

ReactFire:

Other (e.g. Node, browser, operating system) (if applicable):

Test case

After fetching all the documents from a collection, if i want to update one document, how can I do it? I think it will require document uid for this. There is no way to get document ids of all documents.

Is is possible to pass a flag to useFirestoreCollection and useFirestoreCollectionData which will do this:

snapshot.forEach(data=>{
    return {uid: data.uid, ...data.data()}
})

Steps to reproduce

Expected behavior

Actual behavior

[jhuleatt]

Hi @catrawalkar , useFirestoreCollectionData accepts a config object that allows you to add an id field to each object in the array it returns. The sample shows how this is done:

reactfire/sample/src/Firestore.js

Line 74 in 68cfc79

const animals = useFirestoreCollectionData(query, { idField: 'id' });

This will add an id key to every result. The returned objects will look like this:

[
    {
        commonName: 'Giraffe',
        id: 'theDocumentId' // the key is `id` because we set `idField` to "id"
    }
]

It looks like the reference is missing this information. Sorry about that! Any chance you have a moment to create a PR for that? Otherwise I can add it :)

[catrawalkar]

@jhuleatt Sure, I will try to create a PR for this. What other things can be configured using config object?

Also, before opening an issue, i tried a lot to figure out if this is possible by digging out in the code. I was not able to figure out due to lack of RxJS, TS know how..! Can you help me with good resources to learn these things so I can contribute here?

[jhuleatt]

Great!

Re: learning: It might help if I explain the source of useFirestoreCollectionData a bit:

reactfire/reactfire/firestore/index.tsx

Lines 111 to 116 in 68cfc79

	export function useFirestoreCollectionData<T = { [key: string]: unknown }>(query: firestore.Query, options?: ReactFireOptions<T[]>): T[] {
	const idField = checkIdField(options);
	const queryId = `firestore:collectionData:${getUniqueIdForFirestoreQuery(query)}:idField=${idField}`;
	return useObservable(collectionData(query, idField), queryId, checkStartWithValue(options));
	}

The options argument's type is ReactFireOptions:

reactfire/reactfire/index.ts

Lines 1 to 4 in 68cfc79

	export interface ReactFireOptions<T = unknown> {
	startWithValue?: T;
	idField?: string;
	}

It uses RxFire's collectionData observable to subscribe to a collection and extract an object from each document