Skip to content

CT-518 add charm on navigateTo in jumble #1343

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Jul 2, 2025
Merged

CT-518 add charm on navigateTo in jumble #1343

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
cf44fec
add the charm when you navigate
anotherjesse Jul 1, 2025
5a901ea
compiler.tsx was only working once
anotherjesse Jul 2, 2025
70bdf80
event listener should be sync
anotherjesse Jul 2, 2025
80a4014
charmManager should be part of the effect
anotherjesse Jul 2, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/charm/src/manager.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -251,7 +251,7 @@ export class CharmManager {
return this.charms;
}

private async add(newCharms: Cell<Charm>[]) {
Copy link
Contributor Author

@anotherjesse anotherjesse Jul 2, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jsantell given your (upcoming) work on internal charm apis/functions, this should probably be considered

an action in jumble can mean "actually, you know this charm, plz remember it for me!)

async add(newCharms: Cell<Charm>[]) {
await this.syncCharms(this.charms);
await this.runtime.idle();

Expand Down
12 changes: 10 additions & 2 deletions packages/jumble/src/components/CommandCenter.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -436,7 +436,15 @@ export function CommandCenter() {
};

const handleNavigateToCharm = (event: CustomEvent) => {
const { charmId, replicaName } = event.detail || {};
const { charmId, charm, replicaName } = event.detail || {};

// If we have a charm object, ensure it's added to the charm manager
if (charm && charmManager) {
charmManager.add([charm]).catch((err) => {
console.error("Failed to add charm to manager:", err);
});
}

if (charmId && replicaName) {
navigate(
createPath("charmShow", {
Expand Down Expand Up @@ -478,7 +486,7 @@ export function CommandCenter() {
handleNavigateToCharm as EventListener,
);
};
}, [focusedCharmId, allCommands, navigate, focusedReplicaId]);
}, [focusedCharmId, allCommands, navigate, focusedReplicaId, charmManager]);

const handleBack = () => {
if (commandPathIds.length === 1) {
Expand Down
2 changes: 1 addition & 1 deletion packages/jumble/src/utils/navigation.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export function navigateToCharm(charm: Cell<any>, replicaName?: string): void {

globalThis.dispatchEvent(
new CustomEvent("navigate-to-charm", {
detail: { charmId: id, replicaName },
detail: { charmId: id, charm, replicaName },
}),
);
}
4 changes: 3 additions & 1 deletion packages/runner/src/builtins/navigate-to.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ export function navigateTo(
throw new Error("navigateCallback is not set");
}

runtime.navigateCallback(target);
if (target && target.get()) {
Copy link
Contributor

@cubic-dev-ai cubic-dev-ai bot Jul 2, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The check target.get() assumes that target is an object with a get method, but there is no type guard to ensure target has a get function. This could throw a runtime error if target is not the expected type.

Suggested change
if (target && target.get()) {
if (target && typeof target.get === 'function' && target.get()) {

runtime.navigateCallback(target);
}
};
}
2 changes: 1 addition & 1 deletion packages/runner/src/runner.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
);
Expand Down
21 changes: 12 additions & 9 deletions recipes/compiler.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,26 +55,29 @@ 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);
},
);

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]: (
Expand All @@ -87,9 +90,9 @@ export default recipe(
/>
{ifElse(
error,
<pre>{error}</pre>,
<b>fix the errors</b>,
<common-button
onClick={visit({ result })}
onClick={visit({ code })}
>
Navigate To Charm
</common-button>,
Expand Down