diff --git a/src/App.tsx b/src/App.tsx
index 612b174..e49403c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -8,7 +8,6 @@ import CreatePool from './components/CreatePool';
import CreateGroup from './components/CreateGroup';
import Groups from './components/Groups';
import MyGroups from './components/MyGroups';
-import MyPools from './components/MyPools';
import UpdatePool from './components/UpdatePool';
import Home from './components/Home';
import Main from './components/Main';
@@ -30,7 +29,6 @@ function App() {
-
diff --git a/src/components/MyPools.tsx b/src/components/MyPools.tsx
deleted file mode 100644
index 93d0d27..0000000
--- a/src/components/MyPools.tsx
+++ /dev/null
@@ -1,146 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { API_ENDPOINT } from '../api/api';
-import { makeStyles } from '@material-ui/core/styles';
-import Card from '@material-ui/core/Card';
-import CardActionArea from '@material-ui/core/CardActionArea';
-import CardActions from '@material-ui/core/CardActions';
-import CardContent from '@material-ui/core/CardContent';
-import CardMedia from '@material-ui/core/CardMedia';
-import Button from '@material-ui/core/Button';
-import Typography from '@material-ui/core/Typography';
-
-const useStyles = makeStyles({
- root: {
- maxWidth: 345,
- },
- media: {
- height: 140,
- },
-});
-const MyPools = () => {
- // const id = props.match.params.id;
- const [pools, setPools] = useState([
- {
- id: 1,
- pool_title: 'TJ Carpool',
- pool_text: 'Carpool from TJ track to homes',
- start_time: '4/10/2021 3:00 PM',
- end_time: '4/10/2021 4:00 PM',
- capacity: 2,
- participants: [],
- comments: [
- 'What is the covid vaccination status of all the participants?',
- ],
- },
- {
- id: 2,
- pool_title: 'TJ Carpool',
- pool_text: 'Carpool from TJ track to homes',
- start_time: '4/10/2021 3:00 PM',
- end_time: '4/10/2021 4:00 PM',
- capacity: 2,
- participants: [],
- comments: [
- 'What is the covid vaccination status of all the participants?',
- ],
- },
- {
- id: 3,
- pool_title: 'TJ Carpool',
- pool_text: 'Carpool from TJ track to homes',
- start_time: '4/10/2021 3:00 PM',
- end_time: '4/10/2021 4:00 PM',
- capacity: 2,
- participants: [],
- comments: [
- 'What is the covid vaccination status of all the participants?',
- ],
- },
- {
- id: 4,
- pool_title: 'TJ Carpool',
- pool_text: 'Carpool from TJ track to homes',
- start_time: '4/10/2021 3:00 PM',
- end_time: '4/10/2021 4:00 PM',
- capacity: 2,
- participants: [],
- comments: [
- 'What is the covid vaccination status of all the participants?',
- ],
- },
- ]);
-
- useEffect(() => {
- console.log(process.env);
- fetch(`${API_ENDPOINT}/my_pools`)
- .then((response) => response.json())
- .then((json) => {
- if (json) {
- setPools(json.data);
- }
- });
- }, []);
-
- const maybePluralize = (count: number, noun: string, suffix = 's') =>
- `${count} ${noun}${count !== 1 ? suffix : ''}`;
- const classes = useStyles();
-
- return (
-
-
- Pools
-
-
- Create Pool
-
-
-
- {pools.map((pool, index) => {
- let background;
- if (index % 2 === 0) {
- background = '#F1EAE8';
- } else {
- background = '#FFFFFF';
- }
- return (
-
-
-
-
- {pool.pool_title}
-
-
- Lizards are a widespread group of squamate reptiles, with
- over 6,000 species, ranging across all continents except
- Antarctica
-
-
-
-
-
-
-
-
- );
- })}
-
-
- );
-};
-
-export default MyPools;
diff --git a/src/components/Nav.tsx b/src/components/Nav.tsx
index f2993f1..595a4e6 100644
--- a/src/components/Nav.tsx
+++ b/src/components/Nav.tsx
@@ -24,7 +24,6 @@ const navLinks = [
{ title: `Profile`, path: `/profile` },
{ title: `Groups`, path: `/groups` },
{ title: `MyGroups`, path: `/mygroups` },
- { title: `MyPools`, path: `/mypools` },
];
const Nav = () => {
const classes = useStyles();
diff --git a/src/components/Profile.tsx b/src/components/Profile.tsx
index 3e7935c..5beca9e 100644
--- a/src/components/Profile.tsx
+++ b/src/components/Profile.tsx
@@ -22,46 +22,58 @@ const Profile = () => {
user: {
username: 'HyperionLegion',
},
- pools: [
- {
- title: 'TJ Carpool',
- description: 'Carpool from TJ track to homes',
- start_time: '4/10/2021 3:00 PM',
- id: 1,
- end_time: '4/10/2021 4:00 PM',
- capacity: 2,
- participants: [],
- comments: [
- 'What is the covid vaccination status of all the participants?',
- ],
- },
- {
- title: 'TJ Carpool',
- description: 'Carpool from TJ track to homes',
- start_time: '4/10/2021 3:00 PM',
- id: 2,
- end_time: '4/10/2021 4:00 PM',
- capacity: 2,
- participants: [],
- comments: [
- 'What is the covid vaccination status of all the participants?',
- ],
- },
- {
- title: 'TJ Carpool',
- description: 'Carpool from TJ track to homes',
- start_time: '4/10/2021 3:00 PM',
- id: 3,
- end_time: '4/10/2021 4:00 PM',
- capacity: 2,
- participants: [],
- comments: [
- 'What is the covid vaccination status of all the participants?',
- ],
- },
- ],
groups: [],
});
+ const [pools, setPools] = useState([
+ {
+ id: 1,
+ pool_title: 'TJ Carpool',
+ pool_text: 'Carpool from TJ track to homes',
+ start_time: '4/10/2021 3:00 PM',
+ end_time: '4/10/2021 4:00 PM',
+ capacity: 2,
+ participants: [],
+ comments: [
+ 'What is the covid vaccination status of all the participants?',
+ ],
+ },
+ {
+ id: 2,
+ pool_title: 'TJ Carpool',
+ pool_text: 'Carpool from TJ track to homes',
+ start_time: '4/10/2021 3:00 PM',
+ end_time: '4/10/2021 4:00 PM',
+ capacity: 2,
+ participants: [],
+ comments: [
+ 'What is the covid vaccination status of all the participants?',
+ ],
+ },
+ {
+ id: 3,
+ pool_title: 'TJ Carpool',
+ pool_text: 'Carpool from TJ track to homes',
+ start_time: '4/10/2021 3:00 PM',
+ end_time: '4/10/2021 4:00 PM',
+ capacity: 2,
+ participants: [],
+ comments: [
+ 'What is the covid vaccination status of all the participants?',
+ ],
+ },
+ {
+ id: 4,
+ pool_title: 'TJ Carpool',
+ pool_text: 'Carpool from TJ track to homes',
+ start_time: '4/10/2021 3:00 PM',
+ end_time: '4/10/2021 4:00 PM',
+ capacity: 2,
+ participants: [],
+ comments: [
+ 'What is the covid vaccination status of all the participants?',
+ ],
+ },
+ ]);
const classes = useStyles();
const callAPI = () => {
@@ -75,7 +87,14 @@ const Profile = () => {
};
useEffect(() => {
- callAPI();
+ console.log(process.env);
+ fetch(`${API_ENDPOINT}/my_pools`)
+ .then((response) => response.json())
+ .then((json) => {
+ if (json) {
+ setPools(json.data);
+ }
+ });
}, []);
return (
{
{state.user.username}'s Pools
- {state.pools.map((pool) => {
+ {pools.map((pool) => {
return (
- {pool.title}
+ {pool.pool_title}
- {pool.description}
+ {pool.pool_text}