mirror/lowdefy
2
0
Fork 0
mirror of https://github.com/lowdefy/lowdefy.git synced 2025-03-31 15:20:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(server): Refine loading in render loop, remove onEnter.

Browse Source 
BREAKING CHANGE
This commit is contained in:
Gervwyk 2022-04-19 19:13:29 +02:00
parent 967ac70078
commit 8c67b986c3
7 changed files with 52 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
packages/server/lib/components/Context.js
View File

@ -24,7 +24,7 @@ const Context = ({ children, config, lowdefy, progress }) => {
return (
<MountEvents
context={context}
parentLoading={false}
ename="onInit"
triggerEvent={async () => {
progress.dispatch({
type: 'increment',
@ -38,7 +38,6 @@ const Context = ({ children, config, lowdefy, progress }) => {
});
},
});
// context._internal.update(); // TODO: do we need this?
context._internal.State.freezeState();
}
}}
@ -56,40 +55,8 @@ const Context = ({ children, config, lowdefy, progress }) => {
}}
>
{(loadingOnInit) => {
return (
<MountEvents
context={context}
parentLoading={loadingOnInit}
triggerEvent={async () =>
await context._internal.RootBlocks.areas.root.blocks[0].triggerEvent({
name: 'onEnter',
progress: () => {
progress.dispatch({
type: 'increment',
});
},
})
}
triggerEventAsync={() => {
const onEnterAsync = async () => {
await context._internal.RootBlocks.areas.root.blocks[0].triggerEvent({
name: 'onEnterAsync', // TODO: Do we want this to happen in the background, as in not effecting progress bar?
progress: () => {
progress.dispatch({
type: 'increment',
});
},
});
progress.dispatch({
type: 'done',
});
};
onEnterAsync();
}}
>
{(loadingOnEnter) => children(context, loadingOnEnter)}
</MountEvents>
);
if (loadingOnInit) return '';
return children(context);
}}
</MountEvents>
);

11
packages/server/lib/components/MountEvents.js
View File

@ -16,7 +16,7 @@
import React, { useEffect, useState } from 'react';
const MountEvents = ({ children, context, parentLoading, triggerEvent, triggerEventAsync }) => {
const MountEvents = ({ ename, children, context, triggerEvent, triggerEventAsync }) => {
const [loading, setLoading] = useState(true);
const [error, setError] = useState(null);
useEffect(() => {
@ -32,17 +32,16 @@ const MountEvents = ({ children, context, parentLoading, triggerEvent, triggerEv
setError(err);
}
};
if (!parentLoading) {
mount(); // TODO: check only run once.
}
console.log(ename);
mount(); // TODO: check only run once.
return () => {
mounted = false;
};
}, [context, parentLoading]);
}, [context]);
if (error) throw error;
return <>{children(loading || parentLoading)}</>;
return <>{children(loading)}</>;
};
export default MountEvents;

5
packages/server/lib/components/Page.js
View File

@ -49,7 +49,7 @@ const Page = ({ lowdefy, pageConfig, rootConfig }) => {
content={{
content: (progress) => (
<Context config={pageConfig} lowdefy={lowdefy} progress={progress}>
{(context, loading) => {
{(context) => {
return (
<>
<Head
@ -60,7 +60,8 @@ const Page = ({ lowdefy, pageConfig, rootConfig }) => {
Blocks={context._internal.RootBlocks}
context={context}
lowdefy={lowdefy}
parentLoading={loading}
progress={progress}
parentLoading={false}
/>
</>
);

35
packages/server/lib/components/block/Block.js
View File

@ -21,19 +21,44 @@ import { ErrorBoundary } from '@lowdefy/block-utils';
import CategorySwitch from './CategorySwitch.js';
import MountEvents from '../MountEvents.js';
const Block = ({ block, Blocks, context, loading, lowdefy, parentLoading }) => {
const Block = ({
block,
Blocks,
context,
lowdefy,
parentLoading,
progress = { dispatch: () => {} },
}) => {
const [updates, setUpdate] = useState(0);
lowdefy._internal.updaters[block.id] = () => setUpdate(updates + 1);
return (
<ErrorBoundary>
<MountEvents
context={context}
parentLoading={parentLoading}
ename={`${block.id}-onMount`}
triggerEvent={async () => {
await block.triggerEvent({ name: 'onMount' });
await block.triggerEvent({
name: 'onMount',
progress: () => {
progress.dispatch({
type: 'increment',
});
},
});
}}
triggerEventAsync={() => {
block.triggerEvent({ name: 'onMountAsync' });
block.triggerEvent({
name: 'onMountAsync',
progress: () => {
progress.dispatch({
type: 'increment',
});
},
});
progress.dispatch({
type: 'done',
});
}}
>
{(eventLoading) => (
@ -41,7 +66,7 @@ const Block = ({ block, Blocks, context, loading, lowdefy, parentLoading }) => {
block={block}
Blocks={Blocks}
context={context}
loading={eventLoading || loading || block.eval.loading}
loading={eventLoading || parentLoading || block.eval.loading}
lowdefy={lowdefy}
updates={updates}
/>

2
packages/server/lib/components/block/Container.js
View File

@ -44,7 +44,7 @@ const Container = ({ block, Blocks, Component, context, loading, lowdefy }) => {
Blocks={Blocks.subBlocks[block.id][0]}
block={bl}
context={context}
loading={loading}
parentLoading={loading}
lowdefy={lowdefy}
/>
))}

2
packages/server/lib/components/block/List.js
View File

@ -44,7 +44,7 @@ const List = ({ block, Blocks, Component, context, loading, lowdefy }) => {
Blocks={SBlock}
block={bl}
context={context}
loading={loading}
parentLoading={loading}
lowdefy={lowdefy}
/>
))}

18
packages/server/lib/components/block/LoadingBlock.js
View File

@ -22,15 +22,15 @@ import LoadingList from './LoadingList.js';
const blockMethods = {
makeCssClass,
moveItemDown: () => null,
moveItemUp: () => null,
pushItem: () => null,
registerEvent: () => null,
registerMethod: () => null,
removeItem: () => null,
setValue: () => null,
triggerEvent: () => null,
unshiftItem: () => null,
moveItemDown: () => {},
moveItemUp: () => {},
pushItem: () => {},
registerEvent: () => {},
registerMethod: () => {},
removeItem: () => {},
setValue: () => {},
triggerEvent: () => {},
unshiftItem: () => {},
};
const LoadingBlock = ({ blockLayout, blockId, context, lowdefy, skeleton }) => {