initial commit

src/components/TodoView.tsx

@@ -0,0 +1,22 @@
+import { useEffect } from "react";
+import { observer } from "mobx-react-lite";
+import { todoStore } from "../stores/TodoStore";
+import { TodoList } from "./TodoList"
+
+import './TodoView.scss';
+
+export const TodoView = observer(function TodoView() {
+    useEffect(() => {
+        void todoStore.refresh();
+    }, []);
+
+    return (
+        <div>
+            <button type="button" onClick={() => void todoStore.refresh()} disabled={todoStore.loading}>
+                {todoStore.loading ? "Refreshing…" : "Refresh"}
+            </button>
+            {todoStore.error && <p>Failed to load todos: {todoStore.error}</p>}
+            {!todoStore.error && <TodoList items={todoStore.items} />}
+        </div>
+    );
+});