Implemented a solution to properly format provider

names in the dropdown menus:

1. Created a formatProviderName utility function in ui/lib/utils.ts that:

-Contains a comprehensive mapping of provider keys to their properly
formatted display names
-Handles current providers like "openai" → "OpenAI" and "lm_studio" → "LM Studio"
-Includes future-proofing for many additional providers like NVIDIA,
OpenRouter, Mistral AI, etc.
-Provides a fallback formatting mechanism for any unknown providers
(replacing underscores with spaces and capitalizing each word)

2. Updated both dropdown menus in the settings page to use this function:

-The Chat Model Provider dropdown now displays properly formatted names
-The Embedding Model Provider dropdown also uses the same formatting

This is a purely aesthetic change that improves the UI by displaying
provider names with proper capitalization and spacing that matches
their official branding. The internal values and functionality remain
unchanged since only the display labels were modified.

The app will now show properly formatted provider names like "OpenAI",
"LM Studio", and "DeepSeek" instead of "Openai", "Lm_studio", and "Deepseek".

ui/app/settings/page.tsx

@@ -2,7 +2,7 @@
 
 import { Settings as SettingsIcon, ArrowLeft, Loader2 } from 'lucide-react';
 import { useEffect, useState } from 'react';
-import { cn } from '@/lib/utils';
+import { cn, formatProviderName } from '@/lib/utils';
 import { Switch } from '@headlessui/react';
 import ThemeSwitcher from '@/components/theme/Switcher';
 import { ImagesIcon, VideoIcon } from 'lucide-react';
@@ -500,9 +500,7 @@ const Page = () => {
                       options={Object.keys(config.chatModelProviders).map(
                         (provider) => ({
                           value: provider,
-                          label:
-                            provider.charAt(0).toUpperCase() +
-                            provider.slice(1),
+                          label: formatProviderName(provider),
                         }),
                       )}
                     />
@@ -642,9 +640,7 @@ const Page = () => {
                       options={Object.keys(config.embeddingModelProviders).map(
                         (provider) => ({
                           value: provider,
-                          label:
-                            provider.charAt(0).toUpperCase() +
-                            provider.slice(1),
+                          label: formatProviderName(provider),
                         }),
                       )}
                     />