Using Firebase Database with React-Table - reactjs

Question

I have some difficulties in trying to make React-Table work with Firebase Database.
I have this logic to get the data from a Firebase DB:
const servicesCollectionRef = collection(db, "service");
const [serviceRequests, setServiceRequest] = useState([]);
const fetchServiceRequest = async () => {
const response = await getDocs(servicesCollectionRef);
const querySnapshot = await getDocs(servicesCollectionRef);
console.log(querySnapshot.docs);
querySnapshot.forEach((doc) => {
console.log(`${doc.id} => ${JSON.stringify(doc.data())}`);
});
setServiceRequest(querySnapshot.docs)
};
useEffect(() => {
fetchServiceRequest();
}, []);
What I don't understand is how can I save the data, because in my console I get this when logging the console.log(querySnapshot.docs):
(2) [Mu, Mu]
0: Mu {_firestore: La, _userDataWriter: dh, _key: Dt, _document: Gt, _converter: null, …}
1: Mu {_firestore: La, _userDataWriter: dh, _key: Dt, _document: Gt, _converter: null, …}
length: 2
[[Prototype]]: Array(0)
How do I have to save my db data or how do i have to acces it in order to also have the columns for React-Table work:
const data = useMemo(() => [...serviceRequests], [serviceRequests]);
const columns = useMemo(
() => [
{
Header: "Cerere",
columns: [
{
Header: "Id",
accessor: "id",
},
{
Header: "Email",
accessor: "Email",
},
{
Header: "Nume",
accessor: "NumeClient",
},
{
Header: "Prenume",
accessor: "PrenumeClient",
},
{
Header: "Pachet",
accessor: "Pachet",
},
{
Header: "Pret",
accessor: "Pret",
},
],
},
{
Header: "Asignare Medic",
columns: [
{
Header: "Medic",
accessor: "Nume",
},
],
},
],
[]
);
// const tableInstance = useTable({ columns, data });
Thank you in advance!