Generated by XState Viz: https://xstate.js.org/viz

machine.js

  const fetchMachine = Machine({
            id : 'RefineSearch',
            initial : 'idle',
            states : {
                idle : {
                    on : {
                        "" : [
                            { target : "isDone", cond : './hasInsurers' },
                            { target : "load" },
                        ]
                    },
                },
                load : {
                    invoke : {
                        src : [
                            "./prefetch",
                            "./setupData"
                        ],
                        onDone : 'isDone',
                        onError : console.log,
                    },
                },
                isDone : {
                    initial : 'idle',
                    states : {
                        idle : {
                            on : {
                                updateFilter : {target:"updateFilter", actions: './setDirty'},
                                reset : "reset",
                            },
                        },
                        updateFilter : {
                            entry : './touch',
                            on : {
                                updateFilter : {target:"updateFilter", actions: './setDirty'},
                                reset : "reset",
                            },
                            after : {
                                1000 : 'fetch',
                            },
                        },
                        reset : {
                            entry : './reset',
                            after : { 100 : [
                                { target:"fetch", cond : './isDirty' },
                                { target:"idle" },
                            ]}
                        },
                        fetch : {
                            after : { 0 : "idle" }
                        }
                    }
                },
            }
        }, {
          
          guards : {
            "./hasInsurers" : () => {},
            "./isDirty" : () => true,
            
          }
        });