Todos example refactoring

packages/example/src/todos/services/TodosState.ts

@@ -2,14 +2,14 @@ import { Todo } from "@/domain"
 import { KeyValueStore } from "@effect/platform"
 import { BrowserKeyValueStore } from "@effect/platform-browser"
 import { PlatformError } from "@effect/platform/Error"
-import { Chunk, Context, Effect, identity, Layer, ParseResult, Ref, Schema, SubscriptionRef } from "effect"
+import { Chunk, Context, Effect, identity, Layer, ParseResult, Ref, Schema, Stream, SubscriptionRef } from "effect"
 
 
 export class TodosState extends Context.Tag("TodosState")<TodosState, {
     readonly todos: SubscriptionRef.SubscriptionRef<Chunk.Chunk<Todo.Todo>>
 
-    readonly readFromLocalStorage: Effect.Effect<void, PlatformError | ParseResult.ParseError>
-    readonly saveToLocalStorage: Effect.Effect<void, PlatformError | ParseResult.ParseError>
+    readonly load: Effect.Effect<void, PlatformError | ParseResult.ParseError>
+    readonly save: Effect.Effect<void, PlatformError | ParseResult.ParseError>
 
     readonly prepend: (todo: Todo.Todo) => Effect.Effect<void>
     readonly replace: (index: number, todo: Todo.Todo) => Effect.Effect<void>
@@ -20,34 +20,31 @@ export class TodosState extends Context.Tag("TodosState")<TodosState, {
 
 
 export const make = (key: string) => Layer.effect(TodosState, Effect.gen(function*() {
-    const todos = yield* SubscriptionRef.make(Chunk.empty<Todo.Todo>())
-
     const readFromLocalStorage = KeyValueStore.KeyValueStore.pipe(
         Effect.flatMap(kv => kv.get(key)),
         Effect.flatMap(identity),
-        Effect.flatMap(Schema.parseJson().pipe(
-            Schema.compose(Schema.Chunk(Todo.TodoFromJson)),
-            Schema.decode,
+        Effect.flatMap(Schema.decode(
+            Schema.compose(Schema.parseJson(), Schema.Chunk(Todo.TodoFromJson))
         )),
-        Effect.flatMap(v => Ref.set(todos, v)),
-
-        Effect.catchTag("NoSuchElementException", () => Ref.set(todos, Chunk.empty())),
-
+        Effect.catchTag("NoSuchElementException", () => Effect.succeed(Chunk.empty<Todo.Todo>())),
         Effect.provide(BrowserKeyValueStore.layerLocalStorage),
     )
 
-    const saveToLocalStorage = Effect.all([KeyValueStore.KeyValueStore, todos]).pipe(
-        Effect.flatMap(([kv, values]) => values.pipe(
-            Schema.parseJson().pipe(
-                Schema.compose(Schema.Chunk(Todo.TodoFromJson)),
-                Schema.encode,
+    const writeToLocalStorage = (values: Chunk.Chunk<Todo.Todo>) => KeyValueStore.KeyValueStore.pipe(
+        Effect.flatMap(kv => values.pipe(
+            Schema.encode(
+                Schema.compose(Schema.parseJson(), Schema.Chunk(Todo.TodoFromJson))
             ),
             Effect.flatMap(v => kv.set(key, v)),
         )),
-
         Effect.provide(BrowserKeyValueStore.layerLocalStorage),
     )
 
+    const todos = yield* SubscriptionRef.make(yield* readFromLocalStorage)
+
+    const load = Effect.flatMap(readFromLocalStorage, v => Ref.set(todos, v))
+    const save = Effect.flatMap(todos, writeToLocalStorage)
+
     const prepend = (todo: Todo.Todo) => Ref.update(todos, Chunk.prepend(todo))
     const replace = (index: number, todo: Todo.Todo) => Ref.update(todos, Chunk.replace(index, todo))
     const remove = (index: number) => Ref.update(todos, Chunk.remove(index))
@@ -56,12 +53,16 @@ export const make = (key: string) => Layer.effect(TodosState, Effect.gen(functio
 
     // })
 
-    yield* readFromLocalStorage
+    // Sync changes with local storage
+    yield* Effect.forkScoped(todos.changes.pipe(
+        Stream.debounce("500 millis"),
+        Stream.runForEach(writeToLocalStorage),
+    ))
 
     return {
         todos,
-        readFromLocalStorage,
-        saveToLocalStorage,
+        load,
+        save,
         prepend,
         replace,
         remove,