40 lines
1008 B
TypeScript
40 lines
1008 B
TypeScript
import { ago } from "../utils/ago";
|
|
import { useEffect, useState } from "react";
|
|
|
|
const replaceReferencedFriendsInName = (name, referencedFriends) => {
|
|
const friendIdToFriend = referencedFriends.reduce((friendMap, friend) => {
|
|
friendMap[friend.id] = friend;
|
|
return friendMap;
|
|
}, {});
|
|
return name.replaceAll(
|
|
/@\<(\d+)\>/g,
|
|
(_match, id) => friendIdToFriend[id].name
|
|
);
|
|
};
|
|
// name.replaceAll(
|
|
|
|
export default function TimerCard({ timer }) {
|
|
const [since, setSince] = useState(ago(timer.start));
|
|
|
|
useEffect(() => {
|
|
let updateTimersInterval;
|
|
const msTillNextSecond = 1000 - (timer.start.getTime() % 1000);
|
|
|
|
setTimeout(() => {
|
|
updateTimersInterval = setInterval(
|
|
() => setSince(ago(timer.start)),
|
|
1_000
|
|
);
|
|
}, msTillNextSecond);
|
|
|
|
return () => clearInterval(updateTimersInterval);
|
|
}, []);
|
|
|
|
return (
|
|
<h1>
|
|
<code>{since}</code>{" "}
|
|
{replaceReferencedFriendsInName(timer.name, timer.referenced_friends)}
|
|
</h1>
|
|
);
|
|
}
|