Feature/Dynamic OpenAI compatible model fetching on front page

[crazyrabbit0]

Dynamic OpenAI-Compatible Model Fetching on Front Page

Context

This PR implements dynamic model fetching for OpenAI-compatible providers on the front page. Previously, users had to open model provider settings to view all available models. With this change, Kilo Code now automatically queries the provider's /models endpoint to retrieve available models on the front page whenever the configuration is updated, providing a more seamless and responsive experience. This is especially useful for local providers like LM Studio, Ollama, or custom OpenAI-compatible gateways where the available models frequently change.

Implementation

The solution involves both frontend and backend changes to fetch and propagate model lists:

• Backend (Extension Host): Added a new message handler for requestOpenAiModels that uses the provider's base URL and API key to fetch models from the standard OpenAI-compatible /models endpoint.
• Frontend (Webview):
  • Updated ExtensionStateContext.tsx to include a useDebounce hook that triggers a requestOpenAiModels message whenever the OpenAI configuration (Base URL, API Key, Headers) changes.
  • Modified useProviderModels.ts to consume the openAiModels list from the extension state.
  • Updated getModelsByProvider to transform the fetched string array into ModelRecord objects using sane defaults for model info (context window, cost, etc.).
• State Management: The fetched models are stored in the extension's global state and synchronized with the webview, ensuring they persist across sessions and are available in the model selector UI.

Screenshots

before	after

How to Test

1. Setup an OpenAI-compatible provider
2. Configure Provider: In Kilo Code settings, select "OpenAI" as the provider.
3. Enter Base URL: Provide the base URL for your service (e.g., http://localhost:1234/v1).
4. Verify Fetching:
   • Observe the logs or network traffic to see the request to the /models endpoint.
   • Open the model selector dropdown on the front page in the chat interface.
   • You should see the list of models currently hosted by your provider.
5. Update Provider: Change the models available in your local provider and verify that Kilo Code updates the list (after the debounce period).

[changeset-bot]

🦋 Changeset detected

Latest commit: 23f86a7

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR