From f17feac49747fb6e4a17ffa303f215f509366efb Mon Sep 17 00:00:00 2001
From: Michael Fatemi <myfatemi04@gmail.com>
Date: Thu, 1 Jul 2021 00:33:18 -0400
Subject: [PATCH] disable day of week selector when event is being created

---
 src/components/NewUI/EventCreator.tsx | 30 ++++++++++++++++++++-------
 1 file changed, 23 insertions(+), 7 deletions(-)

diff --git a/src/components/NewUI/EventCreator.tsx b/src/components/NewUI/EventCreator.tsx
index bf7ef17..500ecbf 100644
--- a/src/components/NewUI/EventCreator.tsx
+++ b/src/components/NewUI/EventCreator.tsx
@@ -57,10 +57,18 @@ function DaysOfWeekSelector({
 							cursor: 'pointer',
 							backgroundColor: active
 								? disabled
-									? green + '77'
+									? // lighter version of green
+									  'rgba(96, 247, 96, 0.5)'
 									: green
+								: disabled
+								? // lighter version of lightgrey
+								  'rgba(224, 224, 224, 0.5)'
 								: lightgrey,
-							color: active ? 'white' : 'black',
+							color: active
+								? 'white'
+								: disabled
+								? 'rgba(0, 0, 0, 0.5)'
+								: 'black',
 							userSelect: 'none',
 							width: '2em',
 							height: '2em',
@@ -70,10 +78,14 @@ function DaysOfWeekSelector({
 							alignItems: 'center',
 							justifyContent: 'center',
 						}}
-						onClick={() =>
-							// @ts-ignore
-							toggleDayOfWeek(idx + 1)
-						}
+						onClick={() => {
+							if (!disabled) {
+								toggleDayOfWeek(
+									// @ts-ignore
+									idx + 1
+								);
+							}
+						}}
 						key={name}
 					>
 						{name.charAt(0)}
@@ -179,7 +191,11 @@ export default function EventCreator({ group }: { group: IGroup }) {
 			{recurring && (
 				<>
 					Days of week
-					<DaysOfWeekSelector daysOfWeek={daysOfWeek} update={setDaysOfWeek} />
+					<DaysOfWeekSelector
+						daysOfWeek={daysOfWeek}
+						update={setDaysOfWeek}
+						disabled={creating}
+					/>
 					Date of last occurence
 					<UIDateInput onChangedDate={setEndDate} />
 				</>