diff --git a/app.config.ts b/app.config.ts index b745c878..aaeaff03 100644 --- a/app.config.ts +++ b/app.config.ts @@ -8,6 +8,7 @@ export const eventDaysLimit: number = 7; export const toastAutoHideDuration: number = 5000; // 5 seconds export const tenantId: string = 'ef99949b-7f3a-4a5f-806a-e67e683e38f3'; export const idealTimeForSession: string = '120'; +export const timeZone: string = 'Asia/Kolkata'; export const dropoutReasons = [ { label: 'UNABLE_TO_COPE_WITH_STUDIES', diff --git a/src/components/PlannedSession.tsx b/src/components/PlannedSession.tsx index ffeb98e3..42136668 100644 --- a/src/components/PlannedSession.tsx +++ b/src/components/PlannedSession.tsx @@ -45,19 +45,23 @@ import { DaysOfWeek, eventDaysLimit, idealTimeForSession, + timeZone, } from '../../app.config'; import SessionMode from './SessionMode'; import { showToastMessage } from './Toastify'; import WeekDays from './WeekDays'; import ConfirmationModal from './ConfirmationModal'; +import timezone from 'dayjs/plugin/timezone'; +dayjs.extend(utc); +dayjs.extend(timezone); type mode = (typeof sessionMode)[keyof typeof sessionMode]; -type type = (typeof sessionType)[keyof typeof sessionType]; +// type type = (typeof sessionType)[keyof typeof sessionType]; interface Session { id?: number | string; sessionMode?: string; - sessionType?: string; + // sessionType?: string; selectedWeekDays?: string[]; DaysOfWeek?: number[]; startDatetime?: string; @@ -84,17 +88,21 @@ const PlannedSession: React.FC = ({ onCloseModal, editSession, onEventDeleted, + eventData, }) => { const [mode, setMode] = useState(sessionMode.OFFLINE); - const [eventType, setEventType] = useState(sessionType.JUST); + // const [eventType, setEventType] = useState(sessionType.JUST); const [link, setLink] = useState(''); const [linkError, setLinkError] = useState(''); const [selectedWeekDays, setSelectedWeekDays] = useState(); + const [editEventData, setEditEventData] = useState(eventData); const [modalOpen, setModalOpen] = React.useState(false); const [selectedSubject, setSelectedSubject] = useState(); const [selectedBlockId, setSelectedBlockId] = useState(0); const [editSelection, setEditSelection] = React.useState('EDIT_SESSION'); const [subjects, setSubjects] = useState(); + const [shortDescription, setShortDescription] = useState(); + const [meetingPasscode, setMeetingPasscode] = useState(); dayjs.extend(utc); const [startDate, setStartDate] = useState(dayjs()); const [endDate, setEndDate] = useState(dayjs()); @@ -106,7 +114,7 @@ const PlannedSession: React.FC = ({ selectedWeekDays: [], DaysOfWeek: [], sessionMode: mode, - sessionType: eventType, + // sessionType: eventType, startDatetime: '', endDatetime: '', endDateValue: '', @@ -122,6 +130,40 @@ const PlannedSession: React.FC = ({ sessionEndTime: endTime, }, ]); + + useEffect(() => { + console.log(eventData); + console.log(eventData?.metadata?.framework?.subject); + + if (eventData) { + const mode = + eventData?.meetingDetails?.url !== undefined + ? sessionMode.ONLINE + : sessionMode.OFFLINE; + setMode(mode); + let sub = eventData?.metadata?.framework?.subject; + setSelectedSubject(sub); + let sessionTitle = eventData?.shortDescription; + setShortDescription(sessionTitle); + const url = eventData?.meetingDetails?.url; + setLink(url); + const passcode = eventData?.meetingDetails?.password; + setMeetingPasscode(passcode); + + const startDateTime = eventData?.startDateTime; + const endDateTime = eventData?.endDateTime; + + const localStartDateTime = dayjs.utc(startDateTime).tz(timeZone); + const localEndDateTime = dayjs.utc(endDateTime).tz(timeZone); + // const localEndDateValue = dayjs.utc(endDateValue).tz('Asia/Kolkata'); + + setStartDate(localStartDateTime.startOf('day')); + setStartTime(localStartDateTime); + setEndDate(localEndDateTime.startOf('day')); + setEndTime(localEndDateTime); + } + }, [eventData]); + const handleOpenModel = () => { setModalOpen(true); }; @@ -173,16 +215,16 @@ const PlannedSession: React.FC = ({ setSessionBlocks(updatedSessionBlocks); }; - const handleSessionTypeChange = ( - event: ChangeEvent, - id: string | number | undefined - ) => { - setEventType(event.target.value as type); - const updatedSessionBlocks = sessionBlocks.map((block) => - block.id === id ? { ...block, sessionType: event.target.value } : block - ); - setSessionBlocks(updatedSessionBlocks); - }; + // const handleSessionTypeChange = ( + // event: ChangeEvent, + // id: string | number | undefined + // ) => { + // setEventType(event.target.value as type); + // const updatedSessionBlocks = sessionBlocks.map((block) => + // block.id === id ? { ...block, sessionType: event.target.value } : block + // ); + // setSessionBlocks(updatedSessionBlocks); + // }; useEffect(() => { const getAddFacilitatorFormData = async () => { @@ -312,7 +354,7 @@ const PlannedSession: React.FC = ({ const startDatetime = convertToUTC(combinedStartDateTime); const endDatetime = convertToUTC(combinedEndDateTime); const endDateValue = - eventType && eventType === t('CENTER_SESSION.JUST_ONCE') + clickedBox === 'EXTRA_SESSION' ? endDatetime : convertToUTC(combinedEndDateValue); @@ -346,7 +388,7 @@ const PlannedSession: React.FC = ({ const startDatetime = convertToUTC(combinedStartDateTime); const endDatetime = convertToUTC(combinedEndDateTime); const endDateValue = - eventType && eventType === t('CENTER_SESSION.JUST_ONCE') + clickedBox === 'EXTRA_SESSION' ? endDatetime : convertToUTC(combinedEndDateValue); @@ -418,7 +460,7 @@ const PlannedSession: React.FC = ({ id: string | number | undefined ) => { const value = event?.target?.value; - + setMeetingPasscode(value); setSessionBlocks( sessionBlocks.map((block) => block.id === id @@ -460,6 +502,7 @@ const PlannedSession: React.FC = ({ id: string | number | undefined ) => { const value = event?.target?.value; + setShortDescription(value); setSessionBlocks( sessionBlocks.map((block) => block.id === id @@ -482,7 +525,7 @@ const PlannedSession: React.FC = ({ selectedWeekDays: [], DaysOfWeek: [], sessionMode: '', - sessionType: '', + // sessionType: '', startDatetime: '', endDatetime: '', subject: '', @@ -564,7 +607,7 @@ const PlannedSession: React.FC = ({ const apiBodies: CreateEvent[] = sessionBlocks.map((block) => { const baseBody: CreateEvent = { title, - shortDescription: '', + shortDescription: block?.subjectTitle || shortDescription, description: '', eventType: block?.sessionMode || mode, isRestricted: true, @@ -708,7 +751,7 @@ const PlannedSession: React.FC = ({ row aria-labelledby="session-mode-label" name="session-mode-group" - value={mode} + value={mode || editSelection} onChange={handleEditSession} > = ({ handleSessionModeChange(e, block?.id) } @@ -785,7 +828,7 @@ const PlannedSession: React.FC = ({ }} /> - {clickedBox === 'PLANNED_SESSION' && ( + {(clickedBox === 'PLANNED_SESSION' || editSession) && ( <> @@ -803,7 +846,11 @@ const PlannedSession: React.FC = ({ onChange={(event: any) => handleSubjectChange(block?.id, event) } - value={selectedSubject} + value={ + selectedSubject + ? selectedSubject + : t('CENTER_SESSION.SUBJECT') + } > {subjects?.map((subject: string) => ( @@ -822,7 +869,7 @@ const PlannedSession: React.FC = ({ id="outlined-basic" label={t('CENTER_SESSION.SESSION_TITLE_OPTIONAL')} variant="outlined" - value={block?.subjectTitle} + value={block?.subjectTitle || shortDescription} onChange={(e) => { handleSubjectTitleChange(e, block?.id); }} @@ -831,7 +878,8 @@ const PlannedSession: React.FC = ({ )} - {block?.sessionMode === sessionMode.ONLINE && ( + {(block?.sessionMode === sessionMode.ONLINE || + mode === sessionMode.ONLINE) && ( <> {/* = ({ label={t('CENTER_SESSION.MEETING_PASSCODE')} variant="outlined" onChange={(e: any) => handlePasscodeChange(block?.id, e)} + value={ + meetingPasscode + ? meetingPasscode + : t('CENTER_SESSION.MEETING_PASSCODE') + } /> @@ -926,22 +979,10 @@ const PlannedSession: React.FC = ({ )} - {clickedBox === 'EXTRA_SESSION' && ( + {(clickedBox === 'EXTRA_SESSION' || + (editSession && editSelection === 'EDIT_SESSION')) && ( <> - {/* - handleSessionTypeChange(e, block?.id) - } - sessions={{ - tile: t('CENTER_SESSION.TYPE_OF_SESSION'), - mode1: t('CENTER_SESSION.REPEATING'), - mode2: t('CENTER_SESSION.JUST_ONCE'), - }} - /> */} - {/* {block?.sessionType === sessionType.JUST && ( - )} */} @@ -991,7 +1032,9 @@ const PlannedSession: React.FC = ({ )} - {clickedBox !== 'EXTRA_SESSION' && ( + + {(clickedBox === 'PLANNED_SESSION' || + (editSession && editSelection === 'FOLLOWING_SESSION')) && ( diff --git a/src/components/SessionCard.tsx b/src/components/SessionCard.tsx index 9918609c..0468298f 100644 --- a/src/components/SessionCard.tsx +++ b/src/components/SessionCard.tsx @@ -178,6 +178,7 @@ const SessionsCard: React.FC = ({ handleEditSelection={handleEditSelection} onEventDeleted={onEventDeleted} eventDeleted={eventDeleted} + eventData={data} /> diff --git a/src/utils/Interfaces.ts b/src/utils/Interfaces.ts index 222aba39..df2ce199 100644 --- a/src/utils/Interfaces.ts +++ b/src/utils/Interfaces.ts @@ -156,6 +156,7 @@ export interface PlannedModalProps { handleEditSelection?: (selection: string) => void; onEventDeleted?: () => void; editSession?: any; + eventData?: any; } export interface ScheduleModalProps {