-
-
+
+
+
-
-
-
{" "}
-
-
-
-
-
-
{" "}
-
-
-
-
-
-
{" "}
-
-
-
-
-
-
-
-
-
{" "}
-
- {" "}
-
- Discover New Groups
- {" "}
+
+ {/* Map loops through groups array, assigns the number of members to variable and generates card */}
+ {groups.map((group, index) => {
+ return (
+
+
+
+ );
+ })}
+
+
See All
-
See All
-
- );
-};
+ );
+ }
+}
export default DirectoryGroups;
diff --git a/client/src/pages/MemberProfilePage/MemberProfilePage.js b/client/src/pages/MemberProfilePage/MemberProfilePage.js
index 4b663e44a..3c9f9b3dd 100644
--- a/client/src/pages/MemberProfilePage/MemberProfilePage.js
+++ b/client/src/pages/MemberProfilePage/MemberProfilePage.js
@@ -96,45 +96,45 @@ class MemberProfilePage extends Component {
let testUsers = [
{
userId: 1,
- userFirstName: "Paula",
- userSurname: "Bannerman",
- userPic: pic1
+ first_name: "Paula",
+ last_name: "Bannerman",
+ image: pic1
},
{
userId: 2,
- userFirstName: "Jack",
- userSurname: "Johnson",
- userPic: pic2
+ first_name: "Jack",
+ last_name: "Johnson",
+ image: pic2
},
{
userId: 3,
- userFirstName: "Jenny",
- userSurname: "Jones",
- userPic: pic3
+ first_name: "Jenny",
+ last_name: "Jones",
+ image: pic3
},
{
userId: 4,
- userFirstName: "Joan",
- userSurname: "Rivers",
- userPic: pic4
+ first_name: "Joan",
+ last_name: "Rivers",
+ image: pic4
},
{
userId: 5,
- userFirstName: "Freddy",
- userSurname: "Mercury",
- userPic: pic2
+ first_name: "Freddy",
+ last_name: "Mercury",
+ image: pic2
},
{
userId: 5,
- userFirstName: "Leslie",
- userSurname: "Knope",
- userPic: pic3
+ first_name: "Leslie",
+ last_name: "Knope",
+ image: pic3
},
{
userId: 7,
- userFirstName: "Frank",
- userSurname: "Ocean",
- userPic: pic1
+ first_name: "Frank",
+ last_name: "Ocean",
+ image: pic1
}
];
diff --git a/client/src/services/Groups.js b/client/src/services/Groups.js
new file mode 100644
index 000000000..100214111
--- /dev/null
+++ b/client/src/services/Groups.js
@@ -0,0 +1,37 @@
+import { BASE_URL } from "./constants";
+import axios from 'axios';
+
+
+export function getGroup() {
+ if (this.state.groupId !== undefined) {
+ axios.get(`${BASE_URL}/groups/${this.state.groupId}`,
+ {
+ headers: {
+ Authorization: `Token ${localStorage.getItem("token")}`
+ }
+ })
+ .then(res => {
+
+ this.setState({
+ groupData: res.data
+ })
+ })
+ .catch(res => console.log(res))
+ }
+}
+
+export function getAllGroups(callback = null) {
+ axios.get(`${BASE_URL}/groups`,
+ {
+ headers: {
+ Authorization: `Token ${localStorage.getItem("token")}`
+ }
+ })
+ .then(res => {
+
+ this.setState({
+ groupList: res.data
+ }, callback)
+ })
+ .catch(res => console.log(res))
+}