cha0s/flecks
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(web)!: pass container to @flecks/web/client.up

Browse Source 
Fixes: #9
This commit is contained in:
cha0s 2024-02-07 15:43:08 -06:00
parent 9a0a028d63
commit 1083b41a90
5 changed files with 11 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/react/src/client.js
View File

@ -11,10 +11,8 @@ const debug = D('@flecks/react/client');
export {FlecksContext}; export {FlecksContext};
export const hooks = { export const hooks = {
'@flecks/web/client.up': async (flecks) => { '@flecks/web/client.up': async (container, flecks) => {
const {ssr} = flecks.get('@flecks/react'); const {ssr} = flecks.get('@flecks/react');
const {appMountId} = flecks.get('@flecks/web');
const container = window.document.getElementById(appMountId);
debug('%sing...', ssr ? 'hydrat' : 'render'); debug('%sing...', ssr ? 'hydrat' : 'render');
const RootComponent = React.createElement( const RootComponent = React.createElement(
React.StrictMode, React.StrictMode,

2
packages/redux/src/client/index.js
View File

@ -5,7 +5,7 @@ import localStorageEnhancer from './local-storage';
export const hooks = { export const hooks = {
'@flecks/web/client.up': Flecks.priority( '@flecks/web/client.up': Flecks.priority(
async (flecks) => { async (container, flecks) => {
const slices = await flecks.invokeMergeUniqueAsync('@flecks/redux.slices'); const slices = await flecks.invokeMergeUniqueAsync('@flecks/redux.slices');
const reducer = await createReducer(flecks, slices); const reducer = await createReducer(flecks, slices);
// Hydrate from server. // Hydrate from server.

2
packages/socket/src/client/index.js
View File

@ -1,7 +1,7 @@
import SocketClient from './socket'; import SocketClient from './socket';
export const hooks = { export const hooks = {
'@flecks/web/client.up': async (flecks) => { '@flecks/web/client.up': async (container, flecks) => {
const socket = new SocketClient(flecks); const socket = new SocketClient(flecks);
flecks.socket.client = socket; flecks.socket.client = socket;
await socket.connect(); await socket.connect();

5
packages/web/build/flecks.hooks.js
View File

@ -1,9 +1,12 @@
export const hooks = { export const hooks = {
/** /**
* Define sequential actions to run when the client comes up. * Define sequential actions to run when the client comes up.
*
* @param {Element} container The root DOM element of the application.
*
* @invoke SequentialAsync * @invoke SequentialAsync
*/ */
'@flecks/web/client.up': async () => { '@flecks/web/client.up': async (container) => {
await youCanDoAsyncThingsHere(); await youCanDoAsyncThingsHere();
}, },
/** /**

6
packages/web/src/server/build/entry.js
View File

@ -56,8 +56,10 @@ const {version} = require('@flecks/web/package.json');
try { try {
const flecks = await Flecks.from(runtime); const flecks = await Flecks.from(runtime);
window.flecks = flecks; window.flecks = flecks;
await flecks.invokeSequentialAsync('@flecks/web/client.up'); const containerId = `#${config['@flecks/web'].appMountId}`;
const appMountContainerId = `#${config['@flecks/web'].appMountId}-container`; const container = window.document.querySelector(containerId);
await flecks.invokeSequentialAsync('@flecks/web/client.up', container);
const appMountContainerId = `${containerId}-container`;
window.document.querySelector(appMountContainerId).style.display = 'block'; window.document.querySelector(appMountContainerId).style.display = 'block';
debug('up!'); debug('up!');
} }