Skip to content

Commit c84842c

Browse files
aevinjaevinj
committed
pending accept -> opens disabled create event
update shared pointer
1 parent dc8fa7b commit c84842c

File tree

4 files changed

+77
-102
lines changed

4 files changed

+77
-102
lines changed

‎shared‎

‎src/components/calendar/create-event.tsx‎

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ interface CreateEventProps {
3131
initialDuration?: string
3232
initialParticipants?: User[]
3333
initialSelectedRange?: { start: Date; end: Date } | null
34+
inputsDisabled?: boolean
3435
}
3536

3637
// Mapping from dropdown option to minutes
@@ -48,6 +49,7 @@ export function CreateEvent({
4849
initialDuration = '1hr',
4950
initialParticipants = [],
5051
initialSelectedRange = null,
52+
inputsDisabled = false,
5153
}: CreateEventProps) {
5254

5355
const [myEvents, setMyEvents] = useState<CalendarEvent[]>([])
@@ -306,6 +308,7 @@ export function CreateEvent({
306308
onChange={e => {
307309
setTitle(e.target.value)
308310
}}
311+
disabled={inputsDisabled}
309312
/>
310313
</div>
311314

@@ -318,6 +321,7 @@ export function CreateEvent({
318321
onChange={e => {
319322
setLocation(e.target.value)
320323
}}
324+
disabled={inputsDisabled}
321325
/>
322326
</div>
323327

@@ -330,6 +334,7 @@ export function CreateEvent({
330334
setDuration(e.target.value)
331335
}}
332336
className='block w-full rounded-md border border-gray-300 p-2'
337+
disabled={inputsDisabled}
333338
>
334339
<option value='30 minutes'>30 minutes</option>
335340
<option value='1hr'>1hr</option>
@@ -347,9 +352,10 @@ export function CreateEvent({
347352
onChange={e => {
348353
setUserSearchQuery(e.target.value)
349354
}}
355+
disabled={inputsDisabled}
350356
/>
351357
{/* Search results dropdown */}
352-
{searchResults.length > 0 && (
358+
{searchResults.length > 0 && !inputsDisabled && (
353359
<div className='border rounded bg-white shadow absolute z-10 w-full max-h-40 overflow-y-auto m-2'>
354360
{searchResults.map(user => (
355361
<div
@@ -381,6 +387,7 @@ export function CreateEvent({
381387
</span>
382388
<button
383389
onClick={() => handleRemoveParticipant(user.id)}
390+
disabled={inputsDisabled}
384391
className='text-blue-500 hover:text-blue-700'
385392
>
386393
x
@@ -398,9 +405,12 @@ export function CreateEvent({
398405
selectedDate={selectedDate}
399406
selectedRange={selectedRange}
400407
onDateSelect={date => {
401-
setSelectedDate(date)
408+
if (!inputsDisabled) setSelectedDate(date)
402409
}}
403-
onRangeSelect={handleRangeSelect}
410+
onRangeSelect={range => {
411+
if (!inputsDisabled) handleRangeSelect(range)
412+
}}
413+
disabled={inputsDisabled}
404414
/>
405415
</div>
406416

‎src/components/calendar/event-range-picker.tsx‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,16 @@ interface EventRangePickerProps {
99
selectedDate: Date | null
1010
onDateSelect: (date: Date) => void
1111
onRangeSelect: (range: { start: Date; end: Date } | null) => void
12-
selectedRange?: { start: Date; end: Date } | null // new optional prop
12+
selectedRange?: { start: Date; end: Date } | null
13+
disabled?: boolean // new optional prop to disable input changes
1314
}
1415

1516
export function EventRangePicker({
1617
selectedDate,
1718
onDateSelect,
1819
onRangeSelect,
19-
selectedRange, // destructure the new prop
20+
selectedRange,
21+
disabled = false,
2022
}: EventRangePickerProps) {
2123
const [currentMonth, setCurrentMonth] = useState<Date>(new Date())
2224
const [dragStart, setDragStart] = useState<Date | null>(null)
@@ -112,19 +114,22 @@ export function EventRangePicker({
112114
}
113115

114116
const handleMouseDown = (date: Date) => {
117+
if (disabled) return
115118
setIsSelecting(true)
116119
setDragStart(date)
117120
setDragEnd(date)
118121
onDateSelect(date)
119122
}
120123

121124
const handleMouseEnter = (date: Date) => {
125+
if (disabled) return
122126
if (isSelecting) {
123127
setDragEnd(date)
124128
}
125129
}
126130

127131
const handleMouseUp = () => {
132+
if (disabled) return
128133
setIsSelecting(false)
129134
}
130135

@@ -147,6 +152,7 @@ export function EventRangePicker({
147152
size='icon'
148153
onClick={prevMonth}
149154
className='h-7 w-7'
155+
disabled={disabled}
150156
>
151157
<ChevronLeft className='h-4 w-4' />
152158
</Button>
@@ -158,6 +164,7 @@ export function EventRangePicker({
158164
size='icon'
159165
onClick={nextMonth}
160166
className='h-7 w-7'
167+
disabled={disabled}
161168
>
162169
<ChevronRight className='h-4 w-4' />
163170
</Button>
@@ -175,7 +182,7 @@ export function EventRangePicker({
175182

176183
<div
177184
className='grid grid-cols-7 gap-1'
178-
onMouseLeave={() => isSelecting && setIsSelecting(false)}
185+
onMouseLeave={() => !disabled && isSelecting && setIsSelecting(false)}
179186
>
180187
{days.map(({ date, isCurrentMonth }, index) => (
181188
<div

‎src/components/reschedule-requests.tsx‎

Lines changed: 53 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ interface CreateEventData {
1717
duration: string
1818
participants: User[]
1919
selectedRange: { start: Date; end: Date } | null
20+
disabled: boolean
2021
}
2122

2223
export function RescheduleRequests() {
@@ -29,6 +30,7 @@ export function RescheduleRequests() {
2930
duration: '1hr',
3031
participants: [],
3132
selectedRange: null,
33+
disabled: false,
3234
})
3335

3436
const [fullRequests, setFullRequests] = useState<{
@@ -120,7 +122,31 @@ export function RescheduleRequests() {
120122
}
121123
}
122124

123-
const handleRequestAccept = async (requestID: number) => {}
125+
const handleRequestAccept = async (oldEvent: CalendarEvent) => {
126+
const start = parseISO(oldEvent.startTime!)
127+
const end = parseISO(oldEvent.endTime!)
128+
const diffInMinutes = Math.round((end.getTime() - start.getTime()) / 60000)
129+
const candidates = [30, 60, 120];
130+
const closest = candidates.reduce((prev, curr) =>
131+
Math.abs(curr - diffInMinutes) < Math.abs(prev - diffInMinutes) ? curr : prev
132+
);
133+
const durationString =
134+
closest === 30 ? '30 minutes' : closest === 60 ? '1hr' : '2hrs';
135+
136+
const newParticipants = await convertAttendeesToUsers(oldEvent.attendees)
137+
138+
setCreateEventData({
139+
title: oldEvent.subject ?? '',
140+
duration: durationString,
141+
participants: newParticipants,
142+
selectedRange: {
143+
start: new Date(oldEvent.startTime!),
144+
end: new Date(oldEvent.endTime!),
145+
},
146+
disabled: true,
147+
})
148+
setCreateEventOpen(true)
149+
}
124150

125151
// TODO - this can be removed since we are using full requests instead
126152
useEffect(() => {
@@ -224,48 +250,29 @@ export function RescheduleRequests() {
224250
</div>
225251

226252
<div className='flex items-center gap-2'>
227-
{request.status === 'pending' && (
228-
<>
229-
{request.newMeeting!.startTime ===
230-
'0001-01-01T00:00:00Z' ? (
231-
<Button
232-
variant='outline'
233-
size='sm'
234-
className='w-full text-green-500 hover:text-green-600 hover:bg-green-50'
235-
// onClick={() =>
236-
// handleRequestAccept(request.request_id)
237-
// }
238-
>
239-
<Check className='h-4 w-4 mr-1' />
240-
Reschedule Now
241-
</Button>
242-
) : (
243-
<Button
244-
variant='outline'
245-
size='sm'
246-
className='w-full text-green-500 hover:text-green-600 hover:bg-green-50'
247-
// onClick={() => handleAction(request.id, 'accept')}
248-
>
249-
<Check className='h-4 w-4 mr-1' />
250-
View Proposal
251-
</Button>
252-
)}
253-
</>
254-
)}
253+
<Button
254+
variant='outline'
255+
size='sm'
256+
className='w-full text-green-500 hover:text-green-600 hover:bg-green-50'
257+
onClick={() =>
258+
handleRequestAccept(fullRequests[request.request_id]!.oldEvent)
259+
}
260+
>
261+
<Check className='h-4 w-4 mr-1' />
262+
Reschedule Now
263+
</Button>
255264

256-
{request.status === 'pending' && (
257-
<Button
258-
variant='outline'
259-
size='sm'
260-
className='w-full text-red-500 hover:text-red-600 hover:bg-red-50'
261-
onClick={() =>
262-
handleRequestReject(request.request_id)
263-
}
264-
>
265-
<X className='h-4 w-4 mr-1' />
266-
Ignore
267-
</Button>
268-
)}
265+
<Button
266+
variant='outline'
267+
size='sm'
268+
className='w-full text-red-500 hover:text-red-600 hover:bg-red-50'
269+
onClick={() =>
270+
handleRequestReject(request.request_id)
271+
}
272+
>
273+
<X className='h-4 w-4 mr-1' />
274+
Ignore
275+
</Button>
269276
</div>
270277
</div>
271278
</div>
@@ -309,6 +316,7 @@ export function RescheduleRequests() {
309316
currentFullRequest.newEvent.endTime,
310317
),
311318
},
319+
disabled: false,
312320
})
313321
} else {
314322
const newParticipants = await convertAttendeesToUsers(
@@ -319,6 +327,7 @@ export function RescheduleRequests() {
319327
duration: '1hr',
320328
participants: newParticipants,
321329
selectedRange: null,
330+
disabled: false,
322331
})
323332
}
324333
setCreateEventOpen(true)
@@ -375,14 +384,7 @@ export function RescheduleRequests() {
375384
: ''}
376385
</div>
377386
</div>
378-
{/* <div className='flex items-start gap-2'>
379-
<div className='w-20 font-medium shrink-0'>
380-
Requested:
381-
</div>
382-
<div className='text-muted-foreground'>
383-
{request.requestedDateTime}
384-
</div>
385-
</div> */}
387+
386388
<div className='flex items-start gap-2'>
387389
<div className='w-25 font-medium shrink-0'>
388390
Attendees:
@@ -398,51 +400,6 @@ export function RescheduleRequests() {
398400
</div>
399401
</div>
400402
</div>
401-
402-
<div className='flex items-center gap-2'>
403-
{request.status === 'pending' && (
404-
<>
405-
{request.newMeeting!.startTime ===
406-
'0001-01-01T00:00:00Z' ? (
407-
<Button
408-
variant='outline'
409-
size='sm'
410-
className='w-full text-green-500 hover:text-green-600 hover:bg-green-50'
411-
// onClick={() =>
412-
// handleRequestAccept(request.request_id)
413-
// }
414-
>
415-
<Check className='h-4 w-4 mr-1' />
416-
Reschedule Now
417-
</Button>
418-
) : (
419-
<Button
420-
variant='outline'
421-
size='sm'
422-
className='w-full text-green-500 hover:text-green-600 hover:bg-green-50'
423-
// onClick={() => handleAction(request.id, 'accept')}
424-
>
425-
<Check className='h-4 w-4 mr-1' />
426-
View Proposal
427-
</Button>
428-
)}
429-
</>
430-
)}
431-
432-
{request.status === 'pending' && (
433-
<Button
434-
variant='outline'
435-
size='sm'
436-
className='w-full text-red-500 hover:text-red-600 hover:bg-red-50'
437-
onClick={() =>
438-
handleRequestReject(request.request_id)
439-
}
440-
>
441-
<X className='h-4 w-4 mr-1' />
442-
Ignore
443-
</Button>
444-
)}
445-
</div>
446403
</div>
447404
</div>
448405
))}
@@ -460,6 +417,7 @@ export function RescheduleRequests() {
460417
initialDuration={createEventData.duration}
461418
initialParticipants={createEventData.participants}
462419
initialSelectedRange={createEventData.selectedRange}
420+
inputsDisabled={createEventData.disabled}
463421
/>
464422
</>
465423
)

0 commit comments

Comments
 (0)