Reputation: 43
I wanna try to retrieve all data and subcollections from my data base using react-firebase-redux
That's my code
I'm using firestoreConnect(()
import React, { Component } from "react";
import { Progress, Table } from "reactstrap";
import { connect } from "react-redux";
import { compose } from "redux";
import { firestoreConnect } from "react-redux-firebase";
class coachsTab extends Component {
render() {
return (
<Table hover responsive className="table-outline mb-0 d-none d-sm-table">
<thead className="thead-light">
<tr>
<th className="text-center">
<i className="icon-people"></i>
</th>
<th>User</th>
<th className="text-center">Country</th>
<th>Usage</th>
<th className="text-center">Payment Method</th>
<th>Activity</th>
</tr>
</thead>
<tbody>
<tr>
<td className="text-center">
<div className="avatar">
<img
src={"assets/img/avatars/6.jpg"}
className="img-avatar"
alt="[email protected]"
/>
<span className="avatar-status badge-danger"></span>
</div>
</td>
<td>
<div>Friderik Dávid</div>
<div className="small text-muted">
<span>New</span>| Registered: Jan 1, 2015
</div>
</td>
<td className="text-center">
<i
className="flag-icon flag-icon-pl h4 mb-0"
title="pl"
id="pl"
></i>
</td>
<td>
<div className="clearfix">
<div className="float-left">
<strong>43%</strong>
</div>
<div className="float-right">
<small className="text-muted">
Jun 11, 2015 - Jul 10, 2015
</small>
</div>
</div>
<Progress className="progress-xs" color="success" value="43" />
</td>
<td className="text-center">
<i
className="fa fa-cc-amex"
style={{
fontSize: 24 + "px",
}}
></i>
</td>
<td>
<div className="small text-muted">Last login</div>
<strong>Yesterday</strong>
</td>
</tr>
</tbody>
</Table>
);
}
}
const mapStateToProps = (state) => {
console.log("state", state);
const coach = state.firestore.data;
console.log("coach", coach);
return {
coach: coach,
};
};
export default compose(
connect(mapStateToProps),
firestoreConnect(() => [
{
collection: "coach",
},
])
)(coachsTab);
Upvotes: 0
Views: 56
Reputation: 7418
To get the subcollections you can rewrite this part of your code to:
firestoreConnect(props => {
return [
{
collection: "coach",
doc: coachId,
subcollection: [{ collection: "album" },{ collection:"default"}]
}
];
})
Upvotes: 0