@agent-native/dispatch 0.40.13 → 0.40.14-nightly-20261006033736

package/src/components/layout/Layout.tsx

@@ -101,6 +101,10 @@ import { Link, useLocation, useNavigate } from "react-router";
 import { toast } from "sonner";
 
 import { useIsMobile } from "../../hooks/use-mobile";
+import {
+  filterBuiltInApps,
+  type ConnectedAppSummary,
+} from "../../lib/other-apps";
 import { cn } from "../../lib/utils";
 import { normalizeWorkspaceAppLayout } from "../../lib/workspace-app-layout";
 import {
@@ -108,6 +112,7 @@ import {
   isPathMountedWorkspaceApp,
   isWorkspaceAppVisibleInDefaultLaunchers,
   isWorkspaceSsoApp,
+  mergeChatFirstWorkspaceApps,
   navigateToWorkspaceApp,
   shouldOpenWorkspaceAppInTopWindow,
   workspaceAppIdFromRoute,
@@ -1458,29 +1463,65 @@ function DispatchLayout({
         workspaceAppRouteActive,
     },
   );
-  const chatFirstWorkspaceApps = useMemo(
+  const chatFirstConnectedAppsQuery = useActionQuery<ConnectedAppSummary[]>(
+    "list-connected-agents",
+    {},
+    { enabled: shouldQueryChatFirstApps(isChatRoute, chatFirstMode) },
+  );
+  const chatFirstBuiltinApps = useMemo(
     () =>
-      (chatFirstAppsQuery.data ?? []).filter(
-        (app) =>
-          app.status !== "pending" &&
-          app.archived !== true &&
-          isWorkspaceAppVisibleInDefaultLaunchers(app),
+      filterBuiltInApps(
+        chatFirstConnectedAppsQuery.data ?? [],
+        chatFirstAppsQuery.data ?? [],
       ),
-    [chatFirstAppsQuery.data],
+    [chatFirstAppsQuery.data, chatFirstConnectedAppsQuery.data],
+  );
+  const chatFirstEnabledBuiltinAppIds = useMemo(
+    () => chatFirstBuiltinApps.map((app) => app.id),
+    [chatFirstBuiltinApps],
+  );
+  const chatFirstWorkspaceAppsLoading = chatFirstAppsQuery.isLoading;
+  const chatFirstConnectedAppsLoading = chatFirstConnectedAppsQuery.isLoading;
+  const chatFirstAppsLoading =
+    chatFirstWorkspaceAppsLoading || chatFirstConnectedAppsLoading;
+  const chatFirstAppsFailed = chatFirstAppsQuery.isError;
+  const chatFirstAppsError =
+    chatFirstAppsQuery.error ?? chatFirstConnectedAppsQuery.error;
+  const chatFirstResolvableApps = useMemo(
+    () =>
+      mergeChatFirstWorkspaceApps(
+        chatFirstAppsQuery.data,
+        chatFirstEnabledBuiltinAppIds,
+        chatFirstBuiltinApps.map((app) => ({
+          id: app.id,
+          name: app.name,
+          description: app.description,
+          url: app.homeUrl?.trim() || app.url,
+          source: "builtin" as const,
+        })),
+      ).filter((app) => app.status !== "pending" && app.archived !== true),
+    [
+      chatFirstAppsQuery.data,
+      chatFirstBuiltinApps,
+      chatFirstEnabledBuiltinAppIds,
+    ],
+  );
+  const chatFirstWorkspaceApps = useMemo(
+    () =>
+      chatFirstResolvableApps.filter(isWorkspaceAppVisibleInDefaultLaunchers),
+    [chatFirstResolvableApps],
   );
   const chatFirstAppRegistrations = useMemo<ChatFirstAppRegistration[]>(() => {
-    return (chatFirstAppsQuery.data ?? [])
-      .filter((app) => app.status !== "pending" && app.archived !== true)
-      .map((app) => ({
-        id: app.id,
-        name: app.name,
-        source: app.source ?? "workspace",
-        path: app.path,
-        url: app.url,
-        homePath: app.homePath,
-        enabled: true,
-      }));
-  }, [chatFirstAppsQuery.data]);
+    return chatFirstResolvableApps.map((app) => ({
+      id: app.id,
+      name: app.name,
+      source: app.source ?? "workspace",
+      path: app.path,
+      url: app.url,
+      homePath: app.homePath,
+      enabled: true,
+    }));
+  }, [chatFirstResolvableApps]);
   const chatFirstAppItems = useMemo<ChatFirstAppItem[]>(
     () =>
       chatFirstWorkspaceApps.map((app) => ({
@@ -1496,6 +1537,14 @@ function DispatchLayout({
       const registration = chatFirstAppRegistrations.find(
         (candidate) => candidate.id.toLowerCase() === app.id.toLowerCase(),
       );
+      if (registration?.source === "builtin") {
+        const directHref = workspaceAppDirectHref(
+          registration,
+          workspaceAppTargetPath(registration),
+        );
+        if (directHref) navigateToWorkspaceApp(directHref);
+        return;
+      }
       const hasWorkspaceRoute = Boolean(registration?.path?.trim());
       if (!hasWorkspaceRoute) {
         if (registration) {
@@ -1523,16 +1572,19 @@ function DispatchLayout({
   const chatHomeAppLauncher = useMemo<DispatchWorkspaceAppLauncher>(
     () => ({
       workspaceApps: chatFirstWorkspaceApps,
-      isLoading: chatFirstAppsQuery.isLoading,
-      error: chatFirstAppsQuery.isError ? chatFirstAppsQuery.error : undefined,
+      isLoading: chatFirstAppsLoading,
+      error: chatFirstAppsError,
       openApp: openChatFirstApp,
-      retry: () => void chatFirstAppsQuery.refetch(),
+      retry: () => {
+        void chatFirstAppsQuery.refetch();
+        void chatFirstConnectedAppsQuery.refetch();
+      },
     }),
     [
-      chatFirstAppsQuery.error,
-      chatFirstAppsQuery.isError,
-      chatFirstAppsQuery.isLoading,
+      chatFirstAppsError,
+      chatFirstAppsLoading,
       chatFirstAppsQuery.refetch,
+      chatFirstConnectedAppsQuery.refetch,
       chatFirstWorkspaceApps,
       openChatFirstApp,
     ],
@@ -1540,6 +1592,8 @@ function DispatchLayout({
   const chatFirstCopy = useMemo(() => createDispatchChatFirstCopy(t), [t]);
   const [chatFirstPane, setChatFirstPane] =
     useState<DispatchChatFirstPane | null>(null);
+  const [pendingChatFirstPaneRestore, setPendingChatFirstPaneRestore] =
+    useState<DispatchChatFirstPane | null>(null);
   const [chatFirstNotice, setChatFirstNotice] = useState<string | null>(null);
   const chatFirstSessionWatch = useChatFirstSessionWatch();
   const chatFirstSurfaceTabs = useChatFirstSurfaceTabs(chatFirstSurfaceScope);
@@ -1731,18 +1785,6 @@ function DispatchLayout({
   );
   const resolveChatFirstOpenApp = useCallback(
     (detail: ChatFirstOpenAppDetail) => {
-      if (chatFirstAppsQuery.isLoading) {
-        pendingChatFirstOpenAppRef.current = detail;
-        return;
-      }
-      if (chatFirstAppsQuery.isError) {
-        pendingChatFirstOpenAppRef.current = null;
-        setChatFirstNotice(
-          "Workspace apps could not be loaded, so the requested app was not opened.",
-        );
-        return;
-      }
-
       const resolution = resolveChatFirstAppTarget(
         detail,
         chatFirstAppRegistrations,
@@ -1751,11 +1793,29 @@ function DispatchLayout({
             typeof window === "undefined" ? undefined : window.location.origin,
         },
       );
-      pendingChatFirstOpenAppRef.current = null;
       if (resolution.status === "unresolved") {
+        if (
+          chatFirstWorkspaceAppsLoading ||
+          (resolution.reason === "unknown-app" && chatFirstConnectedAppsLoading)
+        ) {
+          pendingChatFirstOpenAppRef.current = detail;
+          return;
+        }
+        if (chatFirstConnectedAppsQuery.isError) {
+          pendingChatFirstOpenAppRef.current = detail;
+          return;
+        }
+        pendingChatFirstOpenAppRef.current = null;
+        if (chatFirstAppsFailed) {
+          setChatFirstNotice(
+            "Workspace apps could not be loaded, so the requested app was not opened.",
+          );
+          return;
+        }
         setChatFirstNotice(chatFirstResolutionMessage(resolution.reason));
         return;
       }
+      pendingChatFirstOpenAppRef.current = null;
       if (isDispatchWorkspaceAppId(resolution.target.appId)) {
         closeChatFirstSessionWatch();
         chatFirstSurfaceTabsStore.closeAll();
@@ -1773,8 +1833,10 @@ function DispatchLayout({
     },
     [
       chatFirstAppRegistrations,
-      chatFirstAppsQuery.isError,
-      chatFirstAppsQuery.isLoading,
+      chatFirstAppsFailed,
+      chatFirstWorkspaceAppsLoading,
+      chatFirstConnectedAppsLoading,
+      chatFirstConnectedAppsQuery.isError,
       chatFirstSurfaceTabsStore,
       openChatFirstPane,
       navigate,
@@ -1850,6 +1912,7 @@ function DispatchLayout({
       chatFirstSurfaceTabsStore.closeAll();
       setChatFirstNotice(null);
       pendingChatFirstOpenAppRef.current = null;
+      setPendingChatFirstPaneRestore(null);
       chatFirstPaneHydratedRef.current = false;
       return;
     }
@@ -1870,13 +1933,7 @@ function DispatchLayout({
   ]);
 
   useEffect(() => {
-    if (
-      !chatFirstMode ||
-      !isChatRoute ||
-      chatFirstPaneHydratedRef.current ||
-      chatFirstAppsQuery.isLoading ||
-      chatFirstAppsQuery.isError
-    ) {
+    if (!chatFirstMode || !isChatRoute || chatFirstPaneHydratedRef.current) {
       return;
     }
     chatFirstPaneHydratedRef.current = true;
@@ -1885,25 +1942,7 @@ function DispatchLayout({
     void readClientAppState<unknown>(CHAT_FIRST_PANE_STATE_KEY)
       .then((value) => {
         if (!active) return;
-        const persisted = persistedChatFirstPane(value);
-        if (!persisted) return;
-        const resolution = resolveChatFirstAppTarget(
-          {
-            app: persisted.appId,
-            path: persisted.path,
-            view: persisted.view,
-          },
-          chatFirstAppRegistrations,
-          {
-            currentOrigin:
-              typeof window === "undefined"
-                ? undefined
-                : window.location.origin,
-          },
-        );
-        if (resolution.status === "ready") {
-          openChatFirstPane(resolution.target, persisted.placement);
-        }
+        setPendingChatFirstPaneRestore(persistedChatFirstPane(value));
       })
       .catch(() => {
         if (active) {
@@ -1915,14 +1954,56 @@ function DispatchLayout({
     return () => {
       active = false;
     };
+  }, [chatFirstMode, chatFirstPane, chatFirstSurfaceScope, isChatRoute]);
+
+  useEffect(() => {
+    if (!chatFirstMode || !isChatRoute || !pendingChatFirstPaneRestore) return;
+    if (chatFirstPane) {
+      setPendingChatFirstPaneRestore(null);
+      return;
+    }
+    const resolution = resolveChatFirstAppTarget(
+      {
+        app: pendingChatFirstPaneRestore.appId,
+        path: pendingChatFirstPaneRestore.path,
+        view: pendingChatFirstPaneRestore.view,
+      },
+      chatFirstAppRegistrations,
+      {
+        currentOrigin:
+          typeof window === "undefined" ? undefined : window.location.origin,
+      },
+    );
+    if (resolution.status === "ready") {
+      setPendingChatFirstPaneRestore(null);
+      openChatFirstPane(
+        resolution.target,
+        pendingChatFirstPaneRestore.placement,
+      );
+      return;
+    }
+    if (
+      chatFirstWorkspaceAppsLoading ||
+      (resolution.status === "unresolved" &&
+        resolution.reason === "unknown-app" &&
+        chatFirstConnectedAppsLoading) ||
+      chatFirstAppsFailed ||
+      chatFirstConnectedAppsQuery.isError
+    ) {
+      return;
+    }
+    setPendingChatFirstPaneRestore(null);
   }, [
-    chatFirstAppsQuery.isError,
-    chatFirstAppsQuery.isLoading,
+    chatFirstAppsFailed,
     chatFirstAppRegistrations,
+    chatFirstWorkspaceAppsLoading,
+    chatFirstConnectedAppsLoading,
+    chatFirstConnectedAppsQuery.isError,
     chatFirstMode,
     chatFirstPane,
     isChatRoute,
     openChatFirstPane,
+    pendingChatFirstPaneRestore,
   ]);
 
   useEffect(() => {
@@ -1933,6 +2014,7 @@ function DispatchLayout({
     persistChatFirstPane(null);
     setChatFirstNotice(null);
     pendingChatFirstOpenAppRef.current = null;
+    setPendingChatFirstPaneRestore(null);
     chatFirstPaneHydratedRef.current = true;
     chatFirstSurfaceTabsStore.closeAll();
     setChatFirstSurfacePanelOpen(false);
@@ -1983,12 +2065,15 @@ function DispatchLayout({
 
   useEffect(() => {
     const pending = pendingChatFirstOpenAppRef.current;
-    if (!pending || chatFirstAppsQuery.isLoading) return;
+    if (!pending) return;
     resolveChatFirstOpenApp(pending);
   }, [
     chatFirstAppsQuery.data,
-    chatFirstAppsQuery.isError,
-    chatFirstAppsQuery.isLoading,
+    chatFirstAppsFailed,
+    chatFirstWorkspaceAppsLoading,
+    chatFirstConnectedAppsLoading,
+    chatFirstConnectedAppsQuery.data,
+    chatFirstConnectedAppsQuery.isError,
     resolveChatFirstOpenApp,
   ]);
 
@@ -2165,7 +2250,9 @@ function DispatchLayout({
         return renderChatFirstAppSurfaceTab({
           registration,
           embedPath: tab.path ?? registration?.path ?? "/",
-          loading: chatFirstAppsQuery.isLoading,
+          loading:
+            !registration &&
+            (chatFirstWorkspaceAppsLoading || chatFirstConnectedAppsLoading),
           isMobileSurface,
           copy: chatFirstCopy,
         });
@@ -2235,7 +2322,8 @@ function DispatchLayout({
       chatFirstAgentsQuery.error,
       chatFirstAgentsQuery.isError,
       chatFirstAgentsQuery.isLoading,
-      chatFirstAppsQuery.isLoading,
+      chatFirstWorkspaceAppsLoading,
+      chatFirstConnectedAppsLoading,
       chatFirstCopy,
       chatFirstSessionWatch.target,
       chatFirstSurfaceTabs.activeTabId,
@@ -2553,11 +2641,9 @@ function DispatchLayout({
                   chatFirstAppLayout={chatFirstAppLayout}
                   onChatFirstAppLayoutChange={persistChatFirstAppLayout}
                   chatFirstApps={chatFirstAppItems}
-                  chatFirstAppsLoading={chatFirstAppsQuery.isLoading}
+                  chatFirstAppsLoading={chatFirstAppsLoading}
                   chatFirstAppsError={
-                    chatFirstAppsQuery.isError
-                      ? chatFirstCopy("appsLoadError")
-                      : null
+                    chatFirstAppsError ? chatFirstCopy("appsLoadError") : null
                   }
                   chatFirstActiveAppId={chatFirstActiveAppId}
                   chatFirstActivePrimaryTab={chatFirstActivePrimaryTab}
@@ -2571,7 +2657,10 @@ function DispatchLayout({
                     setSidebarCollapsed(true);
                     openChatFirstApp(app);
                   }}
-                  onChatFirstAppsRetry={() => void chatFirstAppsQuery.refetch()}
+                  onChatFirstAppsRetry={() => {
+                    void chatFirstAppsQuery.refetch();
+                    void chatFirstConnectedAppsQuery.refetch();
+                  }}
                   collapsible
                   onCollapsedChange={setSidebarCollapsed}
                 />
@@ -2600,11 +2689,9 @@ function DispatchLayout({
                     chatFirstAppLayout={chatFirstAppLayout}
                     onChatFirstAppLayoutChange={persistChatFirstAppLayout}
                     chatFirstApps={chatFirstAppItems}
-                    chatFirstAppsLoading={chatFirstAppsQuery.isLoading}
+                    chatFirstAppsLoading={chatFirstAppsLoading}
                     chatFirstAppsError={
-                      chatFirstAppsQuery.isError
-                        ? chatFirstCopy("appsLoadError")
-                        : null
+                      chatFirstAppsError ? chatFirstCopy("appsLoadError") : null
                     }
                     chatFirstActiveAppId={chatFirstActiveAppId}
                     chatFirstActivePrimaryTab={chatFirstActivePrimaryTab}
@@ -2614,9 +2701,10 @@ function DispatchLayout({
                       setChatFirstSurfacePanelOpen(false);
                     }}
                     onChatFirstAppOpen={openChatFirstApp}
-                    onChatFirstAppsRetry={() =>
-                      void chatFirstAppsQuery.refetch()
-                    }
+                    onChatFirstAppsRetry={() => {
+                      void chatFirstAppsQuery.refetch();
+                      void chatFirstConnectedAppsQuery.refetch();
+                    }}
                     onNavigate={() => setMobileOpen(false)}
                   />
                 </div>

package/src/components/layout/workspace-apps-rail.spec.tsx

@@ -7,6 +7,10 @@ import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 const clientState = vi.hoisted(() => ({
   actions: [] as string[],
 }));
+const navigation = vi.hoisted(() => ({
+  navigate: vi.fn(() => true),
+  shouldOpenInTopWindow: vi.fn(() => false),
+}));
 
 vi.mock("@agent-native/core/client/hooks", () => ({
   useActionQuery: (action: string) => {
@@ -25,12 +29,18 @@ vi.mock("@agent-native/core/client/hooks", () => ({
             ]
           : [
               {
-                id: "internal-app",
-                name: "Internal app",
-                url: "https://internal.example.test",
-                homeUrl: "https://internal.example.test",
+                id: "clips",
+                name: "Clips",
+                url: "https://clips.agent-native.com",
+                homeUrl: "https://clips.agent-native.com",
                 source: "builtin",
               },
+              {
+                id: "remote-tool",
+                name: "Remote tool",
+                url: "https://remote.example.test",
+                source: "custom",
+              },
             ],
       isError: false,
     };
@@ -42,6 +52,12 @@ vi.mock("@agent-native/core/client/i18n", () => ({
     values?.defaultValue ?? "Workspace apps",
 }));
 
+vi.mock("../../lib/workspace-apps", async (importOriginal) => ({
+  ...(await importOriginal<typeof import("../../lib/workspace-apps")>()),
+  navigateToWorkspaceApp: navigation.navigate,
+  shouldOpenWorkspaceAppInTopWindow: navigation.shouldOpenInTopWindow,
+}));
+
 import { WorkspaceAppsRail } from "./workspace-apps-rail";
 
 describe("WorkspaceAppsRail", () => {
@@ -51,6 +67,8 @@ describe("WorkspaceAppsRail", () => {
   beforeEach(() => {
     vi.stubGlobal("IS_REACT_ACT_ENVIRONMENT", true);
     clientState.actions = [];
+    navigation.navigate.mockClear();
+    navigation.shouldOpenInTopWindow.mockReturnValue(false);
     container = document.createElement("div");
     document.body.appendChild(container);
     root = createRoot(container);
@@ -62,7 +80,7 @@ describe("WorkspaceAppsRail", () => {
     vi.unstubAllGlobals();
   });
 
-  it("lists mounted workspace apps without connected agents", async () => {
+  it("lists mounted apps and configured first-party apps, not custom agents", async () => {
     await act(async () => {
       root.render(
         <MemoryRouter initialEntries={["/overview"]}>
@@ -72,8 +90,52 @@ describe("WorkspaceAppsRail", () => {
     });
 
     expect(container.textContent).toContain("Reports");
-    expect(container.textContent).not.toContain("Internal app");
+    expect(container.textContent).toContain("Clips");
+    expect(container.textContent).not.toContain("Remote tool");
     expect(container.querySelector('a[href="/apps/reports"]')).not.toBeNull();
-    expect(clientState.actions).toEqual(["list-workspace-apps"]);
+    expect(
+      [...container.querySelectorAll("a")].map((link) =>
+        link.getAttribute("href"),
+      ),
+    ).toEqual(["https://clips.agent-native.com/home", "/apps/reports"]);
+    expect(clientState.actions).toEqual([
+      "list-workspace-apps",
+      "list-connected-agents",
+    ]);
+  });
+
+  it("routes built-in apps through the host window on unmodified clicks", async () => {
+    navigation.shouldOpenInTopWindow.mockReturnValue(true);
+    await act(async () => {
+      root.render(
+        <MemoryRouter initialEntries={["/overview"]}>
+          <WorkspaceAppsRail />
+        </MemoryRouter>,
+      );
+    });
+
+    const link = container.querySelector<HTMLAnchorElement>(
+      'a[href^="https://clips.agent-native.com"]',
+    );
+    expect(link?.getAttribute("href")).toBe(
+      "https://clips.agent-native.com/home",
+    );
+    const click = new MouseEvent("click", { bubbles: true, cancelable: true });
+    link?.dispatchEvent(click);
+
+    expect(navigation.navigate).toHaveBeenCalledWith(
+      "https://clips.agent-native.com/home",
+    );
+    expect(click.defaultPrevented).toBe(true);
+
+    const modifiedClick = new MouseEvent("click", {
+      bubbles: true,
+      cancelable: true,
+      ctrlKey: true,
+    });
+    link?.dispatchEvent(modifiedClick);
+
+    expect(navigation.navigate).toHaveBeenCalledTimes(1);
+    expect(modifiedClick.defaultPrevented).toBe(false);
   });
 });

package/src/components/layout/workspace-apps-rail.tsx

@@ -1,11 +1,18 @@
 import { useActionQuery } from "@agent-native/core/client/hooks";
 import { useT } from "@agent-native/core/client/i18n";
 import { IconApps } from "@tabler/icons-react";
+import type { MouseEvent } from "react";
 import { Link, useLocation } from "react-router";
 
+import {
+  filterBuiltInApps,
+  type ConnectedAppSummary,
+} from "../../lib/other-apps";
 import { cn } from "../../lib/utils";
 import {
   isWorkspaceAppVisibleInDefaultLaunchers,
+  navigateToWorkspaceApp,
+  shouldOpenWorkspaceAppInTopWindow,
   workspaceAppIdFromRoute,
   workspaceAppRoute,
   workspaceAppHref,
@@ -22,7 +29,7 @@ function appLabel(app: WorkspaceAppSummary): string {
   return app.name.trim() || app.id;
 }
 
-type RailApp = WorkspaceAppSummary;
+type RailApp = WorkspaceAppSummary & { external?: boolean };
 
 export function WorkspaceAppsRail({
   collapsed = false,
@@ -39,17 +46,34 @@ export function WorkspaceAppsRail({
       includeAgentCards: false,
     },
   );
+  const connectedAppsQuery = useActionQuery<ConnectedAppSummary[]>(
+    "list-connected-agents",
+    {},
+  );
   if (appsQuery.isError || !appsQuery.data) return null;
 
-  const apps: RailApp[] = appsQuery.data
-    .filter(
+  const workspaceApps = appsQuery.data;
+  const apps: RailApp[] = [
+    ...workspaceApps.filter(
       (app) =>
         isWorkspaceAppVisibleInDefaultLaunchers(app) &&
         !app.archived &&
         app.status !== "pending" &&
         !!workspaceAppHref(app),
-    )
-    .sort((a, b) => appLabel(a).localeCompare(appLabel(b)));
+    ),
+    ...filterBuiltInApps(connectedAppsQuery.data ?? [], workspaceApps).map(
+      (app) => ({
+        id: app.id,
+        name: app.name,
+        description: app.description,
+        path: "",
+        url: app.homeUrl?.trim() || app.url,
+        status: "ready" as const,
+        source: "builtin" as const,
+        external: true,
+      }),
+    ),
+  ].sort((a, b) => appLabel(a).localeCompare(appLabel(b)));
 
   if (apps.length === 0) return null;
 
@@ -62,7 +86,21 @@ export function WorkspaceAppsRail({
     const linkProps = {
       "aria-current": active ? ("page" as const) : undefined,
       "aria-label": collapsed ? label : undefined,
-      onClick: onNavigate,
+      onClick: (event: MouseEvent<HTMLAnchorElement>) => {
+        onNavigate?.();
+        if (
+          !app.external ||
+          event.button !== 0 ||
+          event.metaKey ||
+          event.ctrlKey ||
+          event.shiftKey ||
+          event.altKey ||
+          !shouldOpenWorkspaceAppInTopWindow()
+        ) {
+          return;
+        }
+        if (navigateToWorkspaceApp(href)) event.preventDefault();
+      },
       className: cn(
         "flex h-9 items-center rounded-md text-sm transition-colors",
         collapsed ? "w-9 justify-center" : "w-full gap-2 px-2 text-start",
@@ -82,7 +120,11 @@ export function WorkspaceAppsRail({
         {!collapsed ? <span className="truncate">{label}</span> : null}
       </>
     );
-    const link = (
+    const link = app.external ? (
+      <a href={href} {...linkProps}>
+        {linkContent}
+      </a>
+    ) : (
       <Link to={workspaceAppRoute(app.id)} {...linkProps}>
         {linkContent}
       </Link>