- Checkpoint

Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
2024-08-21 17:55:40 -04:00
parent cc9979ff4b
commit 98f4423624
2 changed files with 111 additions and 115 deletions

View File

@@ -2,10 +2,12 @@ import { DatePicker } from "antd";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import React, { useCallback, useState } from "react"; import React, { useCallback, useState } from "react";
import dayjs from "../../utils/day"; import dayjs from "../../utils/day";
import { formats } from "./formats.js"; import { dateFormats, dateTimeFormats } from "./formats.js";
import { useTranslation } from "react-i18next";
const DateTimePicker = ({ value, onChange, onBlur, id, onlyFuture, onlyToday, isDateOnly = false, ...restProps }) => { const DateTimePicker = ({ value, onChange, onBlur, id, onlyFuture, onlyToday, isDateOnly = false, ...restProps }) => {
const [isManualInput, setIsManualInput] = useState(false); const [isManualInput, setIsManualInput] = useState(false);
const { t } = useTranslation();
const handleChange = useCallback( const handleChange = useCallback(
(newDate) => { (newDate) => {
@@ -19,6 +21,24 @@ const DateTimePicker = ({ value, onChange, onBlur, id, onlyFuture, onlyToday, is
[onChange] [onChange]
); );
const normalizeDateTimeString = (input) => {
const upperV = input.toUpperCase().replaceAll(".", "/").replaceAll("-", "/");
const [datePart, ...timeParts] = upperV.split(" ");
if (timeParts.length === 0) {
return datePart; // If there's no time part, just return the date part.
}
const timePart = timeParts.join(" "); // In case there are multiple spaces, join them back
// Normalize the time part by ensuring there's a space before AM/PM if not already present
const normalizedTime = timePart.replace(/(\d{1,2})(:\d{2})?\s?(AM|PM)/, "$1$2 $3");
// Combine the date part with the normalized time part
return `${datePart} ${normalizedTime}`.trim();
};
const handleBlur = useCallback( const handleBlur = useCallback(
(e) => { (e) => {
if (!isManualInput) { if (!isManualInput) {
@@ -30,17 +50,18 @@ const DateTimePicker = ({ value, onChange, onBlur, id, onlyFuture, onlyToday, is
const v = e.target.value; const v = e.target.value;
if (!v) return; if (!v) return;
const upperV = v.toUpperCase(); const upperV = normalizeDateTimeString(v);
console.log(upperV);
let _a; let _a;
for (const format of formats) { let formatTemp;
console.log("format",format); for (const format of isDateOnly ? dateFormats : dateTimeFormats) {
_a = dayjs(upperV, format); _a = dayjs(upperV, format);
console.log("🚀 ~ DateTimePicker ~ _a:", _a) formatTemp = format;
console.log("isvalid",_a.isValid());
if (_a.isValid()) break; if (_a.isValid()) break;
} }
console.log("HIT FORMAT");
console.log(formatTemp);
if (_a && _a.isValid()) { if (_a && _a.isValid()) {
if (isDateOnly) { if (isDateOnly) {
@@ -111,6 +132,8 @@ const DateTimePicker = ({ value, onChange, onBlur, id, onlyFuture, onlyToday, is
format={isDateOnly ? "MM/DD/YYYY" : "MM/DD/YYYY hh:mm a"} format={isDateOnly ? "MM/DD/YYYY" : "MM/DD/YYYY hh:mm a"}
value={value ? dayjs(value) : null} value={value ? dayjs(value) : null}
onChange={handleChange} onChange={handleChange}
// TODO - Add placeholder translation
placeholder={isDateOnly ? t("date") : t("dateAndTime")}
onBlur={onBlur || handleBlur} onBlur={onBlur || handleBlur}
disabledDate={handleDisabledDate} disabledDate={handleDisabledDate}
{...restProps} {...restProps}

View File

@@ -1,123 +1,96 @@
export const dateTimeFormats = [ export const dateTimeFormats = [
"MMDDYY h:mma", // Four-digit year with time
"MMDDYYYY h:mma", "M/D/YYYY h:mm A", // Example: 1/5/2023 9:00 AM
"M/D/YY h:mma", "M/D/YYYY h:mmA", // Example: 1/5/2023 9:00AM
"M/DD/YY h:mma", "M/D/YYYY h A", // Example: 1/5/2023 9 AM
"MM/D/YY h:mma", "M/D/YYYY hA", // Example: 1/5/2023 9AM
"MM/DD/YY h:mma", "M/D/YYYY hh:mm A", // Example: 1/5/2023 02:25 PM
"M/D/YYYY h:mma", "M/D/YYYY hh:mm:ss A", // Example: 1/5/2023 02:25:45 PM
"M/DD/YYYY h:mma",
"MM/D/YYYY h:mma",
"MM/DD/YYYY h:mma",
"MMDDYY h:mmA", "MM/D/YYYY h:mm A", // Example: 12/5/2023 9:00 AM
"MMDDYYYY h:mmA", "MM/D/YYYY h:mmA", // Example: 12/5/2023 9:00AM
"M/D/YY h:mmA", "MM/D/YYYY h A", // Example: 12/5/2023 9 AM
"M/DD/YY h:mmA", "MM/D/YYYY hA", // Example: 12/5/2023 9AM
"MM/D/YY h:mmA", "MM/D/YYYY hh:mm A", // Example: 12/5/2023 02:25 PM
"MM/DD/YY h:mmA", "MM/D/YYYY hh:mm:ss A", // Example: 12/5/2023 02:25:45 PM
"M/D/YYYY h:mmA",
"M/DD/YYYY h:mmA",
"MM/D/YYYY h:mmA",
"MM/DD/YYYY h:mmA",
"MMDDYY h:mm a", "M/DD/YYYY h:mm A", // Example: 1/25/2023 9:00 AM
"MMDDYYYY h:mm a", "M/DD/YYYY h:mmA", // Example: 1/25/2023 9:00AM
"M/D/YY h:mm a", "M/DD/YYYY h A", // Example: 1/25/2023 9 AM
"M/DD/YY h:mm a", "M/DD/YYYY hA", // Example: 1/25/2023 9AM
"MM/D/YY h:mm a", "M/DD/YYYY hh:mm A", // Example: 1/25/2023 02:25 PM
"MM/DD/YY h:mm a", "M/DD/YYYY hh:mm:ss A", // Example: 1/25/2023 02:25:45 PM
"M/D/YYYY h:mm a",
"M/DD/YYYY h:mm a",
"MM/D/YYYY h:mm a",
"MM/DD/YYYY h:mm a",
"MMDDYY h:mm A", "MM/DD/YYYY h:mm A", // Example: 12/25/2023 9:00 AM
"MMDDYYYY h:mm A", "MM/DD/YYYY h:mmA", // Example: 12/25/2023 9:00AM
"M/D/YY h:mm A", "MM/DD/YYYY h A", // Example: 12/25/2023 9 AM
"M/DD/YY h:mm A", "MM/DD/YYYY hA", // Example: 12/25/2023 9AM
"MM/D/YY h:mm A", "MM/DD/YYYY hh:mm A", // Example: 12/25/2023 02:25 PM
"MM/DD/YY h:mm A", "MM/DD/YYYY hh:mm:ss A", // Example: 12/25/2023 02:25:45 PM
"M/D/YYYY h:mm A",
"M/DD/YYYY h:mm A",
"MM/D/YYYY h:mm A",
"MM/DD/YYYY h:mm A",
"MMDDYY h:mm:ssa", // Two-digit year with time
"MMDDYYYY h:mm:ssa", "M/D/YY h:mm A", // Example: 1/5/23 9:00 AM
"M/D/YY h:mm:ssa", "M/D/YY h:mmA", // Example: 1/5/23 9:00AM
"M/DD/YY h:mm:ssa", "M/D/YY h A", // Example: 1/5/23 9 AM
"MM/D/YY h:mm:ssa", "M/D/YY hA", // Example: 1/5/23 9AM
"MM/DD/YY h:mm:ssa", "M/D/YY hh:mm A", // Example: 1/5/23 02:25 PM
"M/D/YYYY h:mm:ssa", "M/D/YY hh:mm:ss A", // Example: 1/5/23 02:25:45 PM
"M/DD/YYYY h:mm:ssa",
"MM/D/YYYY h:mm:ssa",
"MM/DD/YYYY h:mm:ssa",
"MMDDYY h:mm:ssA", "MM/D/YY h:mm A", // Example: 12/5/23 9:00 AM
"MMDDYYYY h:mm:ssA", "MM/D/YY h:mmA", // Example: 12/5/23 9:00AM
"M/D/YY h:mm:ssA", "MM/D/YY h A", // Example: 12/5/23 9 AM
"M/DD/YY h:mm:ssA", "MM/D/YY hA", // Example: 12/5/23 9AM
"MM/D/YY h:mm:ssA", "MM/D/YY hh:mm A", // Example: 12/5/23 02:25 PM
"MM/DD/YY h:mm:ssA", "MM/D/YY hh:mm:ss A", // Example: 12/5/23 02:25:45 PM
"M/D/YYYY h:mm:ssA",
"M/DD/YYYY h:mm:ssA",
"MM/D/YYYY h:mm:ssA",
"MM/DD/YYYY h:mm:ssA",
"MMDDYY h:mm:ss a", "M/DD/YY h:mm A", // Example: 1/25/23 9:00 AM
"MMDDYYYY h:mm:ss a", "M/DD/YY h:mmA", // Example: 1/25/23 9:00AM
"M/D/YY h:mm:ss a", "M/DD/YY h A", // Example: 1/25/23 9 AM
"M/DD/YY h:mm:ss a", "M/DD/YY hA", // Example: 1/25/23 9AM
"MM/D/YY h:mm:ss a", "M/DD/YY hh:mm A", // Example: 1/25/23 02:25 PM
"MM/DD/YY h:mm:ss a", "M/DD/YY hh:mm:ss A", // Example: 1/25/23 02:25:45 PM
"M/D/YYYY h:mm:ss a",
"M/DD/YYYY h:mm:ss a",
"MM/D/YYYY h:mm:ss a",
"MM/DD/YYYY h:mm:ss a",
"MMDDYY h:mm:ss A", "MM/DD/YY h:mm A", // Example: 12/25/23 9:00 AM
"MMDDYYYY h:mm:ss A", "MM/DD/YY h:mmA", // Example: 12/25/23 9:00AM
"M/D/YY h:mm:ss A", "MM/DD/YY h A", // Example: 12/25/23 9 AM
"M/DD/YY h:mm:ss A", "MM/DD/YY hA", // Example: 12/25/23 9AM
"MM/D/YY h:mm:ss A", "MM/DD/YY hh:mm A", // Example: 12/25/23 02:25 PM
"MM/DD/YY h:mm:ss A", "MM/DD/YY hh:mm:ss A", // Example: 12/25/23 02:25:45 PM
"M/D/YYYY h:mm:ss A",
"M/DD/YYYY h:mm:ss A",
"MM/D/YYYY h:mm:ss A",
"MM/DD/YYYY h:mm:ss A",
"MMDDYY H:mm", // Four-digit year without time
"MMDDYYYY H:mm", "M/D/YYYY", // Example: 1/5/2023
"M/D/YY H:mm", "MM/D/YYYY", // Example: 12/5/2023
"M/DD/YY H:mm", "M/DD/YYYY", // Example: 1/25/2023
"MM/D/YY H:mm", "MM/DD/YYYY", // Example: 12/25/2023
"MM/DD/YY H:mm",
"M/D/YYYY H:mm",
"M/DD/YYYY H:mm",
"MM/D/YYYY H:mm",
"MM/DD/YYYY H:mm",
"MMDDYY H:mm:ss", // Two-digit year without time
"MMDDYYYY H:mm:ss", "M/D/YY", // Example: 1/5/23
"M/D/YY H:mm:ss", "MM/D/YY", // Example: 12/5/23
"M/DD/YY H:mm:ss", "M/DD/YY", // Example: 1/25/23
"MM/D/YY H:mm:ss", "MM/DD/YY" // Example: 12/25/23
"MM/DD/YY H:mm:ss",
"M/D/YYYY H:mm:ss",
"MM/D/YYYY H:mm:ss",
"MM/DD/YYYY H:mm:ss"
]; ];
// CONFIRMED
export const dateFormats = [ export const dateFormats = [
"MMDDYY",
"MMDDYYYY", "MMDDYYYY",
"M/D/YY", "MMDDYY",
"M/DD/YY", // Four-digit year
"MM/D/YY", "M/D/YYYY", // Example: 1/5/2023
"MM/DD/YY", "MM/D/YYYY", // Example: 12/5/2023
"M/D/YYYY", "M/DD/YYYY", // Example: 1/25/2023
"M/DD/YYYY", "MM/DD/YYYY", // Example: 12/25/2023
"MM/D/YYYY",
"MM/DD/YYYY" // Two-digit year
"M/D/YY", // Example: 1/5/23
"MM/D/YY", // Example: 12/5/23
"M/DD/YY", // Example: 1/25/23
"MM/DD/YY", // Example: 12/25/23
// Explicitly handle single-digit month and day
"M/D/YY", // Example: 1/5/23
"M/D/YYYY", // Example: 1/5/2023
"M/DD/YY", // Example: 1/25/23
"M/DD/YYYY", // Example: 1/25/2023
"MM/D/YY", // Example: 12/5/23
"MM/D/YYYY" // Example: 12/5/2023
]; ];