diff --git a/src/components/Carpool/Carpool.tsx b/src/components/Carpool/Carpool.tsx index 6614731..80f6648 100644 --- a/src/components/Carpool/Carpool.tsx +++ b/src/components/Carpool/Carpool.tsx @@ -205,9 +205,6 @@ export default function Carpool({ id }: { id: number }) { {isCreator ? 'You are the creator of this carpool.' : `${creatorName} is the creator of this carpool`} - - {carpool.event.name} - diff --git a/src/components/Carpool/CarpoolDetails.tsx b/src/components/Carpool/CarpoolDetails.tsx index 34cbc7d..75f85ac 100644 --- a/src/components/Carpool/CarpoolDetails.tsx +++ b/src/components/Carpool/CarpoolDetails.tsx @@ -1,9 +1,9 @@ import EventIcon from '@material-ui/icons/Event'; import LocationOnIcon from '@material-ui/icons/LocationOn'; -import { useCallback } from 'react'; -import { useContext } from 'react'; +import { useCallback, useContext, useMemo } from 'react'; +import formatStartAndEndTime from '../../lib/dates'; import { setCarpoolNote } from '../api'; - +import UILink from '../UI/UILink'; import { CarpoolContext } from './Carpool'; import CarpoolNote from './CarpoolNote'; @@ -17,14 +17,36 @@ export default function CarpoolDetails() { }, [carpool] ); + const startTime = carpool.event.startTime; + const endTime = useMemo( + () => + startTime + ? new Date(new Date(startTime).getTime() + carpool.event.duration * 60) + : null, + [carpool.event.duration, startTime] + ); + const formattedDate = useMemo(() => { + if (startTime) { + if (endTime) { + return formatStartAndEndTime(startTime, endTime.toISOString()); + } else { + return new Date(startTime).toLocaleString(); + } + } else { + return null; + } + }, [startTime, endTime]); return (
+

Event Details

+ {carpool.event.name}
@@ -38,7 +60,7 @@ export default function CarpoolDetails() { }} > - DAWN - DUSK + {formattedDate && `${formattedDate}`}
diff --git a/src/components/Carpool/CarpoolNote.tsx b/src/components/Carpool/CarpoolNote.tsx index fd89fb2..57101db 100644 --- a/src/components/Carpool/CarpoolNote.tsx +++ b/src/components/Carpool/CarpoolNote.tsx @@ -32,9 +32,7 @@ export default function CarpoolNote({ return (
- Note -
-
+

Description

{editing ? (