From cf44fec8a9790c863e7cc9174b7c1d6135050928 Mon Sep 17 00:00:00 2001 From: Jesse Andrews Date: Tue, 1 Jul 2025 16:39:03 -0700 Subject: [PATCH 1/4] add the charm when you navigate --- packages/charm/src/manager.ts | 2 +- .../jumble/src/components/CommandCenter.tsx | 18 ++++++++++++++---- packages/jumble/src/utils/navigation.ts | 2 +- 3 files changed, 16 insertions(+), 6 deletions(-) diff --git a/packages/charm/src/manager.ts b/packages/charm/src/manager.ts index 893bd5f0b..1b33b1474 100644 --- a/packages/charm/src/manager.ts +++ b/packages/charm/src/manager.ts @@ -251,7 +251,7 @@ export class CharmManager { return this.charms; } - private async add(newCharms: Cell[]) { + async add(newCharms: Cell[]) { await this.syncCharms(this.charms); await this.runtime.idle(); diff --git a/packages/jumble/src/components/CommandCenter.tsx b/packages/jumble/src/components/CommandCenter.tsx index 11767c645..7564b0a6d 100644 --- a/packages/jumble/src/components/CommandCenter.tsx +++ b/packages/jumble/src/components/CommandCenter.tsx @@ -435,8 +435,18 @@ export function CommandCenter() { }); }; - const handleNavigateToCharm = (event: CustomEvent) => { - const { charmId, replicaName } = event.detail || {}; + const handleNavigateToCharm = async (event: CustomEvent) => { + const { charmId, charm, replicaName } = event.detail || {}; + + // If we have a charm object, ensure it's added to the charm manager + if (charm && charmManager) { + try { + await charmManager.add([charm]); + } catch (error) { + console.error("Failed to add charm to manager:", error); + } + } + if (charmId && replicaName) { navigate( createPath("charmShow", { @@ -464,7 +474,7 @@ export function CommandCenter() { globalThis.addEventListener("new-charm-command", handleNewCharmEvent); globalThis.addEventListener( "navigate-to-charm", - handleNavigateToCharm as EventListener, + handleNavigateToCharm as unknown as EventListener, ); return () => { @@ -475,7 +485,7 @@ export function CommandCenter() { ); globalThis.removeEventListener( "navigate-to-charm", - handleNavigateToCharm as EventListener, + handleNavigateToCharm as unknown as EventListener, ); }; }, [focusedCharmId, allCommands, navigate, focusedReplicaId]); diff --git a/packages/jumble/src/utils/navigation.ts b/packages/jumble/src/utils/navigation.ts index 501313c29..9581c226f 100644 --- a/packages/jumble/src/utils/navigation.ts +++ b/packages/jumble/src/utils/navigation.ts @@ -15,7 +15,7 @@ export function navigateToCharm(charm: Cell, replicaName?: string): void { globalThis.dispatchEvent( new CustomEvent("navigate-to-charm", { - detail: { charmId: id, replicaName }, + detail: { charmId: id, charm, replicaName }, }), ); } From 5a901eac5a070f0279ff2a10ba6ccff9446acab3 Mon Sep 17 00:00:00 2001 From: Jesse Andrews Date: Wed, 2 Jul 2025 13:50:24 -0700 Subject: [PATCH 2/4] compiler.tsx was only working once we were creating the charm cells improperly (a second charm would share cells with the first due to cause naming) - additionally navigate shouldn't navigate if it returns undefined --- packages/runner/src/builtins/navigate-to.ts | 4 +++- packages/runner/src/runner.ts | 2 +- recipes/compiler.tsx | 21 ++++++++++++--------- 3 files changed, 16 insertions(+), 11 deletions(-) diff --git a/packages/runner/src/builtins/navigate-to.ts b/packages/runner/src/builtins/navigate-to.ts index f5731cf15..63432270d 100644 --- a/packages/runner/src/builtins/navigate-to.ts +++ b/packages/runner/src/builtins/navigate-to.ts @@ -20,6 +20,8 @@ export function navigateTo( throw new Error("navigateCallback is not set"); } - runtime.navigateCallback(target); + if (target && target.get()) { + runtime.navigateCallback(target); + } }; } diff --git a/packages/runner/src/runner.ts b/packages/runner/src/runner.ts index c24e10c32..6465b4a52 100644 --- a/packages/runner/src/runner.ts +++ b/packages/runner/src/runner.ts @@ -735,7 +735,7 @@ export class Runner implements IRunner { (result: any) => sendValueToBinding(processCell, mappedOutputBindings, result), addCancel, - inputCells, // cause + { inputs: inputsCell, parents: processCell.getDoc() }, processCell, this.runtime, ); diff --git a/recipes/compiler.tsx b/recipes/compiler.tsx index 65367273e..c247e9561 100644 --- a/recipes/compiler.tsx +++ b/recipes/compiler.tsx @@ -55,10 +55,17 @@ const updateCode = handler<{ detail: { value: string } }, { code: string }>( const visit = handler< { detail: { value: string } }, - { result: { [UI]: any; [NAME]: string } } + { code: string } >( (_, state) => { - return navigateTo(state.result); + const { result } = compileAndRun({ + files: [{ name: "/main.tsx", contents: state.code }], + main: "/main.tsx", + }); + + console.log("result", result); + + return navigateTo(result); }, ); @@ -66,15 +73,11 @@ export default recipe( InputSchema, OutputSchema, ({ code }) => { - const { result, error, errors } = compileAndRun({ + const { error, errors } = compileAndRun({ files: [{ name: "/main.tsx", contents: code }], main: "/main.tsx", }); - derive(result, (result) => { - console.log("result", result); - }); - return { [NAME]: "My First Compiler", [UI]: ( @@ -87,9 +90,9 @@ export default recipe( /> {ifElse( error, - 
{error}
, + fix the errors, Navigate To Charm , From 70bdf8098f47d0af5d027ad8f6730d0895723464 Mon Sep 17 00:00:00 2001 From: Jesse Andrews Date: Wed, 2 Jul 2025 13:56:23 -0700 Subject: [PATCH 3/4] event listener should be sync --- packages/jumble/src/components/CommandCenter.tsx | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) diff --git a/packages/jumble/src/components/CommandCenter.tsx b/packages/jumble/src/components/CommandCenter.tsx index 7564b0a6d..17bbca0ac 100644 --- a/packages/jumble/src/components/CommandCenter.tsx +++ b/packages/jumble/src/components/CommandCenter.tsx @@ -435,16 +435,14 @@ export function CommandCenter() { }); }; - const handleNavigateToCharm = async (event: CustomEvent) => { + const handleNavigateToCharm = (event: CustomEvent) => { const { charmId, charm, replicaName } = event.detail || {}; // If we have a charm object, ensure it's added to the charm manager if (charm && charmManager) { - try { - await charmManager.add([charm]); - } catch (error) { - console.error("Failed to add charm to manager:", error); - } + charmManager.add([charm]).catch((err) => { + console.error("Failed to add charm to manager:", err); + }); } if (charmId && replicaName) { @@ -474,7 +472,7 @@ export function CommandCenter() { globalThis.addEventListener("new-charm-command", handleNewCharmEvent); globalThis.addEventListener( "navigate-to-charm", - handleNavigateToCharm as unknown as EventListener, + handleNavigateToCharm as EventListener, ); return () => { @@ -485,7 +483,7 @@ export function CommandCenter() { ); globalThis.removeEventListener( "navigate-to-charm", - handleNavigateToCharm as unknown as EventListener, + handleNavigateToCharm as EventListener, ); }; }, [focusedCharmId, allCommands, navigate, focusedReplicaId]); From 80a401426f0eb7b35e1b0db109aa5376addb4561 Mon Sep 17 00:00:00 2001 From: Jesse Andrews Date: Wed, 2 Jul 2025 13:57:44 -0700 Subject: [PATCH 4/4] charmManager should be part of the effect --- packages/jumble/src/components/CommandCenter.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/jumble/src/components/CommandCenter.tsx b/packages/jumble/src/components/CommandCenter.tsx index 17bbca0ac..827ce01fb 100644 --- a/packages/jumble/src/components/CommandCenter.tsx +++ b/packages/jumble/src/components/CommandCenter.tsx @@ -486,7 +486,7 @@ export function CommandCenter() { handleNavigateToCharm as EventListener, ); }; - }, [focusedCharmId, allCommands, navigate, focusedReplicaId]); + }, [focusedCharmId, allCommands, navigate, focusedReplicaId, charmManager]); const handleBack = () => { if (commandPathIds.length === 1) {