Break out core date parsing utils to share between packages
This commit is contained in:
parent
74ff54eb8a
commit
4afc71c4bf
3 changed files with 39 additions and 40 deletions
|
@ -9,6 +9,7 @@
|
|||
import Calendar from "./Calendar.svelte"
|
||||
import DateTimeInput from "./DateInput.svelte"
|
||||
import ActionButton from "../../../ActionButton/ActionButton.svelte"
|
||||
import { parseDate } from "../../../helpers"
|
||||
|
||||
export let id = null
|
||||
export let disabled = false
|
||||
|
@ -30,7 +31,7 @@
|
|||
let popover
|
||||
let calendar
|
||||
|
||||
$: parsedValue = parseValue(value)
|
||||
$: parsedValue = parseDate(value)
|
||||
$: showCalendar = !timeOnly
|
||||
$: showTime = enableTime || timeOnly
|
||||
|
||||
|
@ -59,28 +60,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
const parseValue = value => {
|
||||
let parsedDate
|
||||
|
||||
// Attempt to parse as a time-only string if required
|
||||
if (typeof value === "string" && timeOnly) {
|
||||
parsedDate = dayjs(`0-${value}`)
|
||||
}
|
||||
|
||||
// Attempt to parse as normal if required
|
||||
if (!parsedDate?.isValid()) {
|
||||
parsedDate = dayjs(value)
|
||||
}
|
||||
if (!parsedDate?.isValid()) {
|
||||
return null
|
||||
}
|
||||
|
||||
// By rounding to the nearest second we avoid locking up in an endless
|
||||
// loop in the builder, caused by potentially enriching {{ now }} to every
|
||||
// millisecond.
|
||||
return dayjs(Math.floor(parsedDate.valueOf() / 1000) * 1000)
|
||||
}
|
||||
|
||||
const handleChange = date => {
|
||||
if (!date) {
|
||||
dispatch("change", null)
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import { helpers } from "@budibase/shared-core"
|
||||
import dayjs from "dayjs"
|
||||
|
||||
export const deepGet = helpers.deepGet
|
||||
|
||||
|
@ -115,3 +116,33 @@ export const copyToClipboard = value => {
|
|||
}
|
||||
})
|
||||
}
|
||||
|
||||
export const parseDate = (value, { timeOnly, dateOnly } = {}) => {
|
||||
// If empty then invalid
|
||||
if (!value) {
|
||||
return null
|
||||
}
|
||||
|
||||
// Certain string values need transformed
|
||||
if (typeof value !== "string") {
|
||||
if (timeOnly || !isNaN(new Date(`0-${value}`))) {
|
||||
value = `0-${value}`
|
||||
}
|
||||
|
||||
// If date only, check for cases where we received a UTC string
|
||||
else if (dateOnly && value.endsWith("Z")) {
|
||||
value = value.split("Z")[0]
|
||||
}
|
||||
}
|
||||
|
||||
// Parse value and check for validity
|
||||
const parsedDate = dayjs(value)
|
||||
if (!parsedDate.isValid()) {
|
||||
return null
|
||||
}
|
||||
|
||||
// By rounding to the nearest second we avoid locking up in an endless
|
||||
// loop in the builder, caused by potentially enriching {{ now }} to every
|
||||
// millisecond.
|
||||
return dayjs(Math.floor(parsedDate.valueOf() / 1000) * 1000)
|
||||
}
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
<script>
|
||||
import dayjs from "dayjs"
|
||||
import { CoreDatePicker, Icon } from "@budibase/bbui"
|
||||
import { CoreDatePicker, Icon, Helpers } from "@budibase/bbui"
|
||||
import { onMount } from "svelte"
|
||||
|
||||
export let value
|
||||
|
@ -13,10 +12,7 @@
|
|||
let datePickerAPI
|
||||
let isOpen
|
||||
|
||||
// Adding the 0- will turn a string like 00:00:00 into a valid ISO
|
||||
// date, but will make actual ISO dates invalid
|
||||
$: isTimeValue = !isNaN(new Date(`0-${value}`))
|
||||
$: timeOnly = isTimeValue || schema?.timeOnly
|
||||
$: timeOnly = schema?.timeOnly
|
||||
$: dateOnly = schema?.dateOnly
|
||||
$: format = timeOnly
|
||||
? "HH:mm:ss"
|
||||
|
@ -24,18 +20,11 @@
|
|||
? "MMM D YYYY"
|
||||
: "MMM D YYYY, HH:mm"
|
||||
$: editable = focused && !readonly
|
||||
$: displayValue = getDisplayValue(value, format, timeOnly, isTimeValue)
|
||||
$: displayValue = getDisplayValue(value, timeOnly, dateOnly, format)
|
||||
|
||||
const getDisplayValue = (value, format, timeOnly, isTimeValue) => {
|
||||
if (!value) {
|
||||
return ""
|
||||
}
|
||||
// Parse full date strings
|
||||
if (!timeOnly || !isTimeValue) {
|
||||
return dayjs(value).format(format)
|
||||
}
|
||||
// Otherwise must be a time string
|
||||
return dayjs(`0-${value}`).format(format)
|
||||
const getDisplayValue = (value, timeOnly, dateOnly, format) => {
|
||||
const parsedDate = Helpers.parseDate(value, { timeOnly, dateOnly })
|
||||
return parsedDate?.format(format) || ""
|
||||
}
|
||||
|
||||
// Ensure we close flatpickr when unselected
|
||||
|
|
Loading…
Reference in a new issue