From e1af24186145b8bfa13efeec949e8fa7363dfc02 Mon Sep 17 00:00:00 2001
From: guangyang1206 <guangyang1206@users.noreply.github.com>
Date: Fri, 8 May 2026 12:14:30 +0800
Subject: [PATCH] fix(ide): show toast errors when code view cannot open
 element
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

When 'View in Code' was clicked and the underlying metadata lookup failed
(no active branch, missing branch data, or element metadata not yet indexed),
the IdeManager silently logged console warnings and returned with no user
feedback — leaving users confused about why nothing happened.

Add actionable toast.error() messages for each early-return path so users
receive clear feedback:
- 'no active branch' → prompt to wait for project load
- 'no branch data' → prompt branch data unavailable
- 'no element metadata' → prompt project may still be indexing

Fixes #318
---
 apps/web/client/src/components/store/editor/ide/index.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/apps/web/client/src/components/store/editor/ide/index.ts b/apps/web/client/src/components/store/editor/ide/index.ts
index 41da548c0f..b817b5df2c 100644
--- a/apps/web/client/src/components/store/editor/ide/index.ts
+++ b/apps/web/client/src/components/store/editor/ide/index.ts
@@ -1,4 +1,5 @@
 import { EditorMode, type CodeNavigationTarget } from "@onlook/models";
+import { toast } from "@onlook/ui/sonner";
 import { makeAutoObservable } from "mobx";
 import type { EditorEngine } from "../engine";
 
@@ -19,12 +20,14 @@ export class IdeManager {
             const activeBranchId = this.editorEngine.branches.activeBranch?.id;
             if (!activeBranchId) {
                 console.warn('[IdeManager] No active branch found');
+                toast.error('Cannot open code view — no active branch is loaded yet.');
                 return;
             }
 
             const branchData = this.editorEngine.branches.getBranchDataById(activeBranchId);
             if (!branchData) {
                 console.warn(`[IdeManager] No branch data found for branchId: ${activeBranchId}`);
+                toast.error('Cannot open code view — branch data is unavailable.');
                 return;
             }
 
@@ -32,6 +35,7 @@ export class IdeManager {
             const metadata = await branchData.codeEditor.getJsxElementMetadata(oid);
             if (!metadata) {
                 console.warn(`[IdeManager] No metadata found for OID: ${oid}`);
+                toast.error('Cannot open code view — element metadata not found. The project may still be indexing; try again in a moment.');
                 return;
             }