AI-Studio/app/MindWork AI Studio/Dialogs/ModelComparisonSeriesDialog.razor

@using AIStudio.Assistants.ModelComparison
@using AIStudio.Settings.DataModel
@inherits MSGComponentBase
<MudDialog>
    <DialogContent>
        <MudForm @ref="@this.form" @bind-IsValid="@this.dataIsValid" @bind-Errors="@this.dataIssues" FieldChanged="@this.RevalidateAfterFieldChange">
        @* A dialog does not get the cascading values of the page which opened it, and the model selections need this one: *@
        <CascadingValue Value="Components.MODEL_COMPARISON_ASSISTANT">
            <MudJustifiedText Typo="Typo.body1" Class="mb-3">
                @ModelComparisonSeriesTexts.WhatASeriesIs
            </MudJustifiedText>

            @if (this.BasedOn is not null)
            {
                <MudAlert Severity="Severity.Info" Variant="Variant.Outlined" Class="mb-3">
                    <MudText Typo="Typo.body1">@this.BasedOnText</MudText>
                    @foreach (var part in this.missingParts)
                    {
                        <MudText Typo="Typo.body1" Class="mt-2">@this.MissingPartText(part)</MudText>
                    }
                </MudAlert>
            }

            <MudText Typo="Typo.h6" Class="mb-1">@T("Name")</MudText>
            <MudTextField T="string" @bind-Text="@this.seriesName" Validation="@this.ValidatingSeriesName" Label="@T("Name of the series")" Placeholder="@T("e.g., Weekly reports")" Variant="Variant.Outlined" Immediate="@true" MaxLength="@MAX_NAME_LENGTH" Counter="@MAX_NAME_LENGTH" Class="mb-3"/>

            <MudText Typo="Typo.h6" Class="mb-1 mt-3">@T("Models")</MudText>
            <MudJustifiedText Typo="Typo.body1" Class="mb-2">
                @ModelComparisonSeriesTexts.WhatTheModelsAreFor
            </MudJustifiedText>
            <MudGrid Class="mb-1">
                <MudItem xs="12" lg="6">
                    <MudText Typo="Typo.subtitle1" Class="mb-1">@T("First model")</MudText>
                    <ProviderSelectionWithConfidence ProviderSettings="@this.firstProvider" ProviderSettingsChanged="@this.FirstProviderChanged" ValidateProvider="@this.ValidatingFirstModel"/>
                </MudItem>
                <MudItem xs="12" lg="6">
                    <MudText Typo="Typo.subtitle1" Class="mb-1">@T("Second model")</MudText>
                    <ProviderSelectionWithConfidence ProviderSettings="@this.secondProvider" ProviderSettingsChanged="@this.SecondProviderChanged" ValidateProvider="@this.ValidatingSecondModel"/>
                </MudItem>
            </MudGrid>

            @* The form checks the fields of the judge also while the panel is collapsed: *@
            <CompactExpansionPanel HeaderIcon="@AppIcons.JUDGE" HeaderText="@T("Judge (optional)")" Class="mt-3 mb-3" @bind-Expanded="@this.judgePanelExpanded" KeepContentAlive="@true">
                <MudJustifiedText Typo="Typo.body1" Class="mb-3">
                    @ModelComparisonSeriesTexts.WhatTheJudgeIsFor
                </MudJustifiedText>
                <MudTextSwitch Label="@T("Ask a judge?")" Value="@this.judgeEnabled" ValueChanged="@this.JudgeEnabledChanged" LabelOn="@T("A judge assesses every task")" LabelOff="@T("No judge")"/>
                @if (this.judgeEnabled)
                {
                    <MudText Typo="Typo.subtitle1" Class="mb-1 mt-3">@T("Judge model")</MudText>
                    <ProviderSelectionWithConfidence ProviderSettings="@this.judgeProvider" ProviderSettingsChanged="@this.JudgeProviderChanged" ValidateProvider="@this.ValidatingJudgeModel"/>
                    <ModelComparisonJudgeExpectations @bind-Expectations="@this.judgeInstructions" @bind-OwnStandardsAccepted="@this.judgeOwnStandardsAccepted"/>
                }
            </CompactExpansionPanel>

            <MudText Typo="Typo.h6" Class="mb-1 mt-3">@T("Profile, tools, and data sources")</MudText>
            <MudJustifiedText Typo="Typo.body1" Class="mb-2">
                @ModelComparisonSeriesTexts.WhatBothModelsShare
            </MudJustifiedText>
            @if (this.BothModelsChosen)
            {
                <MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1" Class="mb-3">
                    <ProfileSelection MarginLeft="" CurrentProfile="@this.profile" CurrentProfileChanged="@this.ProfileChanged"/>

                    @if (this.SettingsManager.AreToolsEnabled())
                    {
                        <ToolSelection Component="Components.MODEL_COMPARISON_ASSISTANT" LLMProvider="@this.firstProvider" AdditionalProviders="@this.SecondModel" RequiredOutboundDataRestriction="@OutboundDataRequirement.NONE" SelectedToolIds="@this.selectedToolIds" SelectedToolIdsChanged="@this.ToolsChanged"/>
                    }

                    @if (PreviewFeatures.PRE_RAG_2024.IsEnabled(this.SettingsManager))
                    {
                        <DataSourceSelection Component="Components.MODEL_COMPARISON_ASSISTANT" LLMProvider="@this.firstProvider" AdditionalProviders="@this.SecondModel" AdditionalReaders="@this.Readers" AllowsAutomaticSelection="@false" DataSourceOptions="@this.dataSourceOptions" DataSourceOptionsChanged="@this.DataSourceOptionsChanged"/>
                    }

                    <MudText Typo="Typo.body2" Class="ml-2">@this.SelectionSummary</MudText>
                </MudStack>
            }
            else
            {
                <MudJustifiedText Typo="Typo.body2" Color="Color.Info" Class="mb-3">
                    @TA("Choose both models first: what you can select here depends on them.")
                </MudJustifiedText>
            }
        </CascadingValue>
        </MudForm>
        <Issues IssuesData="@this.dataIssues"/>
    </DialogContent>
    <DialogActions>
        <MudButton OnClick="@this.Cancel" Variant="Variant.Filled" Disabled="@this.isSaving">
            @T("Cancel")
        </MudButton>
        <MudButton OnClick="@this.CreateAsync" Variant="Variant.Filled" Color="Color.Primary" StartIcon="@AppIcons.ADD" Disabled="@this.isSaving">
            @T("Create series")
        </MudButton>
    </DialogActions>
</MudDialog>