Initialize a Xstate Machine with Jotai Atom in Atom Pattern

Sometimes adding initial values through the jotai Provider is not what you want. Provider will create a whole new store with atom values

One way to initialize a state machine inside Jotai is to turn our initial lightAtom into a function createLightAtom. This function will take an initial property that we can pass to createLightMachine when we declare the function. We will then useEffect to initialize our lightMachine.

There is a small limitation with this pattern, the machine is initialized with it's default value and then over ridden with the value we pass in the effect. The initial render will use that default value while the second render will have the value we passed in.