Fix webview in dev mode (#7044)

knip.json

@@ -16,7 +16,7 @@
 		},
 		"webview-ui": {
 			"entry": ["src/index.tsx"],
-			"project": ["src/**/*.{ts,tsx}"]
+			"project": ["src/**/*.{ts,tsx}", "../src/shared/*.ts"]
 		},
 		"packages/{build,cloud,evals,ipc,telemetry,types}": {
 			"project": ["src/**/*.ts"]

pnpm-lock.yaml

@@ -896,9 +896,6 @@ importers:
       '@radix-ui/react-tooltip':
         specifier: ^1.1.8
         version: 1.2.6(@types/react-dom@18.3.7(@types/react@18.3.23))(@types/react@18.3.23)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@roo-code/cloud':
-        specifier: ^0.13.0
-        version: 0.13.0
       '@roo-code/types':
         specifier: workspace:^
         version: link:../packages/types

scripts/link-packages.js

@@ -14,13 +14,6 @@ const config = {
 			npmPath: "npm",
 			watchCommand: "pnpm build:development:watch",
 		},
-		{
-			name: "@roo-code/cloud",
-			sourcePath: "../Roo-Code-Cloud/packages/sdk",
-			targetPath: "webview-ui/node_modules/@roo-code/cloud",
-			npmPath: "npm",
-			watchCommand: "pnpm build:development:watch",
-		},
 	],
 }
 

src/shared/cloud.ts

@@ -0,0 +1,8 @@
+import { CloudUserInfo, OrganizationAllowList, ShareVisibility } from "@roo-code/cloud"
+
+export type { CloudUserInfo, OrganizationAllowList, ShareVisibility }
+
+export const ORGANIZATION_ALLOW_ALL: OrganizationAllowList = {
+	allowAll: true,
+	providers: {},
+} as const

webview-ui/package.json

@@ -29,7 +29,6 @@
 		"@radix-ui/react-slider": "^1.2.3",
 		"@radix-ui/react-slot": "^1.1.2",
 		"@radix-ui/react-tooltip": "^1.1.8",
-		"@roo-code/cloud": "^0.13.0",
 		"@roo-code/types": "workspace:^",
 		"@tailwindcss/vite": "^4.0.0",
 		"@tanstack/react-query": "^5.68.0",

webview-ui/src/__mocks__/vscode.ts

@@ -1,18 +0,0 @@
-/**
- * Minimal mock for the vscode module.
- * Used in tests to prevent module resolution errors.
- * The actual vscode API is only available in VS Code extension contexts.
- */
-
-export const window = {
-	showInformationMessage: vi.fn(),
-	showErrorMessage: vi.fn(),
-}
-
-export const env = {
-	openExternal: vi.fn(),
-}
-
-export const Uri = {
-	parse: vi.fn((uri: string) => ({ toString: () => uri })),
-}

webview-ui/src/components/account/AccountView.tsx

@@ -2,7 +2,8 @@ import { useEffect, useRef } from "react"
 import { VSCodeButton } from "@vscode/webview-ui-toolkit/react"
 
 import { TelemetryEventName } from "@roo-code/types"
-import type { CloudUserInfo } from "@roo-code/cloud"
+
+import type { CloudUserInfo } from "@roo/cloud"
 
 import { useAppTranslation } from "@src/i18n/TranslationContext"
 import { useExtensionState } from "@src/context/ExtensionStateContext"

webview-ui/src/components/chat/ShareButton.tsx

@@ -3,7 +3,8 @@ import { useTranslation } from "react-i18next"
 import { SquareArrowOutUpRightIcon } from "lucide-react"
 
 import { type HistoryItem, TelemetryEventName } from "@roo-code/types"
-import type { ShareVisibility } from "@roo-code/cloud"
+
+import type { ShareVisibility } from "@roo/cloud"
 
 import { vscode } from "@/utils/vscode"
 import { telemetryClient } from "@/utils/TelemetryClient"

webview-ui/src/components/settings/ApiConfigManager.tsx

@@ -3,7 +3,8 @@ import { VSCodeTextField } from "@vscode/webview-ui-toolkit/react"
 import { AlertTriangle } from "lucide-react"
 
 import type { ProviderSettingsEntry } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
