Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 | 3x 3x 3x 1x 1x 1x 1x 3x 1x 1x 1x 1x 1x 1x | import { atom, selector } from "recoil";
export interface Todo {
id: number;
text: string;
isDone: boolean;
isEditable: boolean;
}
export const filterState = atom({
key: "filterState",
default: "All"
});
export const todoListState = atom({
key: "todoListState",
default: [] as Todo[]
});
export const filterTodoListState = selector({
key: "filterTodoListState",
get: ({ get }) => {
const filter = get(filterState);
const list: Todo[] = get(todoListState);
switch (filter) {
case "Done":
return list.filter(item => item.isDone);
case "Active":
return list.filter(item => !item.isDone);
default:
return list;
}
}
});
export const todoStatsState = selector({
key: "todoStatsState",
get: ({ get }) => {
const list = get(todoListState);
const all = list.length;
const done = list.filter(item => item.isDone).length;
const active = all - done;
const donePercentage = all === 0 ? 0 : done * 100 / all;
return { all, active, donePercentage };
}
}) |