diff --git a/src/App.css b/src/App.css index 07ada2b..7c54b92 100644 --- a/src/App.css +++ b/src/App.css @@ -114,6 +114,12 @@ input, textarea { margin-right: 1em; } +.vert { + display: flex; + flex-direction: column; + align-items: flex-start; +} + .notification { font-size: 0.7em; margin-top: 0.5em; diff --git a/src/components/TimeEntryForm.tsx b/src/components/TimeEntryForm.tsx index f9b131a..92b019d 100644 --- a/src/components/TimeEntryForm.tsx +++ b/src/components/TimeEntryForm.tsx @@ -85,7 +85,7 @@ export function TimeEntryForm() { const draftSaved = draft?.savedTime?.toDate().toLocaleString() || ''; - const { register, handleSubmit, watch, formState: { errors }, reset: useFormReset } = useForm({ + const { register, handleSubmit, watch, setValue, formState: { errors }, reset: useFormReset } = useForm({ defaultValues: makeDefaultFormValues(draft?.log), values: getFormFieldsFromLog(draft?.log) }); @@ -159,6 +159,18 @@ export function TimeEntryForm() { deleteDraft(); }; + const setStartToNow = (evt?: MouseEvent) => { + evt?.preventDefault(); + const now = new Date(); + setValue('startTime', timeString(now)); + }; + + const setEndToNow = (evt?: MouseEvent) => { + evt?.preventDefault(); + const now = new Date(); + setValue('endTime', timeString(now)); + }; + const defaultPlaceholder = recentList ? `${recentList} (last used)` : `${DEFAULT_LIST} (default)`; return ( @@ -169,8 +181,11 @@ export function TimeEntryForm() { {errors.dateEntry && Date is required.} - - + +
+ + +
{errors.startTime && Start time is required.} @@ -184,7 +199,10 @@ export function TimeEntryForm() { {errors.note && Note is required.} - +
+ + +
{errors.endTime && End time is required.} {draftSaved && Draft last saved {draftSaved}}