diff --git a/src/components/Carpool/Carpool.tsx b/src/components/Carpool/Carpool.tsx index 6edd744..46208ef 100644 --- a/src/components/Carpool/Carpool.tsx +++ b/src/components/Carpool/Carpool.tsx @@ -1,51 +1,87 @@ -import { useEffect, useState } from 'react'; +import EventIcon from '@material-ui/icons/Event'; +import LocationOnIcon from '@material-ui/icons/LocationOn'; + +import { useState } from 'react'; import { useParams } from 'react-router-dom'; -import { getCarpool } from '../api'; import { ICarpool } from '../types'; -import { IUser } from '../types'; import UISecondaryBox from '../UI/UISecondaryBox'; import MemberList from './MemberList'; -const dummyMemberData: IUser[] = [ - { - id: 0, - email: 'joshua12696@gmail.com', - name: 'Joshua Hsueh', - }, - { - id: 1, - email: 'myfatemi04@gmail.com', - name: 'Michael Fatemi', - }, - { - id: 2, - email: 'thegoat@gmail.com', - name: 'Tom Brady', - }, - { - id: 3, - email: 'bobbyshmurda@gmail.com', - name: 'Bob the Builder', - }, -]; - export default function Carpool() { const id = +useParams<{ id: string }>().id; - const [carpool, setCarpool] = useState(null); + const [carpool, setCarpool] = useState({ + id, + name: 'carpoollo2398', + eventId: 0, + event: { + id: 0, + name: 'test event', + latitude: 0, + longitude: 0, + formattedAddress: 'your house', + placeId: 'secret', + }, + members: [ + { + id: 0, + name: 'Joshua Hsueh', + }, + { + id: 1, + name: 'Michael Fatemi', + }, + { + id: 2, + name: 'Tom Brady', + }, + { + id: 3, + name: 'Bob the Builder', + }, + ], + invitations: [], + }); - useEffect(() => { - getCarpool(id).then(setCarpool); - }, [id]); + // useEffect(() => { + // getCarpool(id).then(setCarpool); + // }, [id]); + + const { event, name } = carpool!; return ( - - {/* {carpool && ( + {carpool ? ( <> -

{carpool.name}

- {carpool.description} +

{name}

+

{event.name}

+
+
+ + {event.formattedAddress} +
+
+ + DAWN - DUSK +
+
+

Members

+ - )} */} + ) : ( +

Loading

+ )}
); } diff --git a/src/components/Carpool/MemberList.tsx b/src/components/Carpool/MemberList.tsx index 764db4c..f57c51a 100644 --- a/src/components/Carpool/MemberList.tsx +++ b/src/components/Carpool/MemberList.tsx @@ -1,7 +1,13 @@ -import { IUser } from '../types'; import AccountCircleIcon from '@material-ui/icons/AccountCircle'; -export default function MemberList({ members }: { members: IUser[] }) { +export default function MemberList({ + members, +}: { + members: { + id: number; + name: string; + }[]; +}) { return (
diff --git a/src/components/types.ts b/src/components/types.ts index 208ebc2..79cca55 100644 --- a/src/components/types.ts +++ b/src/components/types.ts @@ -15,9 +15,20 @@ export type IUser = { export type ICarpool = { id: number; name: string; - description: string; eventId: number | null; - event?: IEvent; + event: { + id: number; + name: string; + formattedAddress: string; + latitude: number; + longitude: number; + placeId: string; + }; + // driverId: number | null; + // driver: { + // id: number; + // name: string; + // }; members: { id: number; name: string;