Todo work

packages/example/src/routes/__root.tsx

@@ -13,7 +13,7 @@ export const Route = createRootRoute({
 function Root() {
     return (
         <Theme>
-            <Container>
+            <Container mb="4">
                 <Flex direction="row" justify="center" align="center" gap="2">
                     <Link to="/">Index</Link>
                     <Link to="/blank">Blank</Link>

packages/example/src/routes/index.tsx

@@ -1,4 +1,5 @@
 import { runtime } from "@/runtime"
+import { Todos } from "@/todo/Todos"
 import { TodosState } from "@/todo/TodosState.service"
 import { createFileRoute } from "@tanstack/react-router"
 import { Effect, pipe } from "effect"
@@ -7,9 +8,11 @@ import { ReactComponent, ReactHook } from "effect-fc"
 
 export const Route = createFileRoute("/")({
     component: pipe(
-        Effect.fn(function*() {
-            const context = yield* ReactHook.useMemoLayer(TodosState.Default("todos"))
-            return <div>Hello "/"!</div>
+        Effect.fn("Route")(function*() {
+            return yield* Effect.provide(
+                ReactComponent.use(Todos, Todos => <Todos />),
+                yield* ReactHook.useMemoLayer(TodosState.Default("todos")),
+            )
         }),
 
         ReactComponent.withDisplayName("Index"),