packages/docs/docs/intro.md

@@ -4,7 +4,7 @@ sidebar_position: 1
 
 # Effect FC
 
-Welcome to **Effect FC** – a powerful integration of [Effect-TS](https://effect.website/) with React 19.2+ that enables you to write function components using Effect generators.
+Welcome to **Effect FC** (as in: Effect **F**unction **C**omponent) – a powerful integration of [Effect](https://effect.website/) with React 19.2+ that enables you to write React function components using Effect generators.
 
 ## What is Effect FC?
 
@@ -12,37 +12,36 @@ Effect FC allows you to harness the full power of Effect-TS within your React co
 
 ### Key Features
 
-- **Effect-TS Integration**: Write components using Effect generators for powerful, composable effects
+- **Effect Integration**: Write your function component logic using Effect.
 - **Type Safety**: Full TypeScript support with Effect's comprehensive type system
-- **Resource Management**: Automatic cleanup and finalization of resources
+- **Dependency Injection**: Built-in support for providing dependencies to components using Effect services.
-- **Dependency Injection**: Built-in support for providing dependencies to components
+- **Resource Management**: Automatic cleanup and finalization of component resources using the `Scope` API.
-- **React 19.2+ Compatible**: Leverages the latest React features
 
 ## Quick Example
 
 Here's what writing an Effect FC component looks like:
 
 ```typescript
-export class Todos extends Component.make("Todos")(function*() {
+export class TodosView extends Component.make("TodosView")(function*() {
     const state = yield* TodosState
-    const [todos] = yield* useSubscribables(state.ref)
+    const [todos] = yield* Component.useSubscribables([state.subscriptionRef])
 
-    yield* useOnMount(() => Effect.andThen(
+    yield* Component.useOnMount(() => Effect.andThen(
         Console.log("Todos mounted"),
         Effect.addFinalizer(() => Console.log("Todos unmounted")),
     ))
 
-    const TodoFC = yield* Todo
+    const Todo = yield* TodoView.use
 
     return (
         <Container>
             <Heading align="center">Todos</Heading>
 
             <Flex direction="column" align="stretch" gap="2" mt="2">
-                <TodoFC _tag="new" />
+                <Todo _tag="new" />
 
                 {Chunk.map(todos, todo =>
-                    <TodoFC key={todo.id} _tag="edit" id={todo.id} />
+                    <Todo key={todo.id} _tag="edit" id={todo.id} />
                 )}
             </Flex>
         </Container>