From 054f8773f07ffb925eec5e4cf67d8d9d6db7a3fd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julien=20Valverd=C3=A9?= Date: Tue, 9 Jun 2026 11:34:13 +0200 Subject: [PATCH] Docs --- packages/docs/docs/getting-started.md | 29 +++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) diff --git a/packages/docs/docs/getting-started.md b/packages/docs/docs/getting-started.md index af28d4f..be478f3 100644 --- a/packages/docs/docs/getting-started.md +++ b/packages/docs/docs/getting-started.md @@ -366,6 +366,35 @@ and its scoped lifecycle can restart with the new environment. For services that should not trigger that behavior, pass their tags with `Component.withOptions({ nonReactiveTags: [...] })`. +## Provide Services To A Subtree + +Use `Component.useContextFromLayer` when an Effect-FC component should provide +extra services to another Effect-FC component. It turns a `Layer` into a runtime +context that can be provided to `.use`. + +```tsx title="src/GreetingPageView.tsx" +import { Effect } from "effect" +import { Component } from "effect-fc" +import { GreetingView } from "./Greeting" +import { GreetingService } from "./services" + +const GreetingLive = GreetingService.Default({ + greet: (name: string) => `Welcome, ${name}`, +}) + +export const GreetingPageView = Component.make("GreetingPage")(function* () { + const context = yield* Component.useContextFromLayer(GreetingLive) + const Greeting = yield* Effect.provide(GreetingView.use, context) + + return +}) +``` + +The layer passed to `useContextFromLayer` should be stable. If a new layer value +is created on every render, Effect-FC has to build a new context, which can +cause unnecessary re-renders and scoped lifecycle restarts. Define static layers +outside the component, or memoize layers that depend on React props or state. + ## Where To Go Next Once the runtime and component boundary are in place, the rest of the library