From 0e0ab053f34dbc024b9da2569d49c267976169c6 Mon Sep 17 00:00:00 2001 From: jude Date: Fri, 1 Mar 2024 16:54:56 +0000 Subject: [PATCH] Fix time inputs --- reminder-dashboard/src/api.ts | 35 +---- .../src/components/Reminder/Settings.tsx | 8 +- .../src/components/Reminder/TimeInput.tsx | 126 ++++++++++++++---- 3 files changed, 113 insertions(+), 56 deletions(-) diff --git a/reminder-dashboard/src/api.ts b/reminder-dashboard/src/api.ts index 1d650a3..1ac9e0d 100644 --- a/reminder-dashboard/src/api.ts +++ b/reminder-dashboard/src/api.ts @@ -128,38 +128,20 @@ export const fetchGuildRoles = (guild: string) => ({ export const fetchGuildReminders = (guild: string) => ({ queryKey: ["GUILD_REMINDERS", guild], queryFn: () => - axios - .get(`/dashboard/api/guild/${guild}/reminders`) - .then((resp) => resp.data) - .then((value) => - value.map((reminder) => ({ - ...reminder, - utc_time: DateTime.fromISO(reminder.utc_time, { zone: "UTC" }), - expires: - reminder.expires === null - ? null - : DateTime.fromISO(reminder.expires, { zone: "UTC" }), - })), - ) as Promise, + axios.get(`/dashboard/api/guild/${guild}/reminders`).then((resp) => resp.data) as Promise< + Reminder[] + >, staleTime: OTHER_STALE_TIME, }); export const patchGuildReminder = (guild: string) => ({ mutationFn: (reminder: Reminder) => - axios.patch(`/dashboard/api/guild/${guild}/reminders`, { - ...reminder, - utc_time: reminder.utc_time.toFormat("yyyy-LL-dd'T'HH:mm:ss"), - }), + axios.patch(`/dashboard/api/guild/${guild}/reminders`, reminder), }); export const postGuildReminder = (guild: string) => ({ mutationFn: (reminder: Reminder) => - axios - .post(`/dashboard/api/guild/${guild}/reminders`, { - ...reminder, - utc_time: reminder.utc_time.toFormat("yyyy-LL-dd'T'HH:mm:ss"), - }) - .then((resp) => resp.data), + axios.post(`/dashboard/api/guild/${guild}/reminders`, reminder).then((resp) => resp.data), }); export const deleteGuildReminder = (guild: string) => ({ @@ -182,12 +164,7 @@ export const fetchGuildTemplates = (guild: string) => ({ export const postGuildTemplate = (guild: string) => ({ mutationFn: (reminder: Reminder) => - axios - .post(`/dashboard/api/guild/${guild}/templates`, { - ...reminder, - utc_time: reminder.utc_time.toFormat("yyyy-LL-dd'T'HH:mm:ss"), - }) - .then((resp) => resp.data), + axios.post(`/dashboard/api/guild/${guild}/templates`, reminder).then((resp) => resp.data), }); export const deleteGuildTemplate = (guild: string) => ({ diff --git a/reminder-dashboard/src/components/Reminder/Settings.tsx b/reminder-dashboard/src/components/Reminder/Settings.tsx index 9df0285..96085ef 100644 --- a/reminder-dashboard/src/components/Reminder/Settings.tsx +++ b/reminder-dashboard/src/components/Reminder/Settings.tsx @@ -43,11 +43,11 @@ export const Settings = () => { @@ -97,9 +143,17 @@ export const TimeInput = ({ defaultValue, onInput }) => { pattern="\d*" maxlength={2} placeholder="DD" - value={time?.day.toLocaleString("en-US", { minimumIntegerDigits: 2 })} + value={ + time + ? time.day.toLocaleString("en-US", { minimumIntegerDigits: 2 }) + : "" + } onBlur={(ev) => { - setTime(time.set({ day: ev.currentTarget.value })); + ev.currentTarget.value + ? updateTime({ + day: parseInt(ev.currentTarget.value), + }) + : updateTime(null); }} >{" "} @@ -116,9 +170,17 @@ export const TimeInput = ({ defaultValue, onInput }) => { pattern="\d*" maxlength={2} placeholder="hh" - value={time?.hour.toLocaleString("en-US", { minimumIntegerDigits: 2 })} + value={ + time + ? time.hour.toLocaleString("en-US", { minimumIntegerDigits: 2 }) + : "" + } onBlur={(ev) => { - setTime(time.set({ hour: ev.currentTarget.value })); + ev.currentTarget.value + ? updateTime({ + hour: parseInt(ev.currentTarget.value), + }) + : updateTime(null); }} >{" "} @@ -136,11 +198,19 @@ export const TimeInput = ({ defaultValue, onInput }) => { pattern="\d*" maxlength={2} placeholder="mm" - value={time?.minute.toLocaleString("en-US", { - minimumIntegerDigits: 2, - })} + value={ + time + ? time.minute.toLocaleString("en-US", { + minimumIntegerDigits: 2, + }) + : "" + } onBlur={(ev) => { - setTime(time.set({ minute: ev.currentTarget.value })); + ev.currentTarget.value + ? updateTime({ + minute: parseInt(ev.currentTarget.value), + }) + : updateTime(null); }} >{" "} @@ -158,11 +228,19 @@ export const TimeInput = ({ defaultValue, onInput }) => { pattern="\d*" maxlength={2} placeholder="ss" - value={time?.second.toLocaleString("en-US", { - minimumIntegerDigits: 2, - })} + value={ + time + ? time.second.toLocaleString("en-US", { + minimumIntegerDigits: 2, + }) + : "" + } onBlur={(ev) => { - setTime(time.set({ second: ev.currentTarget.value })); + ev.currentTarget.value + ? updateTime({ + second: parseInt(ev.currentTarget.value), + }) + : updateTime(null); }} >{" "} @@ -200,7 +278,9 @@ export const TimeInput = ({ defaultValue, onInput }) => { } ref={ref} onInput={(ev) => { - setTime(DateTime.fromISO(ev.currentTarget.value)); + ev.currentTarget.value === "" + ? setTime(null) + : setTime(DateTime.fromISO(ev.currentTarget.value)); }} >