minor fix
This commit is contained in:
parent
5c2f7afa5f
commit
14aad071f4
@ -1,6 +1,5 @@
|
||||
<script>
|
||||
import { onMount } from 'svelte';
|
||||
|
||||
export let services;
|
||||
export let store;
|
||||
|
||||
@ -13,6 +12,10 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
{#if $store && $store.pkpWallet.address}
|
||||
<div class="p-12 bg-blue-400">Hello Earth {JSON.stringify($store.pkpWallet.address)}</div>
|
||||
<!-- Only render the div when $store.pkpWallet is defined -->
|
||||
{#if $store}
|
||||
<div class="p-12 bg-blue-400">Hello Earth {$store.pkpWallet.address}</div>
|
||||
{:else}
|
||||
<!-- You can display a loader or placeholder content here -->
|
||||
<div>Loading...</div>
|
||||
{/if}
|
||||
|
@ -27,13 +27,20 @@
|
||||
|
||||
$: layoutStyle = composite?.layout
|
||||
? `
|
||||
grid-template-areas: ${composite.layout.areas};
|
||||
${composite.layout.gap ? `gap: ${composite.layout.gap};` : ''}
|
||||
${composite.layout.columns ? `grid-template-columns: ${composite.layout.columns};` : ''}
|
||||
${composite.layout.rows ? `grid-template-rows: ${composite.layout.rows};` : ''}
|
||||
`
|
||||
grid-template-areas: ${composite.layout.areas};
|
||||
${composite.layout.gap ? `gap: ${composite.layout.gap};` : ''}
|
||||
${composite.layout.columns ? `grid-template-columns: ${composite.layout.columns};` : ''}
|
||||
${composite.layout.rows ? `grid-template-rows: ${composite.layout.rows};` : ''}
|
||||
`
|
||||
: '';
|
||||
|
||||
$: if (composite?.children) {
|
||||
composite.children.forEach((child) => {
|
||||
initializeCompositeState(child);
|
||||
mapAndSubscribe(child);
|
||||
});
|
||||
}
|
||||
|
||||
function initializeCompositeState(child: IComposite) {
|
||||
if (child.id) {
|
||||
child.store = createCompositeStore(child.id, child.store || {});
|
||||
@ -44,10 +51,6 @@ ${composite.layout.rows ? `grid-template-rows: ${composite.layout.rows};` : ''}
|
||||
}
|
||||
}
|
||||
|
||||
$: if (composite && composite.children) {
|
||||
composite.children.forEach(initializeCompositeState);
|
||||
}
|
||||
|
||||
function mapAndSubscribe(component: IComposite) {
|
||||
console.log('Mapping and subscribing for:', component.id);
|
||||
|
||||
@ -80,10 +83,6 @@ ${composite.layout.rows ? `grid-template-rows: ${composite.layout.rows};` : ''}
|
||||
}
|
||||
}
|
||||
|
||||
$: if (composite && composite.children) {
|
||||
composite.children.forEach(mapAndSubscribe);
|
||||
}
|
||||
|
||||
async function getComponent(componentName: string) {
|
||||
if (components[componentName]) {
|
||||
const module = await components[componentName]();
|
||||
@ -112,18 +111,13 @@ ${composite.layout.rows ? `grid-template-rows: ${composite.layout.rows};` : ''}
|
||||
}
|
||||
return loadedServices;
|
||||
}
|
||||
// Additional utility function to get component and service props
|
||||
|
||||
async function loadComponentAndService(component: IComposite) {
|
||||
return await Promise.all([getComponent(component.component), getServiceProps(component)]);
|
||||
}
|
||||
</script>
|
||||
|
||||
<div
|
||||
class={composite?.layout
|
||||
? `grid w-full h-full ${composite.layout.tailwindClasses}`
|
||||
: 'grid w-full h-full'}
|
||||
style={layoutStyle}
|
||||
>
|
||||
<div class={`grid w-full h-full ${composite?.layout?.tailwindClasses || ''}`} style={layoutStyle}>
|
||||
{#if composite && 'component' in composite}
|
||||
{#await loadComponentAndService(composite) then [Component, serviceProps]}
|
||||
{#if Component}
|
||||
@ -141,7 +135,7 @@ ${composite.layout.rows ? `grid-template-rows: ${composite.layout.rows};` : ''}
|
||||
|
||||
{#if composite?.children}
|
||||
{#each composite.children as child (child.id)}
|
||||
<div class={`w-full h-full overflow-hidden`} style={`grid-area: ${child.slot}`}>
|
||||
<div class="w-full h-full overflow-hidden" style={`grid-area: ${child.slot}`}>
|
||||
{#await loadComponentAndService(child) then [ChildComponent, childServiceProps]}
|
||||
{#if ChildComponent}
|
||||
<svelte:component
|
||||
|
Loading…
Reference in New Issue
Block a user