Each machine action is executed twice

[pattirock]

Hi!

I've created a hook and inside, I instantiate my machine, well... al actions are executed twice. This is the base of my hook:

export const useDialer = () => {
  [...]
  const [state, send] = useMachine(DialerMachine);

  const { context, value } = state;
  const { token, device, connection } = context;
  const emitEvent = (type, callConnection) => send(type, { connection: callConnection });

  useEffect(() => {
    send('initDevice', { token });
  }, [token]);

  useEffect(() => {
    if (connection) {
      CONNECTION_EVENT_TYPES.forEach(typeOfEvent => {
        connection.on(typeOfEvent, eventResponse => {
          emitEvent(typeOfEvent, eventResponse);
        });
      });
    }
  }, [connection]);

  useEffect(() => {
    if (device) {
      DEVICES_EVENT_TYPES.forEach(typeOfEvent => {
        device.on(typeOfEvent, callConnection => {
          emitEvent(typeOfEvent, callConnection);
        });
      });
    }
  }, [device]);

  return {
    context,
    send,
  };
};

Does anyone have any idea why?

[Andarist]

Please provide a runnable repro case - it’s hard to tell what might be wrong based on that piece of code alone.

[rjdestigter]

Are you using React strict mode?

[vimtor]

Sorry, @pattirock just went on vacation, we already solved it this morning.
Thanks for making this awesome library ❤️

[davidkpiano]

Awesome, what was your solution?