Skip to content

Update atom state in reaction #87

Open
@c01nd01r

Description

Hi!
I've come across a situation where it's necessary to change the state of an atom within a reaction.

type AsyncResource = {
  hasError: Signal<boolean>;
  error: Signal<string>;
}

type NotifyStore = {
  messages: Signal<string[]>
  addMessage: (message) => void
}

const notify: NotifyStore = useNotify();
const asyncResource: AsyncResource = useAsyncResource(() => fetch('/error-response'));

useEffect(() => react('add message', () => {
  if (asyncResource.hasError.value) { 
    notify.addMessage(asyncResource.error.value)
  }
}), [])

When a reaction is triggered, the notify.messages atom gets updated, and execution fails with the error 'cannot change atoms during reaction cycle'.
From what I understand, this behavior corresponds to this test:

it('can not set atom values directly yet', () => {
const a = atom('', 1)
const r = reactor('', () => {
if (a.value < +Infinity) {
a.update((a) => a + 1)
}
})
expect(() => r.start()).toThrowErrorMatchingInlineSnapshot(
`"cannot change atoms during reaction cycle"`
)
})

Are there any workarounds for this situation?

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions