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

Refactor Form
All checks were successful
Lint / lint (push) Successful in 42s
Details

Browse Source
This commit is contained in:
Julien Valverdé
2026-04-24 11:19:24 +02:00
parent 3e78121d26
commit dbf5d00590
6 changed files with 234 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/example/src/lib/form/TextFieldFormInputView.tsx
View File

@@ -13,10 +13,10 @@ export class TextFieldFormInputView extends Component.make("TextFieldFormInputVi
props: TextFieldFormInputView.Props
) {
const input = yield* Form.useInput(props.form, props)
const [issues, isValidating, isSubmitting] = yield* Subscribable.useSubscribables([
const [issues, isValidating, isCommitting] = yield* Subscribable.useSubscribables([
props.form.issues,
props.form.isValidating,
props.form.isSubmitting,
props.form.isCommitting,
])
return (
@@ -24,7 +24,7 @@ export class TextFieldFormInputView extends Component.make("TextFieldFormInputVi
<TextField.Root
value={input.value}
onChange={e => input.setValue(e.target.value)}
disabled={isSubmitting}
disabled={isCommitting}
{...Struct.omit(props, "form")}
>
{isValidating &&

6
packages/example/src/lib/form/TextFieldOptionalFormInputView.tsx
View File

@@ -13,10 +13,10 @@ export class TextFieldOptionalFormInputView extends Component.make("TextFieldOpt
props: TextFieldOptionalFormInputView.Props
) {
const input = yield* Form.useOptionalInput(props.form, props)
const [issues, isValidating, isSubmitting] = yield* Subscribable.useSubscribables([
const [issues, isValidating, isCommitting] = yield* Subscribable.useSubscribables([
props.form.issues,
props.form.isValidating,
props.form.isSubmitting,
props.form.isCommitting,
])
return (
@@ -24,7 +24,7 @@ export class TextFieldOptionalFormInputView extends Component.make("TextFieldOpt
<TextField.Root
value={input.value}
onChange={e => input.setValue(e.target.value)}
disabled={!input.enabled || isSubmitting}
disabled={!input.enabled || isCommitting}
{...Struct.omit(props, "form", "defaultValue")}
>
<TextField.Slot side="left">

6
packages/example/src/routes/form.tsx
View File

@@ -73,8 +73,8 @@ class RegisterFormService extends Effect.Service<RegisterFormService>()("Registe
class RegisterFormView extends Component.make("RegisterFormView")(function*() {
const form = yield* RegisterFormService
const [canSubmit, submitResult] = yield* Subscribable.useSubscribables([
form.form.canSubmit,
const [canCommit, submitResult] = yield* Subscribable.useSubscribables([
form.form.canCommit,
form.form.mutation.result,
])
@@ -111,7 +111,7 @@ class RegisterFormView extends Component.make("RegisterFormView")(function*() {
defaultValue=""
/>
<Button disabled={!canSubmit}>Submit</Button>
<Button disabled={!canCommit}>Submit</Button>
</Flex>
</form>

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

@@ -75,10 +75,10 @@ export class TodoView extends Component.make("TodoView")(function*(props: TodoPr
] as const
}), [props._tag, props._tag === "edit" ? props.id : undefined])
const [index, size, canSubmit] = yield* Subscribable.useSubscribables([
const [index, size, canCommit] = yield* Subscribable.useSubscribables([
indexRef,
state.sizeSubscribable,
form.canSubmit,
form.canCommit,
])
const runSync = yield* Component.useRunSync()
@@ -104,7 +104,7 @@ export class TodoView extends Component.make("TodoView")(function*(props: TodoPr
/>
{props._tag === "new" &&
<Button disabled={!canSubmit} onClick={() => void runPromise(form.submit)}>
<Button disabled={!canCommit} onClick={() => void runPromise(form.submit)}>
Add
</Button>
}