Skip to content

Instantly share code, notes, and snippets.

@drmikecrowe
Last active September 17, 2020 01:24
Show Gist options
  • Save drmikecrowe/fc81fd0824e53ffa45b386b67cb5144d to your computer and use it in GitHub Desktop.
Save drmikecrowe/fc81fd0824e53ffa45b386b67cb5144d to your computer and use it in GitHub Desktop.
Generated by XState Viz: https://xstate.js.org/viz
const PMachineOptions = {
guards: {
IS_FETCH_NEEDED: function (ctx) {
return !ctx.podcast.loaded;
},
IS_FETCHED_ALREADY: function (ctx) {
return ctx.podcast.loaded;
},
IS_SUBSCRIBE_NEEDED: function (ctx) {
return !ctx.currentDevice.isSubscribed(ctx.podcast);
},
IS_SUBSCRIBED_ALREADY: function (ctx) {
return !!ctx.currentDevice.isSubscribed(ctx.podcast);
},
},
services: {
STATE_FETCHING_SVC: (ctx) =>
new Promise((resolve) =>
setTimeout(() => {
ctx.podcast.loaded = true;
resolve();
}, 2000),
),
STATE_SUBSCRIBING_SVC: (ctx) =>
new Promise((resolve) =>
setTimeout(() => {
ctx.podcast.subscribed = true;
resolve();
}, 2000),
),
STATE_UNSUBSCRIBING_SVC: (ctx) =>
new Promise((resolve) =>
setTimeout(() => {
ctx.podcast.subscribed = false;
resolve();
}, 2000),
),
},
actions: {},
activities: {},
delays: {},
};
const context = {
expanded: false,
currentDevice: {
serialnumber: '',
subscriptions: {},
newVersion: 0,
roles: {},
machines: [],
machineMap: {},
isSubscribed: (podcast) => podcast.subscribed,
},
podcast: {
id: '',
title: '',
author: '',
imageSmall: '',
imageLarge: '',
country: '',
genre: '',
feedUrl: '',
releaseDate: '',
episodes: -1,
type: 'e',
loaded: false,
description: '',
lastTitle: '',
rssFeedData: '',
subscribed: false,
},
};
const machine = {
id: 'PMachine',
initial: 'STATE_IDLE',
context,
states: {
STATE_IDLE: {
on: {
E_TOGGLE_EXPAND: [
{ target: 'STATE_FETCHING', cond: 'IS_FETCH_NEEDED' },
{ target: 'STATE_IDLE', cond: 'IS_FETCHED_ALREADY', actions: 'SET_TOGGLE_EXPANDED' },
],
E_TOGGLE_SUBSCRIBE: [
{ target: 'STATE_SUBSCRIBING', cond: 'IS_SUBSCRIBE_NEEDED' },
{ target: 'STATE_UNSUBSCRIBING', cond: 'IS_SUBSCRIBED_ALREADY' },
],
},
},
STATE_FETCHING: {
invoke: { src: 'STATE_FETCHING_SVC', onDone: { target: 'STATE_IDLE', actions: 'SET_RSS_FEED' } },
},
STATE_SUBSCRIBING: {
invoke: { src: 'STATE_SUBSCRIBING_SVC', onDone: { target: 'STATE_IDLE', actions: 'SET_SUBSCRIBE_STATUS' } },
},
STATE_UNSUBSCRIBING: {
invoke: { src: 'STATE_UNSUBSCRIBING_SVC', onDone: { target: 'STATE_IDLE', actions: 'SET_SUBSCRIBE_STATUS' } },
},
},
};
const m = Machine(machine, PMachineOptions);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment