Files
monitor-im-flur/src/components/Flatastic/Flatastic.tsx
2025-07-25 11:27:09 +02:00

39 lines
1.1 KiB
TypeScript

import { useFlatasticStore } from "@/store/flatastic";
import { useEffect } from "react";
import type { FlatasticChore } from "@/types/flatasticChore";
const idToNameMap: Record<number, string> = {
1836104: "Gruber",
1836101: "Darius",
1593610: "Arif",
1860060: "Rishab",
};
export default function Flatastic() {
const fetchChores = useFlatasticStore((state) => state.fetch);
const chores = useFlatasticStore((state) => state.chores);
useEffect(() => {
fetchChores();
const interval = setInterval(() => {
fetchChores();
}, 60000);
return () => clearInterval(interval);
}, [fetchChores]);
return (
<div>
<h1>Flatastic Chores</h1>
<ul>
{chores.map((chore: FlatasticChore) => (
<li key={chore.id} style={{ textAlign: "left" }}>
{idToNameMap[chore.currentUser]}: {chore.title} -
Points: {chore.points}
</li>
))}
</ul>
</div>
);
}