connected the API to the frontend

.env

@@ -0,0 +1 @@
+REACT_APP_API_ENDPOINT=http://localhost:8080/api

src/App.js

@@ -1,8 +1,6 @@
 import React from 'react';
 import { BrowserRouter, Route, Switch } from 'react-router-dom';
 import Nav from './components/Nav';
-import Signin from './components/auth/Signin';
-import Signup from './components/auth/Signup';
 import Pools from './components/Pools';
 import Pool from './components/Pool';
 import Profile from './components/Profile';
@@ -20,8 +18,6 @@ function App() {
 			<BrowserRouter>
 				<Nav />
 				<Switch>
-					<Route component={Signup} path="/register" />
-					<Route component={Signin} path="/login" />
 					<Route component={Main} path="/about" />
 					<Route component={CreatePool} path="/create_pool" />
 					<Route component={UpdatePool} path="/update_pool" />

src/api.js

@@ -0,0 +1,2 @@
+const dev = process.env.NODE_ENV === 'development';
+export const API_ENDPOINT = 'http://localhost/api';

src/components/Main.js

@@ -0,0 +1,7 @@
+export default function Main() {
+	return (
+		<div className="d-flex flex-column">
+			<h1>About Us</h1>
+		</div>
+	);
+}

src/components/Pools.js

@@ -1,7 +1,9 @@
 import React, { useState, useEffect } from 'react';
+import { API_ENDPOINT } from '../api';
 
 const Pools = (props) => {
 	const [pools, setPools] = useState([
+		/*
 		{
 			id: 1,
 			pool_title: 'TJ Carpool',
@@ -49,22 +51,20 @@ const Pools = (props) => {
 			comments: [
 				'What is the covid vaccination status of all the participants?',
 			],
-		},
+		},*/
 	]);
 
-	const callAPI = () => {
+	useEffect(() => {
-		fetch(`${process.env.REACT_APP_API_ENDPOINT}/pools/`)
+		console.log(process.env);
+		fetch(`${API_ENDPOINT}/my_pools`)
 			.then((response) => response.json())
-			.then((data) => {
+			.then((json) => {
-				if (data !== undefined) {
+				if (json) {
-					setPools(data.Pools);
+					setPools(json.data);
 				}
 			});
-	};
-
-	useEffect(() => {
-		callAPI();
 	}, []);
+
 	const maybePluralize = (count, noun, suffix = 's') =>
 		`${count} ${noun}${count !== 1 ? suffix : ''}`;
 	return (

src/components/UpdatePool.js

@@ -2,6 +2,8 @@ import React, { useState, useEffect, useCallback } from 'react';
 
 const UpdatePool = (props) => {
 	const id = props.match.params.id;
+
+	// eslint-disable-next-line
 	const [pool, setPool] = useState({
 		id: 1,
 		pool_title: 'TJ Carpool',