From cd94a05dcce820a7f558ca478816126bd4df0297 Mon Sep 17 00:00:00 2001
From: Michael Fatemi <myfatemi04@gmail.com>
Date: Sun, 11 Jul 2021 17:13:50 -0400
Subject: [PATCH] add "available to drive?" frontend button

---
 src/components/Event/Event.tsx         |  1 +
 src/components/Event/EventCarpools.tsx | 13 ++++++++++---
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/Event/Event.tsx b/src/components/Event/Event.tsx
index 79afe58..1bcfae2 100644
--- a/src/components/Event/Event.tsx
+++ b/src/components/Event/Event.tsx
@@ -132,6 +132,7 @@ export default function Event({ event }: { event: IEvent }) {
 						style={placeId != null ? { border: '2px solid ' + green } : {}}
 						placeId={placeId}
 					/>
+					<br />
 					{false && (
 						<div
 							style={{
diff --git a/src/components/Event/EventCarpools.tsx b/src/components/Event/EventCarpools.tsx
index 8b9d78c..6259481 100644
--- a/src/components/Event/EventCarpools.tsx
+++ b/src/components/Event/EventCarpools.tsx
@@ -1,8 +1,10 @@
-import { useState } from 'react';
-import { IEvent } from './Event';
 import CallMergeIcon from '@material-ui/icons/CallMerge';
-import ScheduleIcon from '@material-ui/icons/Schedule';
 import EmojiPeopleIcon from '@material-ui/icons/EmojiPeople';
+import ScheduleIcon from '@material-ui/icons/Schedule';
+import { useState } from 'react';
+import { lightgrey } from '../colors';
+import UIButton from '../UI/UIButton';
+import { IEvent } from './Event';
 
 export type ICarpool = {
 	driver: {
@@ -77,6 +79,11 @@ export default function Carpools({ event }: { event: IEvent }) {
 	return (
 		<div style={{ display: 'flex', flexDirection: 'column' }}>
 			<h3 style={{ marginBlockEnd: '0' }}>Carpools</h3>
+			<br />
+			<>Available to drive?</>
+			<UIButton onClick={() => {}} style={{ backgroundColor: lightgrey }}>
+				I'm not available
+			</UIButton>
 			{carpools.map((carpool) => (
 				<CarpoolRow carpool={carpool} key={carpool.driver.id} />
 			))}