refactor: refactored LLM Providers: Adapting Modular Approach (#832)

* refactor: Refactoring Providers to have providers as modules

* updated package and lock file

* added grok model back

* updated registry system

app/components/chat/BaseChat.tsx

@@ -160,6 +160,7 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
       }
 
       initializeModelList({ apiKeys: parsedApiKeys, providerSettings }).then((modelList) => {
+        console.log('Model List: ', modelList);
         setModelList(modelList);
       });
 
@@ -359,7 +360,7 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
                       modelList={modelList}
                       provider={provider}
                       setProvider={setProvider}
-                      providerList={providerList || PROVIDER_LIST}
+                      providerList={providerList || (PROVIDER_LIST as ProviderInfo[])}
                       apiKeys={apiKeys}
                     />
                     {(providerList || []).length > 0 && provider && (

app/components/chat/Chat.client.tsx

@@ -122,7 +122,7 @@ export const ChatImpl = memo(
     });
     const [provider, setProvider] = useState(() => {
       const savedProvider = Cookies.get('selectedProvider');
-      return PROVIDER_LIST.find((p) => p.name === savedProvider) || DEFAULT_PROVIDER;
+      return (PROVIDER_LIST.find((p) => p.name === savedProvider) || DEFAULT_PROVIDER) as ProviderInfo;
     });
 
     const { showChat } = useStore(chatStore);

app/components/chat/ModelSelector.tsx

@@ -1,6 +1,6 @@
 import type { ProviderInfo } from '~/types/model';
-import type { ModelInfo } from '~/utils/types';
 import { useEffect } from 'react';
+import type { ModelInfo } from '~/lib/modules/llm/types';
 
 interface ModelSelectorProps {
   model?: string;