Thilawyn/effect-fc
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

0.1.3 #4

Merged
Thilawyn merged 90 commits from next into master 2025-08-23 03:07:28 +02:00
Conversation 0 Commits 90 Files Changed 55 +7 -6
2 changed files with 7 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit bbc6ae232d - Show all commits

7
packages/example/src/todo/Todo.tsx
View File

@@ -6,7 +6,7 @@ import { Box, Button, Flex, IconButton } from "@radix-ui/themes"
import { GetRandomValues, makeUuid4 } from "@typed/id" import { GetRandomValues, makeUuid4 } from "@typed/id"
import { Chunk, DateTime, Effect, Match, Option, Ref, Runtime, Schema, SubscriptionRef } from "effect" import { Chunk, DateTime, Effect, Match, Option, Ref, Runtime, Schema, SubscriptionRef } from "effect"
import { Component, Memo } from "effect-fc" import { Component, Memo } from "effect-fc"
import { Hooks, useOnce } from "effect-fc/hooks" import { useMemo, useOnce, useSubscribe } from "effect-fc/hooks"
import { SubscriptionSubRef } from "effect-fc/types" import { SubscriptionSubRef } from "effect-fc/types"
import { FaArrowDown, FaArrowUp } from "react-icons/fa" import { FaArrowDown, FaArrowUp } from "react-icons/fa"
import { FaDeleteLeft } from "react-icons/fa6" import { FaDeleteLeft } from "react-icons/fa6"
@@ -35,7 +35,7 @@ export class Todo extends Component.makeUntraced(function* Todo(props: TodoProps
const runtime = yield* Effect.runtime() const runtime = yield* Effect.runtime()
const state = yield* TodosState const state = yield* TodosState
const [ref, contentRef, completedAtRef] = yield* Hooks.useMemo(() => Match.value(props).pipe( const [ref, contentRef, completedAtRef] = yield* useMemo(() => Match.value(props).pipe(
Match.tag("new", () => Effect.andThen(makeTodo, SubscriptionRef.make)), Match.tag("new", () => Effect.andThen(makeTodo, SubscriptionRef.make)),
Match.tag("edit", ({ index }) => Effect.succeed(SubscriptionSubRef.makeFromChunkRef(state.ref, index))), Match.tag("edit", ({ index }) => Effect.succeed(SubscriptionSubRef.makeFromChunkRef(state.ref, index))),
Match.exhaustive, Match.exhaustive,
@@ -45,9 +45,10 @@ export class Todo extends Component.makeUntraced(function* Todo(props: TodoProps
SubscriptionSubRef.makeFromPath(ref, ["content"]), SubscriptionSubRef.makeFromPath(ref, ["content"]),
SubscriptionSubRef.makeFromPath(ref, ["completedAt"]), SubscriptionSubRef.makeFromPath(ref, ["completedAt"]),
] as const), ] as const),
// eslint-disable-next-line react-hooks/exhaustive-deps
), [props._tag, props.index]) ), [props._tag, props.index])
const [size] = yield* Hooks.useSubscribeRefs(state.sizeRef) const [size] = yield* useSubscribe(state.sizeRef)
const StringTextAreaInputFC = yield* StringTextAreaInput const StringTextAreaInputFC = yield* StringTextAreaInput
const OptionalDateInputFC = yield* OptionalDateInput const OptionalDateInputFC = yield* OptionalDateInput

6
packages/example/src/todo/Todos.tsx
View File

@@ -1,16 +1,16 @@
import { Container, Flex, Heading } from "@radix-ui/themes" import { Container, Flex, Heading } from "@radix-ui/themes"
import { Chunk, Console, Effect } from "effect" import { Chunk, Console, Effect } from "effect"
import { Component } from "effect-fc" import { Component } from "effect-fc"
import { Hooks } from "effect-fc/hooks" import { useOnce, useSubscribe } from "effect-fc/hooks"
import { Todo } from "./Todo" import { Todo } from "./Todo"
import { TodosState } from "./TodosState.service" import { TodosState } from "./TodosState.service"
export class Todos extends Component.makeUntraced(function* Todos() { export class Todos extends Component.makeUntraced(function* Todos() {
const state = yield* TodosState const state = yield* TodosState
const [todos] = yield* Hooks.useSubscribeRefs(state.ref) const [todos] = yield* useSubscribe(state.ref)
yield* Hooks.useOnce(() => Effect.andThen( yield* useOnce(() => Effect.andThen(
Console.log("Todos mounted"), Console.log("Todos mounted"),
Effect.addFinalizer(() => Console.log("Todos unmounted")), Effect.addFinalizer(() => Console.log("Todos unmounted")),
)) ))