UI acp migratoin: Decouple desktop UI types from generated OpenAPI types (Part 2) (#10149)

ui/desktop/src/acp/providers.ts

@@ -6,8 +6,7 @@ import type {
   ProviderTemplateCatalogEntryDto,
   ProviderTemplateDto,
 } from '@aaif/goose-sdk';
-import type { ProviderDetails, ThinkingEffort } from '../api';
-import type { UpdateCustomProviderRequest } from '../types/providers';
+import type { ProviderDetails, ThinkingEffort, UpdateCustomProviderRequest } from '../types/providers';
 import { getAcpClient } from './acpConnection';
 
 export type { CanonicalModelInfoDto, ProviderSecretDto };

ui/desktop/src/components/ConfigContext.tsx

@@ -9,8 +9,8 @@ import {
 } from '../acp/extensions';
 import { pruneDeprecatedBundledExtensions, syncBundledExtensions } from './settings/extensions';
 import { nameToKey } from './settings/extensions/utils';
-import type { ConfigResponse, ProviderDetails } from '../api';
 import type { ExtensionConfig } from '../types/extensions';
+import type { ProviderDetails } from '../types/providers';
 
 export type { ExtensionConfig } from '../types/extensions';
 
@@ -20,8 +20,10 @@ export type FixedExtensionEntry = ExtensionConfig & {
   configKey?: string;
 };
 
+type ConfigMap = Record<string, unknown>;
+
 interface ConfigContextType {
-  config: ConfigResponse['config'];
+  config: ConfigMap;
   providersList: ProviderDetails[];
   extensionsList: FixedExtensionEntry[];
   extensionWarnings: string[];
@@ -42,7 +44,7 @@ interface ConfigProviderProps {
 const ConfigContext = createContext<ConfigContextType | undefined>(undefined);
 
 export const ConfigProvider: React.FC<ConfigProviderProps> = ({ children }) => {
-  const [config, setConfig] = useState<ConfigResponse['config']>({});
+  const [config, setConfig] = useState<ConfigMap>({});
   const [providersList, setProvidersList] = useState<ProviderDetails[]>([]);
   const [extensionsList, setExtensionsList] = useState<FixedExtensionEntry[]>([]);
   const [extensionWarnings, setExtensionWarnings] = useState<string[]>([]);

ui/desktop/src/components/ModelAndProviderContext.tsx

@@ -1,7 +1,7 @@
 import React, { createContext, useContext, useState, useEffect, useMemo, useCallback } from 'react';
 import { toastError, toastSuccess } from '../toasts';
 import Model, { getProviderMetadata } from './settings/models/modelInterface';
-import { ProviderMetadata } from '../api';
+import type { ProviderMetadata } from '../types/providers';
 import { acpChatSessionActions, acpChatSessionStore } from '../acp/chatSessionStore';
 import {
   acpReadDefaults,

ui/desktop/src/components/onboarding/ProviderConfigForm.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
-import { ProviderDetails } from '../../api';
 import { acpAuthenticateProvider } from '../../acp/providers';
+import type { ProviderDetails } from '../../types/providers';
 import DefaultProviderSetupForm, {
   ConfigInput,
 } from '../settings/providers/modal/subcomponents/forms/DefaultProviderSetupForm';

ui/desktop/src/components/onboarding/ProviderSelector.tsx

@@ -1,7 +1,6 @@
 import { useState, useEffect, useMemo } from 'react';
-import type { ProviderDetails } from '../../api';
 import { acpCreateCustomProviderFromRequest, acpListProviderDetails } from '../../acp/providers';
-import type { UpdateCustomProviderRequest } from '../../types/providers';
+import type { ProviderDetails, UpdateCustomProviderRequest } from '../../types/providers';
 import { Select } from '../ui/Select';
 import ProviderConfigForm from './ProviderConfigForm';
 import LocalModelPicker from './LocalModelPicker';

ui/desktop/src/components/settings/dictation/DictationSettings.tsx

@@ -1,6 +1,5 @@
 import { useState, useEffect } from 'react';
 import { ChevronDown } from 'lucide-react';
-import { DictationProvider } from '../../../api';
 import { getDictationConfig, DictationProviderStatusEntry } from '../../../acp/dictation';
 import { useConfig } from '../../ConfigContext';
 import { Input } from '../../ui/input';
@@ -10,6 +9,7 @@ import { LocalModelManager } from './LocalModelManager';
 import { MicrophoneSelector } from './MicrophoneSelector';
 import { DICTATION_ALLOWED_PROVIDERS } from '../../../updates';
 import { useFeatures } from '../../../contexts/FeaturesContext';
+import type { DictationProvider } from '../../../types/dictation';
 import {
   DropdownMenu,
   DropdownMenuContent,

ui/desktop/src/components/settings/models/modelInterface.ts

@@ -1,6 +1,6 @@
-import { ProviderDetails, ThinkingEffort } from '../../../api';
 import { listLocalModels } from '../../../acp/local-inference';
 import { acpListProviderDetails, acpListProviderModels } from '../../../acp/providers';
+import type { ProviderDetails, ThinkingEffort } from '../../../types/providers';
 import { errorMessage as getErrorMessage } from '../../../utils/conversionUtils';
 
 export default interface Model {

ui/desktop/src/components/settings/models/subcomponents/SwitchModelModal.tsx

@@ -27,7 +27,7 @@ import Model, {
   getProviderMetadata,
 } from '../modelInterface';
 import { getPredefinedModelsFromEnv, shouldShowPredefinedModels } from '../predefinedModelsUtils';
-import type { ProviderType, ThinkingEffort } from '../../../../api';
+import type { ProviderDetails, ProviderType, ThinkingEffort } from '../../../../types/providers';
 import { trackModelChanged } from '../../../../utils/analytics';
 
 const i18n = defineMessages({
@@ -305,9 +305,7 @@ export const SwitchModelModal = ({
   const [userClearedModel, setUserClearedModel] = useState(false);
   const [providerErrors, setProviderErrors] = useState<Record<string, string>>({});
   const [providerWarnings, setProviderWarnings] = useState<Record<string, string>>({});
-  const [activeProvidersList, setActiveProvidersList] = useState<
-    import('../../../../api').ProviderDetails[]
-  >([]);
+  const [activeProvidersList, setActiveProvidersList] = useState<ProviderDetails[]>([]);
   const fetchedProviders = useRef<Set<string>>(new Set());
   const reasoningRequestId = useRef(0);
   const [thinkingEffort, setThinkingEffort] = useState<ThinkingEffort | null>(null);

ui/desktop/src/components/settings/providers/ProviderGrid.tsx

@@ -2,9 +2,8 @@ import React, { memo, useMemo, useCallback, useState } from 'react';
 import { ProviderCard } from './subcomponents/ProviderCard';
 import CardContainer from './subcomponents/CardContainer';
 import ProviderConfigurationModal from './modal/ProviderConfigurationModal';
-import type { ProviderDetails } from '../../../api';
 import type { CustomProviderConfigDto } from '@aaif/goose-sdk';
-import type { UpdateCustomProviderRequest } from '../../../types/providers';
+import type { ProviderDetails, UpdateCustomProviderRequest } from '../../../types/providers';
 import {
   acpCreateCustomProviderFromRequest,
   acpGetCustomProvider,

ui/desktop/src/components/settings/providers/ProviderSettingsPage.tsx

@@ -4,7 +4,7 @@ import { ScrollArea } from '../../ui/scroll-area';
 import BackButton from '../../ui/BackButton';
 import ProviderGrid from './ProviderGrid';
 import { acpListProviderDetails } from '../../../acp/providers';
-import { ProviderDetails } from '../../../api';
+import type { ProviderDetails } from '../../../types/providers';
 import { createNavigationHandler } from '../../../utils/navigationUtils';
 import { defineMessages, useIntl } from '../../../i18n';
 

ui/desktop/src/components/settings/providers/modal/ProviderConfigurationModal.tsx

@@ -22,7 +22,7 @@ import {
 } from '../../../../acp/providers';
 import { useModelAndProvider } from '../../../ModelAndProviderContext';
 import { AlertTriangle, LogIn } from 'lucide-react';
-import { ProviderDetails } from '../../../../api';
+import type { ProviderDetails } from '../../../../types/providers';
 import { Button } from '../../../../components/ui/button';
 import { errorMessage } from '../../../../utils/conversionUtils';
 import { defineMessages, useIntl } from '../../../../i18n';

ui/desktop/src/components/settings/providers/modal/subcomponents/ProviderSetupActions.tsx

@@ -1,7 +1,7 @@
 import { SyntheticEvent } from 'react';
 import { Button } from '../../../../ui/button';
 import { Trash2, AlertTriangle } from 'lucide-react';
-import { ConfigKey } from '../../../../../api';
+import type { ConfigKey } from '../../../../../types/providers';
 import { defineMessages, useIntl } from '../../../../../i18n';
 
 const i18n = defineMessages({

ui/desktop/src/components/settings/providers/modal/subcomponents/forms/DefaultProviderSetupForm.tsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useMemo, useState, useCallback } from 'react';
 import { Input } from '../../../../../ui/input';
 import { acpReadProviderConfig } from '../../../../../../acp/providers';
-import { ProviderDetails, ConfigKey } from '../../../../../../api';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../../../../../ui/collapsible';
+import type { ConfigKey, ProviderDetails } from '../../../../../../types/providers';
 import { configLabels, configPlaceholders } from '../../../../../../utils/configUtils';
 import { defineMessages, useIntl } from '../../../../../../i18n';
 

ui/desktop/src/components/settings/providers/subcomponents/ProviderCard.tsx

@@ -3,7 +3,7 @@ import CardContainer from './CardContainer';
 import CardHeader from './CardHeader';
 import CardBody from './CardBody';
 import DefaultCardButtons from './buttons/DefaultCardButtons';
-import { ProviderDetails, ProviderMetadata } from '../../../../api';
+import type { ProviderDetails, ProviderMetadata } from '../../../../types/providers';
 import { defineMessages, useIntl } from '../../../../i18n';
 
 const i18n = defineMessages({

ui/desktop/src/components/settings/providers/subcomponents/buttons/DefaultCardButtons.tsx

@@ -1,5 +1,5 @@
 import { ConfigureSettingsButton, RocketButton } from './CardButtons';
-import { ProviderDetails } from '../../../../../api';
+import type { ProviderDetails } from '../../../../../types/providers';
 import { defineMessages, useIntl } from '../../../../../i18n';
 
 const i18n = defineMessages({

ui/desktop/src/hooks/useAudioRecorder.ts

@@ -1,7 +1,7 @@
 import { useState, useRef, useCallback, useEffect } from 'react';
-import { DictationProvider } from '../api';
 import { getDictationConfig, transcribeDictation } from '../acp/dictation';
 import { useConfig } from '../components/ConfigContext';
+import type { DictationProvider } from '../types/dictation';
 import { errorMessage } from '../utils/conversionUtils';
 
 interface UseAudioRecorderOptions {

ui/desktop/src/types/dictation.ts

@@ -0,0 +1 @@
+export type DictationProvider = 'openai' | 'elevenlabs' | 'groq' | 'local';

ui/desktop/src/types/providers.ts

@@ -1,3 +1,49 @@
+export type ProviderType = 'Preferred' | 'Builtin' | 'Declarative' | 'Custom';
+
+export type ThinkingEffort = 'off' | 'low' | 'medium' | 'high' | 'max';
+
+export type ConfigKey = {
+  default?: string | null;
+  device_code_flow?: boolean;
+  name: string;
+  oauth_flow: boolean;
+  primary?: boolean;
+  required: boolean;
+  secret: boolean;
+};
+
+export type ModelInfo = {
+  context_limit: number;
+  currency?: string | null;
+  input_token_cost?: number | null;
+  name: string;
+  output_token_cost?: number | null;
+  reasoning?: boolean;
+  resolved_model?: string | null;
+  supports_cache_control?: boolean | null;
+};
+
+export type ProviderMetadata = {
+  config_keys: ConfigKey[];
+  default_model: string;
+  description: string;
+  display_name: string;
+  fast_model?: string | null;
+  known_models: ModelInfo[];
+  model_doc_link: string;
+  model_selection_hint?: string | null;
+  name: string;
+  setup_steps?: string[];
+};
+
+export type ProviderDetails = {
+  is_configured: boolean;
+  metadata: ProviderMetadata;
+  name: string;
+  provider_type: ProviderType;
+  saved_model?: string | null;
+};
+
 export type UpdateCustomProviderRequest = {
   api_key: string;
   api_url: string;

ui/desktop/src/vite-env.d.ts

@@ -59,7 +59,7 @@ declare global {
       sessionId: string;
     }>;
     responseStyleChanged: CustomEvent;
-    'session-created': CustomEvent<{ session?: import('./api').Session }>;
+    'session-created': CustomEvent<{ session?: import('./types/session').Session }>;
     'session-deleted': CustomEvent<{ sessionId: string }>;
     'session-renamed': CustomEvent<{
       sessionId: string;