diff --git a/packages/client/src/Client.js b/packages/client/src/Client.js index 49cf5c390..119ea8553 100644 --- a/packages/client/src/Client.js +++ b/packages/client/src/Client.js @@ -23,16 +23,30 @@ import ProgressBarController from './ProgressBarController.js'; import initLowdefyContext from './initLowdefyContext.js'; -const Client = ({ Components, config, router, stage, types, window }) => { - const lowdefy = initLowdefyContext({ Components, config, router, types, stage, window }); +const Client = ({ + Components, + config, + resetContext = { reset: false, setReset: () => undefined }, + router, + stage, + types, + window, +}) => { + const lowdefy = initLowdefyContext({ Components, config, router, stage, types, window }); return ( <> - + {(context) => { if (!context._internal.onInitDone) return ''; return ( diff --git a/packages/client/src/Context.js b/packages/client/src/Context.js index 4b4e2fc97..e2ed968f9 100644 --- a/packages/client/src/Context.js +++ b/packages/client/src/Context.js @@ -19,8 +19,8 @@ import getContext from '@lowdefy/engine'; import MountEvents from './MountEvents.js'; -const Context = ({ children, config, lowdefy }) => { - const context = getContext({ config, lowdefy }); +const Context = ({ children, config, lowdefy, resetContext }) => { + const context = getContext({ config, lowdefy, resetContext }); return ( const [error, setError] = useState(null); useEffect(() => { let mounted = true; + setLoading(true); const mount = async () => { try { await triggerEvent(); diff --git a/packages/client/src/ProgressBarController.js b/packages/client/src/ProgressBarController.js index a9b3cd6c1..c8cf83d30 100644 --- a/packages/client/src/ProgressBarController.js +++ b/packages/client/src/ProgressBarController.js @@ -44,12 +44,17 @@ function reducer(state, action) { progress: state.onMounts - 1 === 0 ? 100 : state.progress, onMounts: state.onMounts - 1, }; + case 'reset': + return { + progress: 0, + onMounts: 0, + }; default: throw new Error('Invalid action type for ProgressBarController reducer.'); } } -const ProgressBarController = ({ id, lowdefy }) => { +const ProgressBarController = ({ id, lowdefy, resetContext }) => { const [state, dispatch] = useReducer(reducer, initialState); const ProgressBar = lowdefy._internal.blockComponents.ProgressBar; lowdefy._internal.progress.state = state; @@ -59,6 +64,9 @@ const ProgressBarController = ({ id, lowdefy }) => { state.progress < 95 && setInterval(() => dispatch({ type: 'auto-increment' }), 500); return () => clearInterval(timer); }, [state]); + if (resetContext.reset && state.progress === 100) { + dispatch({ type: 'reset' }); + } return ( undefined }, +}) { if (!config) { throw new Error('A page must be provided to get context.'); } const { id } = config; - if (lowdefy.contexts[id]) { + if (lowdefy.contexts[id] && !resetContext.reset) { + // memoize context if already created, eg between page transitions, unless the reset flag is raised lowdefy.contexts[id]._internal.update(); return lowdefy.contexts[id]; } - + resetContext.setReset(false); // lower context reset flag. if (!lowdefy.inputs[id]) { lowdefy.inputs[id] = {}; }