Phase 18: Complete elimination of TS7053 index signature errors

ui/desktop/src/components/settings/ProviderSetupModal.tsx

@@ -29,7 +29,7 @@ export function ProviderSetupModal({
   const [configValues, setConfigValues] = React.useState<{ [key: string]: string }>(
     default_key_value
   );
-  const requiredKeys = required_keys[provider] || ['API Key'];
+  const requiredKeys = (required_keys as Record<string, string[]>)[provider] || ['API Key'];
   const headerText = title || `Setup ${provider}`;
 
   const shouldShowBattle = React.useMemo(() => {

ui/desktop/src/components/settings/models/ProviderButtons.tsx

@@ -8,10 +8,10 @@ import { useModel } from './ModelContext';
 import { useHandleModelSelection } from './utils';
 
 // Create a mapping from provider name to href
-const providerLinks = model_docs_link.reduce((acc, { name, href }) => {
+const providerLinks: Record<string, string> = model_docs_link.reduce((acc, { name, href }) => {
   acc[name] = href;
   return acc;
-}, {});
+}, {} as Record<string, string>);
 
 export function ProviderButtons() {
   const { activeKeys } = useActiveKeys();

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

@@ -62,7 +62,7 @@ function BaseProviderCard({
   onTakeoff,
   showTakeoff,
 }: BaseProviderCardProps) {
-  const numRequiredKeys = required_keys[name]?.length || 0;
+  const numRequiredKeys = (required_keys as Record<string, string[]>)[name]?.length || 0;
   const tooltipText = numRequiredKeys === 1 ? `Add ${name} API Key` : `Add ${name} API Keys`;
 
   return (
@@ -254,7 +254,7 @@ export function BaseProviderGrid({
   return (
     <div className="grid grid-cols-[repeat(auto-fill,_minmax(140px,_1fr))] gap-3 [&_*]:z-20">
       {providers.map((provider) => {
-        const hasRequiredKeys = required_keys[provider.name]?.length > 0;
+        const hasRequiredKeys = (required_keys as Record<string, string[]>)[provider.name]?.length > 0;
         return (
           <BaseProviderCard
             key={provider.id}

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

@@ -88,7 +88,7 @@ export function ConfigureProvidersGrid() {
     const provider = providers.find((p) => p.id === selectedForSetup)?.name;
     if (!provider) return;
 
-    const requiredKeys = required_keys[provider];
+    const requiredKeys = (required_keys as Record<string, string[]>)[provider];
     if (!requiredKeys || requiredKeys.length === 0) {
       console.error(`No keys found for provider ${provider}`);
       return;

ui/desktop/src/components/settings_v2/providers/modal/ProviderConfiguationModal.tsx

@@ -13,19 +13,19 @@ import { useConfig } from '../../../ConfigContext';
 import { AlertTriangle } from 'lucide-react';
 import { getCurrentModelAndProvider } from '../../models'; // Import the utility
 
-const customSubmitHandlerMap = {
+const customSubmitHandlerMap: Record<string, unknown> = {
   provider_name: OllamaSubmitHandler, // example
 };
 
-const customFormsMap = {
+const customFormsMap: Record<string, unknown> = {
   provider_name: OllamaForm, // example
 };
 
 export default function ProviderConfigurationModal() {
-  const [validationErrors, setValidationErrors] = useState({});
+  const [validationErrors, setValidationErrors] = useState<Record<string, string>>({});
   const { upsert, remove, read } = useConfig(); // Add read to the destructured values
   const { isOpen, currentProvider, modalProps, closeModal } = useProviderModal();
-  const [configValues, setConfigValues] = useState({});
+  const [configValues, setConfigValues] = useState<Record<string, unknown>>({});
   const [showDeleteConfirmation, setShowDeleteConfirmation] = useState(false);
   const [isActiveProvider, setIsActiveProvider] = useState(false); // New state for tracking active provider
 
@@ -65,7 +65,7 @@ export default function ProviderConfigurationModal() {
 
     // Validation logic
     const parameters = currentProvider.metadata.config_keys || [];
-    const errors = {};
+    const errors: Record<string, string> = {};
 
     // Check required fields
     parameters.forEach((parameter) => {

ui/desktop/src/components/settings_v2/providers/modal/subcomponents/ProviderLogo.tsx

@@ -8,7 +8,7 @@ import OpenRouterLogo from './icons/openrouter@3x.png';
 import DefaultLogo from './icons/default@3x.png';
 
 // Map provider names to their logos
-const providerLogos = {
+const providerLogos: Record<string, string> = {
   openai: OpenAILogo,
   anthropic: AnthropicLogo,
   google: GoogleLogo,