Add Request Browser Electron alternative with OpenCode workspace

packages/browseros-agent/apps/app/README.md

@@ -1,8 +1,8 @@
-# BrowserOS Agent Extension
+# Request Browser Extension
 
 [![License: AGPL v3](https://img.shields.io/badge/License-AGPL%20v3-blue.svg)](../../../../LICENSE)
 
-The built-in browser extension that powers BrowserOS's AI interface — new tab with unified search, side panel chat, onboarding, and settings. Built with [WXT](https://wxt.dev) and React.
+The browser extension that powers Request Browser's AI interface — new tab with unified search, side panel chat, onboarding, and settings. Built with [WXT](https://wxt.dev) and React.
 
 > For user-facing feature documentation, see [docs.browseros.com](https://docs.browseros.com).
 

packages/browseros-agent/apps/app/components/chat/ChatProviderSelector.helpers.ts

@@ -1,4 +1,5 @@
 import type { Provider } from './chatComponentTypes'
+import { getProviderDisplayName } from '@/lib/llm-providers/provider-selection'
 
 export interface ProviderOptionGroup {
   key: 'llm' | 'acp'
@@ -17,7 +18,7 @@ export function groupProviderOptions(
       ? [
           {
             key: 'llm' as const,
-            label: 'BrowserOS agent + your LLM',
+            label: 'Request Browser agent + your LLM',
             options: llm,
           },
         ]
@@ -34,7 +35,7 @@ export function getProviderSearchValue(
 ): string {
   return [
     provider.id,
-    provider.name,
+    getProviderDisplayName(provider),
     provider.type,
     groupLabel,
     provider.adapterName,

packages/browseros-agent/apps/app/components/chat/ChatProviderSelector.test.tsx

@@ -39,7 +39,7 @@ describe('groupProviderOptions', () => {
     expect(groupProviderOptions(options)).toEqual([
       {
         key: 'llm',
-        label: 'BrowserOS agent + your LLM',
+        label: 'Request Browser agent + your LLM',
         options: [options[0], options[1]],
       },
       {

packages/browseros-agent/apps/app/components/chat/ChatProviderSelector.tsx

@@ -15,7 +15,9 @@ import {
   PopoverTrigger,
 } from '@/components/ui/popover'
 import { BrowserOSIcon, ProviderIcon } from '@/lib/llm-providers/providerIcons'
+import { getProviderDisplayName } from '@/lib/llm-providers/provider-selection'
 import type { ProviderType } from '@/lib/llm-providers/types'
+import { openDesktopSurface } from '@/lib/browseros/desktop-navigation'
 import { cn } from '@/lib/utils'
 import {
   getProviderSearchValue,
@@ -70,7 +72,7 @@ export const ChatProviderSelector: FC<
                       </span>
                       <span className="min-w-0 flex-1 text-left">
                         <span className="block truncate text-sm">
-                          {provider.name}
+                          {getProviderDisplayName(provider)}
                         </span>
                         {subtitle && (
                           <span className="block truncate text-muted-foreground text-xs">
@@ -91,7 +93,7 @@ export const ChatProviderSelector: FC<
                 type="button"
                 className="flex w-full items-center gap-3 rounded-md p-2 text-muted-foreground text-sm transition-colors hover:bg-accent hover:text-foreground"
                 onClick={() => {
-                  window.open('/app.html#/settings/ai', '_blank')
+                  openDesktopSurface('settings')
                   setOpen(false)
                 }}
               >

packages/browseros-agent/apps/app/components/elements/AppSelector.tsx

@@ -18,6 +18,7 @@ import {
   PopoverTrigger,
 } from '@/components/ui/popover'
 import { MANAGED_MCP_ADDED_EVENT } from '@/lib/constants/analyticsEvents'
+import { openDesktopSurface } from '@/lib/browseros/desktop-navigation'
 import { useMcpServers } from '@/lib/mcp/mcpServerStorage'
 import { track } from '@/lib/metrics/track'
 import { sentry } from '@/lib/sentry/sentry'
@@ -213,10 +214,7 @@ export const AppSelector: FC<AppSelectorProps> = ({
                     <button
                       type="button"
                       onClick={() => {
-                        const appUrl = chrome.runtime.getURL(
-                          '/app.html#/connect-apps',
-                        )
-                        window.open(appUrl, '_blank')
+                        openDesktopSurface('connect-apps')
                         setOpen(false)
                       }}
                       title="Manage apps"

packages/browseros-agent/apps/app/components/layout/AuthLayout.tsx

@@ -6,7 +6,7 @@ export const AuthLayout: FC = () => {
   return (
     <div className="flex min-h-screen flex-col items-center justify-center bg-background p-4">
       <div className="mb-8 flex flex-col items-center">
-        <img src={ProductLogo} alt="BrowserOS" className="size-16" />
+        <img src={ProductLogo} alt="Request Browser" className="size-16" />
       </div>
       <Outlet />
     </div>

packages/browseros-agent/apps/app/components/layout/SidebarLayout.tsx

@@ -62,7 +62,7 @@ export const SidebarLayout: FC = () => {
             >
               <Menu className="size-4" />
             </Button>
-            <span className="font-semibold">BrowserOS</span>
+            <span className="font-semibold">Request Browser</span>
           </header>
           <main className="flex-1 overflow-y-auto">
             <div className="mx-auto max-w-4xl px-4 py-8 sm:px-6 lg:px-8">

packages/browseros-agent/apps/app/components/sidebar/SettingsSidebar.tsx

@@ -71,11 +71,11 @@ const primarySettingsSections: NavSection[] = [
     label: 'Other',
     items: [
       {
-        name: 'Customize BrowserOS',
+        name: 'Customize Request Browser',
         to: '/settings/customization',
         icon: Palette,
       },
-      { name: 'BrowserOS as MCP', to: '/settings/mcp', icon: Server },
+      { name: 'Request Browser as MCP', to: '/settings/mcp', icon: Server },
       {
         name: 'Usage & Billing',
         to: '/settings/usage',
@@ -87,7 +87,11 @@ const primarySettingsSections: NavSection[] = [
 ]
 
 const helpItems: NavItem[] = [
-  { name: 'Docs', href: 'https://docs.browseros.com/', icon: BookOpen },
+  {
+    name: 'Docs',
+    href: 'https://github.com/kreates1994/BrowserOS#readme',
+    icon: BookOpen,
+  },
   { name: 'Features', to: '/onboarding/features', icon: Compass },
   { name: 'Revisit Onboarding', to: '/onboarding', icon: RotateCcw },
 ]

packages/browseros-agent/apps/app/components/sidebar/SidebarBranding.tsx

@@ -68,7 +68,7 @@ export const SidebarBranding: FC<SidebarBrandingProps> = ({
       </div>
     )
   ) : (
-    <img src={ProductLogo} alt="BrowserOS" className="size-8" />
+    <img src={ProductLogo} alt="Request Browser" className="size-8" />
   )
 
   return (
@@ -93,7 +93,7 @@ export const SidebarBranding: FC<SidebarBrandingProps> = ({
                 <span className="truncate font-semibold">
                   {isLoggedIn
                     ? displayName
-                    : selectedFolder?.name || 'BrowserOS'}
+                    : selectedFolder?.name || 'Request Browser'}
                 </span>
                 <ChevronDown className="size-3.5 shrink-0 text-muted-foreground" />
               </div>

packages/browseros-agent/apps/app/components/sidebar/SidebarNavigation.tsx

@@ -1,4 +1,4 @@
-import { CalendarClock, Home, PlugZap, Settings } from 'lucide-react'
+import { Bookmark, CalendarClock, Clock3, Database, Download, Home, PlugZap, Settings } from 'lucide-react'
 import type { FC } from 'react'
 import { NavLink, useLocation } from 'react-router'
 import {
@@ -26,6 +26,10 @@ const primaryNavItems: NavItem[] = [
     to: '/connect-apps',
     icon: PlugZap,
   },
+  { name: 'Workspace', to: '/workspace', icon: Database },
+  { name: 'Bookmarks', to: '/library/bookmarks', icon: Bookmark },
+  { name: 'History', to: '/library/history', icon: Clock3 },
+  { name: 'Downloads', to: '/library/downloads', icon: Download },
   { name: 'Scheduled Tasks', to: '/scheduled', icon: CalendarClock },
   {
     name: 'Settings',

packages/browseros-agent/apps/app/components/sidebar/SidebarUserFooter.tsx

@@ -38,7 +38,7 @@ export const SidebarUserFooter: FC<SidebarUserFooterProps> = ({
 
   const aboutLink = (
     <a
-      href="https://docs.browseros.com/"
+      href="https://github.com/kreates1994/BrowserOS#readme"
       target="_blank"
       rel="noopener noreferrer"
       className="flex h-9 items-center gap-2 overflow-hidden whitespace-nowrap rounded-md px-3 font-medium text-sm transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground"
@@ -50,7 +50,7 @@ export const SidebarUserFooter: FC<SidebarUserFooterProps> = ({
           expanded ? 'opacity-100' : 'opacity-0',
         )}
       >
-        About BrowserOS
+        About Request Browser
       </span>
     </a>
   )
@@ -90,7 +90,7 @@ export const SidebarUserFooter: FC<SidebarUserFooterProps> = ({
         ) : (
           <Tooltip>
             <TooltipTrigger asChild>{aboutLink}</TooltipTrigger>
-            <TooltipContent side="right">About BrowserOS</TooltipContent>
+            <TooltipContent side="right">About Request Browser</TooltipContent>
           </Tooltip>
         )}
       </div>

packages/browseros-agent/apps/app/entrypoints/app/App.tsx

@@ -8,6 +8,7 @@ import { AgentCommandHome } from '@/screens/agent-command/AgentCommandHome'
 import { AgentCommandLayout } from '@/screens/agent-command/AgentCommandLayout'
 import { AISettingsPage } from '@/screens/ai-settings/AISettingsPage'
 import { LoginPage } from '@/screens/auth/LoginPage'
+import { BrowserDataPage } from '@/screens/browser-data/BrowserDataPage'
 import { LogoutPage } from '@/screens/auth/LogoutPage'
 import { ConnectMCP } from '@/screens/connect-mcp/ConnectMCP'
 import { CustomizationPage } from '@/screens/customization/CustomizationPage'
@@ -24,6 +25,7 @@ import { StepsLayout } from '@/screens/onboarding/steps/StepsLayout'
 import { ProfilePage } from '@/screens/profile/ProfilePage'
 import { ScheduledTasksPage } from '@/screens/scheduled-tasks/ScheduledTasksPage'
 import { UsagePage } from '@/screens/usage/UsagePage'
+import { WorkspacePage } from '@/screens/workspace/WorkspacePage'
 
 function getSurveyParams(): { maxTurns?: number; experimentId?: string } {
   const params = new URLSearchParams(window.location.search)
@@ -89,7 +91,9 @@ export const App: FC = () => {
           </Route>
 
           <Route path="connect-apps" element={<ConnectMCP />} />
+          <Route path="workspace" element={<WorkspacePage />} />
           <Route path="scheduled" element={<ScheduledTasksPage />} />
+          <Route path="library/:kind" element={<BrowserDataPage />} />
         </Route>
 
         <Route element={<SettingsSidebarLayout />}>

packages/browseros-agent/apps/app/entrypoints/app/index.html

@@ -3,7 +3,7 @@
     <head>
         <meta charset="UTF-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <title>BrowserOS</title>
+        <title>Request Browser</title>
 
         <meta name="manifest.open_in_tab" content="true" />
         <script type="module">

packages/browseros-agent/apps/app/entrypoints/glow.content/index.ts

@@ -197,32 +197,45 @@ export default defineContentScript({
   matches: ['*://*/*'],
   runAt: 'document_start',
   main() {
-    browser.runtime.onMessage.addListener(
-      (message: GlowMessage, _sender, sendResponse) => {
-        if (
-          typeof message !== 'object' ||
-          !('conversationId' in message) ||
-          !('isActive' in message)
-        ) {
-          return
-        }
+    const handleMessage = (message: GlowMessage): { success: true } | undefined => {
+      if (
+        typeof message !== 'object' ||
+        !('conversationId' in message) ||
+        !('isActive' in message)
+      ) {
+        return
+      }
 
-        if (message.isActive) {
-          activeConversationId = message.conversationId
-          startGlow()
-        } else if (message.conversationId === activeConversationId) {
-          activeConversationId = null
-          stopGlow()
-          if (message.showConfetti) {
-            fireConfetti()
-          }
+      if (message.isActive) {
+        activeConversationId = message.conversationId
+        startGlow()
+      } else if (message.conversationId === activeConversationId) {
+        activeConversationId = null
+        stopGlow()
+        if (message.showConfetti) {
+          fireConfetti()
         }
+      }
 
-        sendResponse({ success: true })
-        return true
+      return { success: true }
+    }
+
+    browser.runtime.onMessage.addListener(
+      (message: GlowMessage, _sender, sendResponse) => {
+        const response = handleMessage(message)
+        if (response) sendResponse(response)
+        return Boolean(response)
       },
     )
 
+    // Request Browser's Electron shell cannot use Chrome's tabs.sendMessage
+    // transport for WebContentsView tabs. The shell forwards the same
+    // payload through the page world as a scoped postMessage event.
+    window.addEventListener('message', (event) => {
+      if (event.source !== window || event.data?.source !== 'request-browser') return
+      handleMessage(event.data.message as GlowMessage)
+    })
+
     window.addEventListener('beforeunload', stopGlow)
 
     document.addEventListener('visibilitychange', () => {

packages/browseros-agent/apps/app/entrypoints/sidepanel/index.html

@@ -3,7 +3,7 @@
     <head>
         <meta charset="UTF-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <title>Default Side Panel Title</title>
+        <title>Request Browser — AI Assistant</title>
     </head>
     <body className="font-sans antialiased">
         <div id="root"></div>

packages/browseros-agent/apps/app/lib/browseros/desktop-navigation.ts

@@ -0,0 +1,33 @@
+type DesktopRoute =
+  | 'connect-apps'
+  | 'settings/ai'
+  | 'settings/usage'
+  | 'settings/chat'
+  | 'settings/mcp'
+  | 'settings/customization'
+  | 'settings/survey'
+  | 'scheduled'
+  | `scheduled?${string}`
+
+/**
+ * Opens an app surface inside the Electron shell when available.
+ * The extension build falls back to opening its normal app route in a tab.
+ */
+export function openDesktopRoute(route: DesktopRoute): void {
+  const runtime = chrome.runtime as typeof chrome.runtime & {
+    openRoute?: (route: DesktopRoute) => Promise<void>
+  }
+
+  if (runtime.openRoute) {
+    void runtime.openRoute(route)
+    return
+  }
+
+  void chrome.tabs.create({
+    url: chrome.runtime.getURL(`app.html#/${route}`),
+  })
+}
+
+export function openDesktopSurface(surface: 'connect-apps' | 'settings'): void {
+  openDesktopRoute(surface === 'connect-apps' ? 'connect-apps' : 'settings/ai')
+}

packages/browseros-agent/apps/app/lib/llm-providers/provider-runtime.ts

@@ -3,6 +3,10 @@ import type { LlmProviderConfig, ProviderType } from './types'
 const localRuntimeProviderTypes: ReadonlySet<ProviderType> = new Set([
   'codex',
   'claude-code',
+  'opencode',
+  'opencode-go',
+  'opencode-zen',
+  'acp-custom',
 ])
 
 /** Identifies provider configs backed by local CLIs instead of HTTP endpoints. */
@@ -12,7 +16,7 @@ export function isLocalRuntimeProviderType(type: ProviderType): boolean {
 
 /**
  * Identifies provider configs that can be sent to the generic chat routes.
- * ACP-backed types (claude-code, codex, acp-custom) are chat-capable: the
+ * ACP-backed types (claude-code, codex, opencode, acp-custom) are chat-capable: the
  * agent server resolves them to an ACP LanguageModelV2 inside streamText.
  */
 export function isChatProviderType(_type: ProviderType): boolean {
@@ -59,7 +63,7 @@ export function resolveChatProvider(
 /**
  * Scheduled tasks and refine-prompt requests go through the hosted
  * BrowserOS `/chat` endpoint and therefore cannot use local-runtime
- * providers (claude-code, codex, acp-custom) which only exist as a
+ * providers (claude-code, codex, opencode, acp-custom) which only exist as a
  * spawned CLI on the user's machine. These helpers explicitly skip
  * those types so the resolver falls back to a cloud-routable provider.
  */