refactor: cleanup todomvc

examples/todomvc/src/application.ts

@@ -1,9 +1,6 @@
-import * as Context from "@typed/context"
-import * as RefArray from "@typed/fx/RefArray"
-import * as RefSubject from "@typed/fx/RefSubject"
+import { Context, RefArray, RefSubject } from "@typed/core"
 import * as Effect from "effect/Effect"
 import * as Option from "effect/Option"
-
 import * as Domain from "./domain"
 
 /* #region Services */

examples/todomvc/src/index.ts

@@ -1,22 +1,18 @@
+import { fromWindow } from "@typed/core"
 import { Storage } from "@typed/dom/Storage"
-import * as Navigation from "@typed/navigation"
-import * as Router from "@typed/router"
-import { renderLayer, RenderQueue, renderToLayer } from "@typed/template"
+import { renderToLayer } from "@typed/template"
 import { Effect, Layer } from "effect"
 import { Live } from "./infrastructure"
 import { TodoApp } from "./presentation"
 
 const environment = Live.pipe(
   Layer.provideMerge(Storage.layer(localStorage)),
-  Layer.provideMerge(Router.browser),
-  Layer.provideMerge(Navigation.fromWindow),
-  Layer.provideMerge(renderLayer(window)),
-  Layer.provideMerge(RenderQueue.mixed({ timeout: 2000 }))
+  Layer.provideMerge(fromWindow(window))
 )
 
 TodoApp.pipe(
   renderToLayer,
+  Layer.provide(environment),
   Layer.launch,
-  Effect.provide(environment),
   Effect.runFork
 )

examples/todomvc/src/infrastructure.ts

@@ -1,8 +1,6 @@
 import * as S from "@effect/schema/Schema"
+import { Fx, Route, Router } from "@typed/core"
 import { SchemaStorage } from "@typed/dom/Storage"
-import * as Fx from "@typed/fx/Fx"
-import * as Route from "@typed/route"
-import * as Router from "@typed/router"
 import { Effect, Layer, pipe } from "effect"
 import * as App from "./application"
 import * as Domain from "./domain"
@@ -30,8 +28,8 @@ const writeTodos = Fx.tapEffect(App.TodoList, (list) => todos.set(list).pipe(Eff
 /* #region Routing */
 
 const allRoute = Route.home
-const activeRoute = Route.literal("/active")
-const completedRoute = Route.literal("/completed")
+const activeRoute = Route.literal("active")
+const completedRoute = Route.literal("completed")
 
 // Expose conversion to route for the UI
 export const filterStateToPath = (state: Domain.FilterState) => {

examples/todomvc/src/presentation.ts

@@ -1,10 +1,7 @@
 import "./styles.css"
 
-import * as Fx from "@typed/fx/Fx"
-import * as RefSubject from "@typed/fx/RefSubject"
-import { EventHandler, html, many } from "@typed/template"
-import { Link } from "@typed/ui/Link"
-import { Effect } from "effect"
+import { EventHandler, Fx, html, Link, many, RefSubject } from "@typed/core"
+import { Boolean, Effect } from "effect"
 import * as App from "./application"
 import * as Domain from "./domain"
 import * as Infra from "./infrastructure"
@@ -49,7 +46,7 @@ export const TodoApp = html`<section class="todoapp ${App.FilterState}">
     App.SomeAreCompleted,
     {
       onTrue: html`<button class="clear-completed" onclick="${App.clearCompletedTodos}">Clear completed</button>`,
-      onFalse: Fx.succeed(null)
+      onFalse: Fx.null
     }
   )
 }
@@ -91,7 +88,7 @@ function TodoItem(todo: RefSubject.RefSubject<Domain.Todo>, id: Domain.TodoId) {
           onclick="${App.toggleTodoCompleted(id)}"
         />
 
-        <label ondblclick="${RefSubject.update(isEditing, (x) => !x)}">${text}</label>
+        <label ondblclick="${RefSubject.update(isEditing, Boolean.not)}">${text}</label>
 
         <button class="destroy" onclick="${App.deleteTodo(id)}"></button>
       </div>
@@ -100,7 +97,7 @@ function TodoItem(todo: RefSubject.RefSubject<Domain.Todo>, id: Domain.TodoId) {
         class="edit"
         .value="${text}"
         oninput="${EventHandler.target<HTMLInputElement>()((ev) => updateText(ev.target.value))}"
-        onfocusout="${EventHandler.make(() => submit)}"
+        onfocusout="${submit}"
         onkeydown="${onEnterOrEscape((ev) => (ev.key === "Enter" ? submit : reset))}"
       />
     </li>`