mirror of
https://github.com/myfatemi04/wheelshare-frontend.git
synced 2025-04-09 22:00:16 -04:00
connected the API to the frontend
This commit is contained in:
parent
1d20268443
commit
d257ef52ec
|
@ -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" />
|
||||
|
|
2
src/api.js
Normal file
2
src/api.js
Normal file
|
@ -0,0 +1,2 @@
|
|||
const dev = process.env.NODE_ENV === 'development';
|
||||
export const API_ENDPOINT = 'http://localhost/api';
|
|
@ -0,0 +1,7 @@
|
|||
export default function Main() {
|
||||
return (
|
||||
<div className="d-flex flex-column">
|
||||
<h1>About Us</h1>
|
||||
</div>
|
||||
);
|
||||
}
|
|
@ -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 = () => {
|
||||
fetch(`${process.env.REACT_APP_API_ENDPOINT}/pools/`)
|
||||
useEffect(() => {
|
||||
console.log(process.env);
|
||||
fetch(`${API_ENDPOINT}/my_pools`)
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
if (data !== undefined) {
|
||||
setPools(data.Pools);
|
||||
.then((json) => {
|
||||
if (json) {
|
||||
setPools(json.data);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
callAPI();
|
||||
}, []);
|
||||
|
||||
const maybePluralize = (count, noun, suffix = 's') =>
|
||||
`${count} ${noun}${count !== 1 ? suffix : ''}`;
|
||||
return (
|
||||
|
|
|
@ -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',
|
||||
|
|
Loading…
Reference in New Issue
Block a user