packages/docs/docs/state-management.md

@@ -11,6 +11,11 @@ A Lens is an effectful handle to a piece of state. It can read the current value
 subscribe to changes, and write updates back to the underlying source. A Lens
 can point at a whole state object or focus on one nested field inside it.
 
+`effect-view` re-exports the `Lens` and `View` modules from
+[`effect-lens`](https://github.com/Thiladev/effect-lens) for convenience. The
+core data model and transformation APIs belong to `effect-lens`, so check the
+[`effect-lens` documentation](https://github.com/Thiladev/effect-lens/tree/master/packages/effect-lens) for the full Lens/View API.
+
 The usual pattern is to create state with Effect primitives such as
 `SubscriptionRef`, turn that primitive into a Lens with a matching constructor
 such as `Lens.fromSubscriptionRef`, and bind Lens values into components with
@@ -18,11 +23,6 @@ such as `Lens.fromSubscriptionRef`, and bind Lens values into components with
 
 `View` is the read-only side of this model. Every Lens is also a View.
 
-`effect-view` re-exports the `Lens` and `View` modules from
-[`effect-lens`](https://github.com/Thiladev/effect-lens) for convenience. The
-core data model and transformation APIs belong to `effect-lens`, so check the
-[`effect-lens` documentation](https://github.com/Thiladev/effect-lens/tree/master/packages/effect-lens) for the full Lens/View API.
-
 ## Where To Store State
 
 State can live pretty much anywhere as a `Lens` or `View`: in a
@@ -43,7 +43,7 @@ class CounterState extends Context.Service<
 >()("CounterState") {
   static readonly layer = Layer.effect(
     CounterState,
-    Effect.gen(function* () {
+    Effect.gen(function*() {
       const count = Lens.fromSubscriptionRef(yield* SubscriptionRef.make(0))
 
       return { count } as const
@@ -51,7 +51,7 @@ class CounterState extends Context.Service<
   )
 }
 
-const CounterValueView = Component.make("CounterValue")(function* () {
+const CounterValueView = Component.make("CounterValue")(function*() {
   const state = yield* CounterState
   const [count] = yield* View.useAll([state.count])
 
@@ -67,9 +67,9 @@ hierarchy of subcomponents that receive it through props, create it with
 import { Effect, SubscriptionRef } from "effect"
 import { Component, Lens, View } from "effect-view"
 
-const LocalCounterView = Component.make("LocalCounter")(function* () {
+const LocalCounterView = Component.make("LocalCounter")(function*() {
   const state = yield* Component.useOnMount(() =>
-    Effect.gen(function* () {
+    Effect.gen(function*() {
       const count = Lens.fromSubscriptionRef(yield* SubscriptionRef.make(0))
 
       return { count } as const
@@ -106,7 +106,7 @@ class CounterState extends Context.Service<
 >()("CounterState") {
   static readonly layer = Layer.effect(
     CounterState,
-    Effect.gen(function* () {
+    Effect.gen(function*() {
       const count = Lens.fromSubscriptionRef(yield* SubscriptionRef.make(0))
       const doubled = View.map(count, (n) => n * 2)
 
@@ -179,7 +179,7 @@ class FormState extends Context.Service<
 >()("FormState") {
   static readonly layer = Layer.effect(
     FormState,
-    Effect.gen(function* () {
+    Effect.gen(function*() {
       const name = Lens.fromSubscriptionRef(yield* SubscriptionRef.make(""))
 
       return { name } as const
@@ -231,7 +231,7 @@ class ProfileState extends Context.Service<
 >()("ProfileState") {
   static readonly layer = Layer.effect(
     ProfileState,
-    Effect.gen(function* () {
+    Effect.gen(function*() {
       const profile = Lens.fromSubscriptionRef(
         yield* SubscriptionRef.make<UserProfile>({
           name: "",
@@ -247,7 +247,7 @@ class ProfileState extends Context.Service<
   )
 }
 
-const ProfileNameView = Component.make("ProfileName")(function* () {
+const ProfileNameView = Component.make("ProfileName")(function*() {
   const state = yield* ProfileState
   const [name, setName] = yield* Lens.useState(state.name)
   const [role] = yield* View.useAll([state.role])