diff --git a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/__tests__/index.spec.tsx b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/__tests__/index.spec.tsx index 29e5d37980..b3f1ee9be1 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/__tests__/index.spec.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/__tests__/index.spec.tsx @@ -13,6 +13,7 @@ let parameterRules: Array> | undefined = [ }, ] let isRulesLoading = false +let isRulesPending = false let currentProvider: Record | undefined = { provider: 'openai', label: { en_US: 'OpenAI' } } let currentModel: Record | undefined = { model: 'gpt-3.5-turbo', @@ -49,7 +50,7 @@ vi.mock('@/service/use-common', () => ({ data: parameterRules, }, isLoading: isRulesLoading, - isPending: isRulesLoading, + isPending: isRulesPending, }), })) @@ -138,6 +139,7 @@ describe('ModelParameterModal', () => { beforeEach(() => { vi.clearAllMocks() isRulesLoading = false + isRulesPending = false parameterRules = [ { name: 'temperature', @@ -252,11 +254,29 @@ describe('ModelParameterModal', () => { it('should render loading state when parameter rules are loading', () => { isRulesLoading = true + isRulesPending = true render() fireEvent.click(screen.getByText('Open Settings')) expect(screen.getByRole('status')).toBeInTheDocument() }) + it('should not render parameter loading when model is not configured and parameter rules query is pending but disabled', () => { + isRulesPending = true + parameterRules = [] + + render( + , + ) + fireEvent.click(screen.getByText('Open Settings')) + + expect(screen.queryByRole('status')).not.toBeInTheDocument() + expect(screen.getByTestId('model-selector')).toBeInTheDocument() + }) + it('should not open content when readonly is true', () => { render() fireEvent.click(screen.getByText('Open Settings')) @@ -332,6 +352,7 @@ describe('ModelParameterModal', () => { it('should render the empty loading fallback when rules resolve to an empty list', () => { parameterRules = [] isRulesLoading = true + isRulesPending = true render() fireEvent.click(screen.getByText('Open Settings')) diff --git a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx index 648edf195d..f0764fade0 100644 --- a/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx +++ b/web/app/components/header/account-setting/model-provider-page/model-parameter-modal/index.tsx @@ -76,10 +76,9 @@ const ModelParameterModal: FC = ({ const settingsIconRef = useRef(null) const { data: parameterRulesData, - isPending, isLoading, } = useModelParameterRules(provider, modelId) - const isRulesLoading = isPending || isLoading + const isRulesLoading = !!provider && !!modelId && isLoading const { currentProvider, currentModel, diff --git a/web/app/components/plugins/plugin-detail-panel/model-selector/__tests__/llm-params-panel.spec.tsx b/web/app/components/plugins/plugin-detail-panel/model-selector/__tests__/llm-params-panel.spec.tsx index 5525934d26..8230ec5b14 100644 --- a/web/app/components/plugins/plugin-detail-panel/model-selector/__tests__/llm-params-panel.spec.tsx +++ b/web/app/components/plugins/plugin-detail-panel/model-selector/__tests__/llm-params-panel.spec.tsx @@ -192,10 +192,12 @@ const createDefaultProps = (overrides: Partial<{ const setupModelParameterRulesMock = (config: { data?: ModelParameterRule[] isPending?: boolean + isLoading?: boolean } = {}) => { mockUseModelParameterRules.mockReturnValue({ data: config.data ? { data: config.data } : undefined, isPending: config.isPending ?? false, + isLoading: config.isLoading ?? config.isPending ?? false, }) } @@ -232,6 +234,19 @@ describe('LLMParamsPanel', () => { expect(screen.getByRole('status')).toBeInTheDocument() }) + it('should not render loading state when model is not configured and parameter rules query is pending but disabled', () => { + // Arrange + setupModelParameterRulesMock({ isPending: true, isLoading: false }) + const props = createDefaultProps({ provider: '', modelId: '' }) + + // Act + render() + + // Assert + expect(screen.queryByRole('status')).not.toBeInTheDocument() + expect(screen.getByText('common.modelProvider.parameters')).toBeInTheDocument() + }) + it('should render parameters header', () => { // Arrange setupModelParameterRulesMock({ data: [], isPending: false }) diff --git a/web/app/components/plugins/plugin-detail-panel/model-selector/llm-params-panel.tsx b/web/app/components/plugins/plugin-detail-panel/model-selector/llm-params-panel.tsx index 49933f6138..4d12efb9b5 100644 --- a/web/app/components/plugins/plugin-detail-panel/model-selector/llm-params-panel.tsx +++ b/web/app/components/plugins/plugin-detail-panel/model-selector/llm-params-panel.tsx @@ -30,7 +30,8 @@ const LLMParamsPanel = ({ onCompletionParamsChange, }: Props) => { const { t } = useTranslation() - const { data: parameterRulesData, isPending: isLoading } = useModelParameterRules(provider, modelId) + const { data: parameterRulesData, isLoading } = useModelParameterRules(provider, modelId) + const isRulesLoading = !!provider && !!modelId && isLoading const parameterRules: ModelParameterRule[] = useMemo(() => { return parameterRulesData?.data || [] @@ -66,7 +67,7 @@ const LLMParamsPanel = ({ } } - if (isLoading) { + if (isRulesLoading) { return (
)