Added model selection

app/MindWork AI Studio/Settings/ProviderDialog.razor

@@ -34,6 +34,17 @@
                 InputType="InputType.Password"
                 Validation="@this.ValidatingAPIKey"
             />
+
+            <MudStack Row="@true" AlignItems="AlignItems.Center">
+                <MudButton Variant="Variant.Filled" Size="Size.Small" StartIcon="@Icons.Material.Filled.Refresh" OnClick="this.ReloadModels">Reload</MudButton>
+                <MudSelect @bind-Value="@this.DataModel" Label="Model" Class="mb-3" OpenIcon="@Icons.Material.Filled.FaceRetouchingNatural" AdornmentColor="Color.Info" Adornment="Adornment.Start" Validation="@this.ValidatingModel">
+                    @foreach (var model in this.availableModels)
+                    {
+                        <MudSelectItem Value="@model">@model</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudStack>
+            
         </MudForm>
 
         @if (this.dataIssues.Any())

app/MindWork AI Studio/Settings/ProviderDialog.razor.cs

@@ -35,6 +35,12 @@ public partial class ProviderDialog : ComponentBase
     [Parameter]
     public Providers DataProvider { get; set; } = Providers.NONE;
     
+    /// <summary>
+    /// The LLM model to use, e.g., GPT-4o.
+    /// </summary>
+    [Parameter]
+    public Model DataModel { get; set; }
+    
     /// <summary>
     /// Should the dialog be in editing mode?
     /// </summary>
@@ -61,6 +67,8 @@ public partial class ProviderDialog : ComponentBase
     // We get the form reference from Blazor code to validate it manually:
     private MudForm form = null!;
     
+    private readonly List<Model> availableModels = new();
+
     #region Overrides of ComponentBase
 
     protected override async Task OnInitializedAsync()
@@ -79,7 +87,12 @@ public partial class ProviderDialog : ComponentBase
             // Load the API key:
             var requestedSecret = await this.SettingsManager.GetAPIKey(this.JsRuntime, provider);
             if(requestedSecret.Success)
+            {
                 this.dataAPIKey = requestedSecret.Secret;
+                
+                // Now, we try to load the list of available models:
+                await this.ReloadModels();
+            }
             else
             {
                 this.dataAPIKeyStorageIssue = $"Failed to load the API key from the operating system. The message was: {requestedSecret.Issue}. You might ignore this message and provide the API key again.";
@@ -119,6 +132,7 @@ public partial class ProviderDialog : ComponentBase
             Id = this.DataId,
             InstanceName = this.DataInstanceName,
             UsedProvider = this.DataProvider,
+            Model = this.DataModel,
         };
         
         // We need to instantiate the provider to store the API key:
@@ -144,6 +158,14 @@ public partial class ProviderDialog : ComponentBase
         return null;
     }
     
+    private string? ValidatingModel(Model model)
+    {
+        if (model == default)
+            return "Please select a model.";
+        
+        return null;
+    }
+    
     [GeneratedRegex("^[a-zA-Z0-9 ]+$")]
     private static partial Regex InstanceNameRegex();
     
@@ -185,4 +207,19 @@ public partial class ProviderDialog : ComponentBase
     }
 
     private void Cancel() => this.MudDialog.Cancel();
+
+    private async Task ReloadModels()
+    {
+        var provider = this.DataProvider.CreateProvider(this.DataInstanceName);
+        if(provider is NoProvider)
+            return;
+
+        var models = await provider.GetTextModels(this.JsRuntime, this.SettingsManager);
+        
+        // Order descending by ID means that the newest models probably come first:
+        var orderedModels = models.OrderByDescending(n => n.Id);
+        
+        this.availableModels.Clear();
+        this.availableModels.AddRange(orderedModels);
+    }
 }