94 行
2.8 KiB
TypeScript
94 行
2.8 KiB
TypeScript
import DateTimeField, { toMinutePrecisionIsoUtc } from '@/components/common/DateTimeField'
|
|
import FormField from '@/components/common/FormField'
|
|
import { Button } from '@/components/ui/button'
|
|
import { useUITranslation } from '@/lib/useUITranslation'
|
|
|
|
import type { FC, ReactNode } from 'react'
|
|
|
|
type Props = {
|
|
disabled?: boolean
|
|
originalCreatedFrom: string | null
|
|
setOriginalCreatedFrom: (x: string | null) => void
|
|
originalCreatedBefore: string | null
|
|
setOriginalCreatedBefore: (x: string | null) => void
|
|
errors?: ReactNode[] }
|
|
|
|
|
|
const PostOriginalCreatedTimeField: FC<Props> = (
|
|
{ disabled,
|
|
originalCreatedFrom,
|
|
setOriginalCreatedFrom,
|
|
originalCreatedBefore,
|
|
setOriginalCreatedBefore,
|
|
errors }: Props,
|
|
) => {
|
|
const { label } = useUITranslation ('shared')
|
|
return (
|
|
<FormField label={label ('labels.originalCreatedAt')} messages={errors}>
|
|
{({ describedBy, invalid }) => (
|
|
<>
|
|
<div className="my-1 flex min-w-0 flex-wrap items-center gap-2">
|
|
<DateTimeField
|
|
className="min-w-0 max-w-full"
|
|
disabled={disabled ?? false}
|
|
aria-describedby={describedBy}
|
|
aria-invalid={invalid}
|
|
invalid={invalid}
|
|
value={originalCreatedFrom ?? undefined}
|
|
onChange={setOriginalCreatedFrom}
|
|
onBlur={ev => {
|
|
const v = ev.target.value
|
|
if (!(v))
|
|
return
|
|
|
|
const d = new Date (v)
|
|
if (d.getMinutes () === 0 && d.getHours () === 0)
|
|
d.setDate (d.getDate () + 1)
|
|
else
|
|
d.setMinutes (d.getMinutes () + 1)
|
|
setOriginalCreatedBefore (toMinutePrecisionIsoUtc (d.toISOString ()))
|
|
}}/>
|
|
<span className="ainu-ui-label shrink-0 whitespace-nowrap">
|
|
{label ('labels.since')}
|
|
</span>
|
|
<Button
|
|
type="button"
|
|
className="ainu-ui-label shrink-0 rounded bg-gray-600 text-white
|
|
dark:bg-gray-600 dark:text-white"
|
|
disabled={disabled}
|
|
onClick={() => {
|
|
setOriginalCreatedFrom (null)
|
|
}}>
|
|
{label ('actions.reset')}
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="my-1 flex min-w-0 flex-wrap items-center gap-2">
|
|
<DateTimeField
|
|
className="min-w-0 max-w-full"
|
|
disabled={disabled}
|
|
aria-describedby={describedBy}
|
|
aria-invalid={invalid}
|
|
invalid={invalid}
|
|
value={originalCreatedBefore ?? undefined}
|
|
onChange={setOriginalCreatedBefore}/>
|
|
<span className="ainu-ui-label shrink-0 whitespace-nowrap">
|
|
{label ('labels.before')}
|
|
</span>
|
|
<Button
|
|
type="button"
|
|
className="ainu-ui-label shrink-0 rounded bg-gray-600 text-white
|
|
dark:bg-gray-600 dark:text-white"
|
|
disabled={disabled}
|
|
onClick={() => {
|
|
setOriginalCreatedBefore (null)
|
|
}}>
|
|
{label ('actions.reset')}
|
|
</Button>
|
|
</div>
|
|
</>)}
|
|
</FormField>)
|
|
}
|
|
|
|
export default PostOriginalCreatedTimeField
|