diff --git a/client/src/components/timerCard.tsx b/client/src/components/timerCard.tsx index a65c9e5..04adfc8 100644 --- a/client/src/components/timerCard.tsx +++ b/client/src/components/timerCard.tsx @@ -27,10 +27,13 @@ const replaceReferencedFriendsInName = ( }); }; -const refreshTimer = (id: number) => - fetch(`/api/timers/${id}/refresh`, { +const refreshTimer = (id?: number) => { + if (!id) return; + + return fetch(`/api/timers/${id}/refresh`, { method: "POST", }); +}; export type TimerCardProps = { timer: TimerResponse; @@ -41,18 +44,20 @@ export default function TimerCard({ timer, onSelect }: TimerCardProps) { const [since, setSince] = useState(""); useEffect(() => { - const start = new Date(timer.start); - let updateTimersInterval: ReturnType; - const msTillNextSecond = 1000 - (start.getTime() % 1000); + if (timer && timer.start) { + const start = new Date(timer.start); + let updateTimersInterval: ReturnType; + const msTillNextSecond = 1000 - (start.getTime() % 1000); - setSince(ago(start)); + setSince(ago(start)); - setTimeout(() => { - updateTimersInterval = setInterval(() => setSince(ago(start)), 1_000); - }, msTillNextSecond); + setTimeout(() => { + updateTimersInterval = setInterval(() => setSince(ago(start)), 1_000); + }, msTillNextSecond); - return () => clearInterval(updateTimersInterval); - }, [timer.start]); + return () => clearInterval(updateTimersInterval); + } + }, [timer?.start]); return (
@@ -63,36 +68,44 @@ export default function TimerCard({ timer, onSelect }: TimerCardProps) {

- {replaceReferencedFriendsInName( - timer.name, - timer.referenced_friends, - onSelect - ).map((element: JSX.Element | string, i: number) => ( - - {element} - - ))} + {timer?.name && timer?.referenced_friends ? ( + replaceReferencedFriendsInName( + timer.name, + timer.referenced_friends, + onSelect + ).map((element: JSX.Element | string, i: number) => ( + + {element} + + )) + ) : ( + <> + )}

-
- - onSelect({ friendId: timer.timer_refreshes[0].refreshed_by.id }) - } - > - {" "} - {timer.created_by.name} - {" "} - is tracking this -
+ {timer.created_by ? ( +
+ onSelect({ friendId: timer?.created_by?.id })}> + {timer.created_by.name} + {" "} + is tracking this +
+ ) : ( +
has no creator?
+ )}
{timer.timer_refreshes && timer.timer_refreshes.length ? ( onSelect({ - friendId: timer.timer_refreshes[0].refreshed_by.id, + friendId: timer.timer_refreshes + ? timer.timer_refreshes[0].refreshed_by.id + : undefined, }) } > @@ -104,8 +117,9 @@ export default function TimerCard({ timer, onSelect }: TimerCardProps) { "has not yet been refreshed..." )}
+