diff --git a/src/components/Attendees/PeopleSearch.tsx b/src/components/Attendees/PeopleSearch.tsx index 148fe5b..a301d54 100644 --- a/src/components/Attendees/PeopleSearch.tsx +++ b/src/components/Attendees/PeopleSearch.tsx @@ -205,7 +205,6 @@ export function PeopleSearch({ slotProps: { input: { ...inputProps, - autoComplete: "off", }, }, }; diff --git a/src/components/Event/components/DateTimeFields.tsx b/src/components/Event/components/DateTimeFields.tsx index 74e8e79..3653fbf 100644 --- a/src/components/Event/components/DateTimeFields.tsx +++ b/src/components/Event/components/DateTimeFields.tsx @@ -23,6 +23,18 @@ import { EditableTimeField } from "./EditableTimeField"; dayjs.extend(customParseFormat); +const timePickerPopperSx = { + "& .MuiPaper-root": { + width: "110px", + minWidth: "110px", + }, + "& .MuiMultiSectionDigitalClockSection-item": { + justifyContent: "flex-start", + width: "100%", + textAlign: "left", + }, +}; + /** * Props for DateTimeFields component */ @@ -353,19 +365,7 @@ export const DateTimeFields: React.FC = ({ }} slotProps={{ openPickerButton: { sx: { display: "none" } }, - popper: { - sx: { - "& .MuiPaper-root": { - width: "110px", - minWidth: "110px", - }, - "& .MuiMultiSectionDigitalClockSection-item": { - justifyContent: "flex-start", - width: "100%", - textAlign: "left", - }, - }, - }, + popper: { sx: timePickerPopperSx }, field: getTimeFieldSlotProps( "start-time-input", false, @@ -411,19 +411,7 @@ export const DateTimeFields: React.FC = ({ }} slotProps={{ openPickerButton: { sx: { display: "none" } }, - popper: { - sx: { - "& .MuiPaper-root": { - width: "110px", - minWidth: "110px", - }, - "& .MuiMultiSectionDigitalClockSection-item": { - justifyContent: "flex-start", - width: "100%", - textAlign: "left", - }, - }, - }, + popper: { sx: timePickerPopperSx }, field: getTimeFieldSlotProps( "end-time-input", !!validation.errors.dateTime, @@ -510,19 +498,7 @@ export const DateTimeFields: React.FC = ({ }} slotProps={{ openPickerButton: { sx: { display: "none" } }, - popper: { - sx: { - "& .MuiPaper-root": { - width: "110px", - minWidth: "110px", - }, - "& .MuiMultiSectionDigitalClockSection-item": { - justifyContent: "flex-start", - width: "100%", - textAlign: "left", - }, - }, - }, + popper: { sx: timePickerPopperSx }, field: getTimeFieldSlotProps( "start-time-input", false, @@ -556,19 +532,7 @@ export const DateTimeFields: React.FC = ({ }} slotProps={{ openPickerButton: { sx: { display: "none" } }, - popper: { - sx: { - "& .MuiPaper-root": { - width: "110px", - minWidth: "110px", - }, - "& .MuiMultiSectionDigitalClockSection-item": { - justifyContent: "flex-start", - width: "100%", - textAlign: "left", - }, - }, - }, + popper: { sx: timePickerPopperSx }, field: getTimeFieldSlotProps( "end-time-input", !!validation.errors.dateTime, diff --git a/src/components/Event/components/EditableTimeField.tsx b/src/components/Event/components/EditableTimeField.tsx index f2f1a88..ecd3869 100644 --- a/src/components/Event/components/EditableTimeField.tsx +++ b/src/components/Event/components/EditableTimeField.tsx @@ -46,11 +46,6 @@ function EditableTimePickerField(props: GenericPickerFieldProps) { const parsedFormat = useParsedFormat(); const inputRef = useRef(null); - // Get onChange from internalProps to call directly when value changes - const onChange = internalProps.onChange as - | ((value: Dayjs | null) => void) - | undefined; - const getFormattedValue = useCallback(() => { if (pickerContext.value == null) return ""; if (!pickerContext.value.isValid()) return ""; @@ -151,7 +146,7 @@ function EditableTimePickerField(props: GenericPickerFieldProps) { setInputValue(getFormattedValue()); } }, - [pickerContext, getFormattedValue, onChange] + [pickerContext, pickerActions, getFormattedValue] ); // Commit pending input value when picker closes (after parseAndUpdateTime is defined) diff --git a/src/components/Event/utils/dateTimeHelpers.ts b/src/components/Event/utils/dateTimeHelpers.ts index 6d9a878..9b71d13 100644 --- a/src/components/Event/utils/dateTimeHelpers.ts +++ b/src/components/Event/utils/dateTimeHelpers.ts @@ -14,6 +14,9 @@ export const DATETIME_FORMAT_WITHOUT_SECONDS = "YYYY-MM-DDTHH:mm"; export const TIME_PARSE_FORMATS = ["HH:mm", "H:mm", "HHmm", "Hmm", "HH", "H"]; +// Strict parsing mode - input must exactly match the provided format(s) +const STRICT_PARSING = true; + /** * Detect datetime format based on string length * @param datetime - Datetime string to analyze @@ -77,7 +80,7 @@ export function convertFormDateTimeToISO( /** Convert date + time strings → Dayjs */ export const toDateTime = (date: string, time: string): Dayjs => { - const d = dayjs(date, "YYYY-MM-DD", true); + const d = dayjs(date, "YYYY-MM-DD", STRICT_PARSING); if (!time) return d.startOf("day"); const [h, m] = time.split(":").map(Number); return d.hour(h).minute(m).second(0).millisecond(0); @@ -108,7 +111,7 @@ export function parseTimeInput( trimmed = trimmed.padStart(4, "0"); } - const parsed = dayjs(trimmed, TIME_PARSE_FORMATS, true); + const parsed = dayjs(trimmed, TIME_PARSE_FORMATS, STRICT_PARSING); if (parsed.isValid()) { const baseDate = currentDate || dayjs(); return baseDate