Merge pull request #32 from mbarbas11/show_club

Feature | get club data

Author: votrungquan1999

packages/backend/controllers/clubs.js

@@ -62,12 +62,12 @@ async function getClub(club_id) {
     .collection("clubs")
     .doc(club_id)
     .get();
-
   if (doc.exists) {
     //handling error iff ID does not exist..firestore doesnt catch doc not found error
     try {
       const club = await doc.ref.get();
       return club.data();
+      console.log(club.data())
     } catch (error) {
       console.log({error})
       return null;

packages/frontend/src/apis/endpoints.js

@@ -1,3 +1,3 @@
-const devBackendDomain = 'localhost:3000' // example
+const devBackendDomain = 'http://localhost:3000' // example
 
-export const clubEndpoint = `${devBackendDomain}/club` // example
+export const clubEndpoint = `${devBackendDomain}/club` // example

packages/frontend/src/pages/ClubPage/ClubPage.js

@@ -1,8 +1,29 @@
-import React from 'react';
-import styles from './ClubPage.module.css';
 
-const ClubPage = () => {
-	return <div className={styles.root}>Club Page details</div>;
+import React, { useState, useEffect } from "react";
+import styles from "./ClubPage.module.css";
+//import { clubEndpoint, clubID } from "../../apis/endpoints";
+
+const ClubPage = props => {
+  const [club, setClubData] = useState({}); //club is state where club data is stored 
+
+  async function getClub() {
+    const { id } = props.match.params;
+    const res = await fetch(`http://localhost:3000/club/${id}`);
+
+    
+
+    res
+      .json()
+      .then(res => setClubData(res))
+      .catch(err => err);
+  }
+
+  useEffect(() => {
+    getClub();
+  }, []);
+
+return <div className={styles.root}>ClubPage</div>; //JSON.stringify(club) // {club.name}...
 };
 
+
 export default ClubPage;