typescript hacks

This commit is contained in:
Elizabeth Hunt 2023-04-05 00:57:18 -06:00
parent 98d984e5f4
commit 1b0ff8ce68
Signed by: simponic
GPG Key ID: 52B3774857EB24B1
4 changed files with 56 additions and 38 deletions

View File

@ -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,6 +44,7 @@ export default function TimerCard({ timer, onSelect }: TimerCardProps) {
const [since, setSince] = useState<string>("");
useEffect(() => {
if (timer && timer.start) {
const start = new Date(timer.start);
let updateTimersInterval: ReturnType<typeof setInterval>;
const msTillNextSecond = 1000 - (start.getTime() % 1000);
@ -52,7 +56,8 @@ export default function TimerCard({ timer, onSelect }: TimerCardProps) {
}, msTillNextSecond);
return () => clearInterval(updateTimersInterval);
}, [timer.start]);
}
}, [timer?.start]);
return (
<div className="card grid-card">
@ -63,36 +68,44 @@ export default function TimerCard({ timer, onSelect }: TimerCardProps) {
</h4>
</header>
<p>
{replaceReferencedFriendsInName(
{timer?.name && timer?.referenced_friends ? (
replaceReferencedFriendsInName(
timer.name,
timer.referenced_friends,
onSelect
).map((element: JSX.Element | string, i: number) => (
<span style={{ overflowWrap: "anywhere", hyphens: "auto" }} key={i}>
<span
style={{ overflowWrap: "anywhere", hyphens: "auto" }}
key={i}
>
{element}
</span>
))}
))
) : (
<> </>
)}
</p>
</div>
<div className="timer-metadata text-grey italic">
{timer.created_by ? (
<div>
<a
onClick={() =>
onSelect({ friendId: timer.timer_refreshes[0].refreshed_by.id })
}
>
{" "}
<a onClick={() => onSelect({ friendId: timer?.created_by?.id })}>
{timer.created_by.name}
</a>{" "}
is tracking this
</div>
) : (
<div>has no creator?</div>
)}
<div>
{timer.timer_refreshes && timer.timer_refreshes.length ? (
<span>
<a
onClick={() =>
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..."
)}
</div>
<button
onClick={() => refreshTimer(timer.id)}
onClick={() => refreshTimer(timer?.id)}
className="button outline"
>
Refresh

View File

@ -1,7 +1,7 @@
import React, { useContext, useState, createContext, useEffect } from "react";
interface authContext {
signedIn: boolean;
signedIn?: boolean;
setSignedIn: (signedIn: boolean) => void;
sessionOver: Date;
setSessionOver: (expiry: Date) => void;

View File

@ -68,9 +68,13 @@ export default function Timers() {
timers
.sort(
(
{ start: startA }: { start: string },
{ start: startB }: { start: string }
) => new Date(startB).getTime() - new Date(startA).getTime()
{ start: startA }: { start?: Date | string | undefined },
{ start: startB }: { start?: Date | string | undefined }
) => {
if (!startA) return -1;
if (!startB) return 1;
return new Date(startB).getTime() - new Date(startA).getTime();
}
)
.map((timer) => (
<TimerCard key={timer.id} onSelect={onSelect} timer={timer} />

View File

@ -12,7 +12,7 @@ export type TimerResponse = {
message?: string;
id?: number;
name?: string;
start?: Date;
start?: Date | string;
created_by?: Friend;
referenced_friends?: Friend[];
timer_refreshes?: TimerRefresh[];