fix(computer-use): hide device settings until the permission group is known

Also gives the local-files e2e settings fixture a QueryClient now that the
Desktop page reads the permission config.

Author: waleedlatif1

apps/desktop/e2e/local-files.spec.ts

@@ -60,6 +60,7 @@ test('native file tools remember folder consent across chats and restarts until
       stdin: {
         contents: `import { createRoot } from 'react-dom/client';
 import { ToastProvider } from '@sim/emcn';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { AppRouterContext } from 'next/dist/shared/lib/app-router-context.shared-runtime';
 import { PathParamsContext } from 'next/dist/shared/lib/hooks-client-context.shared-runtime';
 import { Desktop } from '@/app/workspace/[workspaceId]/settings/components/desktop/desktop';
@@ -70,11 +71,11 @@ const router = { bfcacheId: 'fixture', back: () => history.back(), forward: () =
 createRoot(document.getElementById('settings')).render(
   <AppRouterContext.Provider value={router}>
     <PathParamsContext.Provider value={{ workspaceId: 'fixture' }}>
-      <ToastProvider><SettingsHeaderProvider><SettingsHeaderShell>
+      <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}><ToastProvider><SettingsHeaderProvider><SettingsHeaderShell>
         <FeatureFlagsProvider flags={{ dashboards: false, 'workflow-tests': false, 'mothership-model-selector': false, 'mothership-plan-mode': false }}>
           <SettingsSectionProvider plane='workspace' section='desktop'><Desktop /></SettingsSectionProvider>
         </FeatureFlagsProvider>
-      </SettingsHeaderShell></SettingsHeaderProvider></ToastProvider>
+      </SettingsHeaderShell></SettingsHeaderProvider></ToastProvider></QueryClientProvider>
     </PathParamsContext.Provider>
   </AppRouterContext.Provider>
 );`,

apps/sim/app/workspace/[workspaceId]/settings/components/desktop/computer-use.test.tsx

@@ -20,9 +20,9 @@ const native = vi.hoisted(() => ({
   cancel: vi.fn<() => Promise<void>>(),
   onActivity: vi.fn<(listener: (activity: ComputerUseActivity | null) => void) => () => void>(),
 }))
-const permission = vi.hoisted(() => ({ config: {} as Record<string, unknown> }))
+const permission = vi.hoisted(() => ({ config: {} as Record<string, unknown>, ready: true }))
 vi.mock('@/hooks/use-permission-config', () => ({
-  usePermissionConfig: () => ({ config: permission.config }),
+  usePermissionConfig: () => ({ config: permission.config, isPermissionReady: permission.ready }),
 }))
 vi.mock('@/lib/desktop', () => libDesktopMock)
 
@@ -38,6 +38,7 @@ let container: HTMLDivElement
 
 beforeEach(() => {
   permission.config = { ...DEFAULT_PERMISSION_GROUP_CONFIG }
+  permission.ready = true
   permissions = [...initialPermissions]
   activity = null
   listeners = new Set()
@@ -85,6 +86,13 @@ it.each(['disableComputerUse', 'hideCopilot'])(
   }
 )
 
+it('withholds the device controls until the permission read succeeds', async () => {
+  permission.ready = false
+  await act(async () => renderSettings())
+  expect(appRow('com.example.First')).toBeUndefined()
+  expect(container.querySelector('[role="switch"]')).toBeNull()
+})
+
 function appRow(bundleId: string) {
   return container.querySelector<HTMLElement>(`[title="${bundleId}"]`)?.parentElement
 }

apps/sim/app/workspace/[workspaceId]/settings/components/desktop/computer-use.tsx

@@ -22,7 +22,7 @@ export function ComputerUseSettings() {
 function ComputerUseSettingsControls() {
   const requestVersion = useRef(0)
   const bridge = getDesktopBridge()?.computerUse
-  const { config: permissionConfig } = usePermissionConfig()
+  const { config: permissionConfig, isPermissionReady } = usePermissionConfig()
   const { status, setStatus, refresh, error } = useComputerUseStatus()
   const [apps, setApps] = useState<ComputerUseAppPermission[]>([])
   const [pending, setPending] = useState(false)
@@ -44,6 +44,7 @@ function ComputerUseSettingsControls() {
   }, [refreshApps, status?.activeAction])
   if (
     !bridge ||
+    !isPermissionReady ||
     CAPABILITY_RULES['computer_use.use'].deniedBy(permissionConfig) ||
     status?.supported === false
   )