Files
cally/contexts/ToDosContext.tsx
2024-09-12 15:39:20 +02:00

98 lines
2.1 KiB
TypeScript

import { createContext, FC, ReactNode, useContext, useState } from "react";
export interface IToDo {
id: number;
title: string;
done: boolean;
date: Date;
points?: number;
rotate: boolean;
}
interface IToDosContext {
toDos: IToDo[];
updateToDo: (id: number, changes: Partial<IToDo>) => void;
addToDo: (newToDo: IToDo) => void;
}
const ToDosContext = createContext<IToDosContext>(undefined!);
export const ToDosContextProvider: FC<{ children: ReactNode }> = ({
children,
}) => {
const [toDos, setToDos] = useState<IToDo[]>([
{
id: 0,
title: "Pay: Credit card",
done: false,
date: new Date(),
rotate: true,
},
{
id: 1,
title: "Monthly Log story",
done: false,
date: new Date(),
rotate: false,
},
{
id: 2,
title: "Write: Arcade Highlights",
done: false,
date: new Date(),
rotate: true,
},
{
id: 3,
title: "Dressup: Cat",
done: false,
date: new Date(Date.now() + 86400000),
points: 40,
rotate: false,
},
{
id: 4,
title: "Trim: Nails",
done: false,
date: new Date(Date.now() + 86400000),
rotate: false,
},
{
id: 5,
title: "Monthly Log",
done: false,
date: new Date(Date.now() + 2 * 86400000),
rotate: true,
},
{
id: 6,
title: "Do it",
done: false,
date: new Date(Date.now() + 3 * 86400000),
rotate: false,
},
]);
const updateToDo = (id: number, changes: Partial<IToDo>) => {
setToDos((prevToDos) =>
prevToDos.map((toDo) => (toDo.id === id ? { ...toDo, ...changes } : toDo))
);
};
const addToDo = (newToDo: IToDo) => {
setToDos((prevToDos) => [
...prevToDos,
{
...newToDo,
id: prevToDos.length ? prevToDos[prevToDos.length - 1].id + 1 : 0,
},
]);
};
return (
<ToDosContext.Provider value={{ toDos, updateToDo, addToDo }}>
{children}
</ToDosContext.Provider>
);
};
export const useToDosContext = () => useContext(ToDosContext)!;