+
+import type { OrganizationAllowList } from "@roo/cloud"
 
 import { useAppTranslation } from "@/i18n/TranslationContext"
 import {

webview-ui/src/components/settings/ModelPicker.tsx

@@ -4,7 +4,8 @@ import { Trans } from "react-i18next"
 import { ChevronsUpDown, Check, X } from "lucide-react"
 
 import type { ProviderSettings, ModelInfo } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
+
+import type { OrganizationAllowList } from "@roo/cloud"
 
 import { useAppTranslation } from "@src/i18n/TranslationContext"
 import { useSelectedModel } from "@/components/ui/hooks/useSelectedModel"

webview-ui/src/components/settings/providers/Glama.tsx

@@ -2,8 +2,8 @@ import { useCallback } from "react"
 import { VSCodeTextField } from "@vscode/webview-ui-toolkit/react"
 
 import { type ProviderSettings, glamaDefaultModelId } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import type { RouterModels } from "@roo/api"
 
 import { useAppTranslation } from "@src/i18n/TranslationContext"

webview-ui/src/components/settings/providers/IOIntelligence.tsx

@@ -2,7 +2,8 @@ import { useCallback } from "react"
 import { VSCodeTextField } from "@vscode/webview-ui-toolkit/react"
 
 import { type ProviderSettings, ioIntelligenceDefaultModelId, ioIntelligenceModels } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
+
+import type { OrganizationAllowList } from "@roo/cloud"
 
 import { useAppTranslation } from "@src/i18n/TranslationContext"
 import { VSCodeButtonLink } from "@src/components/common/VSCodeButtonLink"

webview-ui/src/components/settings/providers/LiteLLM.tsx

@@ -2,8 +2,8 @@ import { useCallback, useState, useEffect, useRef } from "react"
 import { VSCodeTextField, VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react"
 
 import { type ProviderSettings, litellmDefaultModelId } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import { RouterName } from "@roo/api"
 import { ExtensionMessage } from "@roo/ExtensionMessage"
 

webview-ui/src/components/settings/providers/OpenAICompatible.tsx

@@ -10,8 +10,8 @@ import {
 	azureOpenAiDefaultApiVersion,
 	openAiModelInfoSaneDefaults,
 } from "@roo-code/types"
-import { type OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import { ExtensionMessage } from "@roo/ExtensionMessage"
 
 import { useAppTranslation } from "@src/i18n/TranslationContext"

webview-ui/src/components/settings/providers/OpenRouter.tsx

@@ -4,8 +4,8 @@ import { Checkbox } from "vscrui"
 import { VSCodeTextField } from "@vscode/webview-ui-toolkit/react"
 
 import { type ProviderSettings, openRouterDefaultModelId } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import type { RouterModels } from "@roo/api"
 
 import { useAppTranslation } from "@src/i18n/TranslationContext"

webview-ui/src/components/settings/providers/Requesty.tsx

@@ -2,8 +2,8 @@ import { useCallback, useEffect, useState } from "react"
 import { VSCodeCheckbox, VSCodeTextField } from "@vscode/webview-ui-toolkit/react"
 
 import { type ProviderSettings, requestyDefaultModelId } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import type { RouterModels } from "@roo/api"
 
 import { vscode } from "@src/utils/vscode"

webview-ui/src/components/settings/providers/Unbound.tsx

@@ -3,8 +3,8 @@ import { VSCodeTextField } from "@vscode/webview-ui-toolkit/react"
 import { useQueryClient } from "@tanstack/react-query"
 
 import { type ProviderSettings, unboundDefaultModelId } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import type { RouterModels } from "@roo/api"
 
 import { useAppTranslation } from "@src/i18n/TranslationContext"

webview-ui/src/components/settings/utils/__tests__/organizationFilters.test.ts

@@ -1,5 +1,6 @@
 import type { ModelInfo } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
+
+import type { OrganizationAllowList } from "@roo/cloud"
 
 import { filterProviders, filterModels } from "../organizationFilters"
 

webview-ui/src/components/settings/utils/organizationFilters.ts

@@ -1,5 +1,6 @@
 import type { ProviderName, ModelInfo } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
+
+import type { OrganizationAllowList } from "@roo/cloud"
 
 export const filterProviders = (
 	providers: Array<{ value: string; label: string }>,

webview-ui/src/context/ExtensionStateContext.tsx

@@ -7,7 +7,8 @@ import {
 	type ModeConfig,
 	type ExperimentId,
 } from "@roo-code/types"
-import { type OrganizationAllowList, ORGANIZATION_ALLOW_ALL } from "@roo-code/cloud"
+
+import { type OrganizationAllowList, ORGANIZATION_ALLOW_ALL } from "@roo/cloud"
 
 import { ExtensionMessage, ExtensionState, MarketplaceInstalledMetadata, Command } from "@roo/ExtensionMessage"
 import { findLastIndex } from "@roo/array"

webview-ui/src/utils/__tests__/validate.test.ts

@@ -1,6 +1,6 @@
 import type { ProviderSettings } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import { RouterModels } from "@roo/api"
 
 import { getModelValidationError, validateApiConfigurationExcludingModelErrors } from "../validate"

webview-ui/src/utils/validate.ts

@@ -1,8 +1,8 @@
 import i18next from "i18next"
 
 import type { ProviderSettings } from "@roo-code/types"
-import type { OrganizationAllowList } from "@roo-code/cloud"
 
+import type { OrganizationAllowList } from "@roo/cloud"
 import { isRouterName, RouterModels } from "@roo/api"
 
 export function validateApiConfiguration(

webview-ui/vite.config.ts

@@ -100,7 +100,6 @@ export default defineConfig(({ mode }) => {
 			// Ensure source maps are properly included in the build
 			minify: mode === "production" ? "esbuild" : false,
 			rollupOptions: {
-				external: ["vscode"],
 				output: {
 					entryFileNames: `assets/[name].js`,
 					chunkFileNames: (chunkInfo) => {