Function Fetcher

packages/xstate-react/test/useActor.test.tsx:90–121

({
    onFetch = () => {
      return new Promise((res) => res('some data'));
    },
    persistedState
  })

    onFetch: () => Promise<any>;
    persistedState?: Snapshot<unknown>;
  }> = ({
    onFetch = () => {
      return new Promise((res) => res('some data'));
    },
    persistedState
  }) => {
    const [current, send] = useActor(
      fetchMachine.provide({
        actors: {
          fetchData: fromPromise(onFetch)
        }
      }),
      {
        snapshot: persistedState
      }
    );

    switch (current.value) {
      case 'idle':
        return <button onClick={(_) => send({ type: 'FETCH' })}>Fetch</button>;
      case 'loading':
        return <div>Loading...</div>;
      case 'success':
        return (
          <div>
            Success! Data: <div data-testid="data">{current.context.data}</div>
          </div>
        );
      default:
        return null;
    }
  };

  it('should work with the useActor hook', async () => {
    render(<Fetcher onFetch={() => new Promise((res) => res('fake data'))} />);