AI/dify
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git synced 2025-08-15 00:16:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

unconfigured provider

Browse Source
This commit is contained in:
JzoNg 2024-10-11 15:14:13 +08:00
parent 4cc6dfa232
commit 495dec143c
3 changed files with 56 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
web/app/components/header/account-setting/model-provider-page/index.tsx
View File

@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next'
import { RiAlertFill, RiBrainLine } from '@remixicon/react'
import SystemModelSelector from './system-model-selector'
import ProviderAddedCard, { UPDATE_MODEL_PROVIDER_CUSTOM_MODEL_LIST } from './provider-added-card'
import ProviderCard from './provider-card'
// import ProviderCard from './provider-card'
import type {
CustomConfigurationModelFixedFields,
ModelProvider,
@ -134,30 +134,23 @@ const ModelProviderPage = () => {
))}
</div>
)}
<div className='flex items-center mb-2 pt-2'>{t('common.modelProvider.configureRequired')}</div>
<div className='flex items-center mb-2 pt-2'>{t('common.modelProvider.installProvider')}</div>
<div className='flex items-center mb-2 pt-2'>{t('common.modelProvider.discoverMore')}</div>
{
!!notConfiguredProviders?.length && (
{!!notConfiguredProviders?.length && (
<>
<div className='flex items-center mb-2 text-xs font-semibold text-gray-500'>
+ {t('common.modelProvider.addMoreModelProvider')}
<span className='grow ml-3 h-[1px] bg-gradient-to-r from-[#f3f4f6]' />
</div>
<div className='grid grid-cols-3 gap-2'>
{
notConfiguredProviders?.map(provider => (
<ProviderCard
<div className='flex items-center mb-2 pt-2 text-text-primary system-md-semibold'>{t('common.modelProvider.configureRequired')}</div>
<div className='relative'>
{notConfiguredProviders?.map(provider => (
<ProviderAddedCard
notConfigured
key={provider.provider}
provider={provider}
onOpenModal={(configurationMethod: ConfigurationMethodEnum) => handleOpenModal(provider, configurationMethod)}
onOpenModal={(configurationMethod: ConfigurationMethodEnum, currentCustomConfigurationModelFixedFields?: CustomConfigurationModelFixedFields) => handleOpenModal(provider, configurationMethod, currentCustomConfigurationModelFixedFields)}
/>
))
}
))}
</div>
</>
)
}
)}
<div className='flex items-center mb-2 pt-2'>{t('common.modelProvider.installProvider')}</div>
<div className='flex items-center mb-2 pt-2'>{t('common.modelProvider.discoverMore')}</div>
</div>
)
}

16
web/app/components/header/account-setting/model-provider-page/provider-added-card/index.tsx
View File

@ -3,6 +3,7 @@ import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import {
RiArrowRightSLine,
RiInformation2Fill,
RiLoader2Line,
} from '@remixicon/react'
import type {
@ -29,10 +30,12 @@ import { useAppContext } from '@/context/app-context'
export const UPDATE_MODEL_PROVIDER_CUSTOM_MODEL_LIST = 'UPDATE_MODEL_PROVIDER_CUSTOM_MODEL_LIST'
type ProviderAddedCardProps = {
notConfigured?: boolean
provider: ModelProvider
onOpenModal: (configurationMethod: ConfigurationMethodEnum, currentCustomConfigurationModelFixedFields?: CustomConfigurationModelFixedFields) => void
}
const ProviderAddedCard: FC<ProviderAddedCardProps> = ({
notConfigured,
provider,
onOpenModal,
}) => {
@ -47,6 +50,7 @@ const ProviderAddedCard: FC<ProviderAddedCardProps> = ({
const hasModelList = fetched && !!modelList.length
const { isCurrentWorkspaceManager } = useAppContext()
const showQuota = systemConfig.enabled && [...MODEL_PROVIDER_QUOTA_GET_PAID].includes(provider.provider) && !IS_CE_EDITION
const showCredential = configurationMethods.includes(ConfigurationMethodEnum.predefinedModel) && isCurrentWorkspaceManager
const getModelList = async (providerName: string) => {
if (loading)
@ -105,7 +109,7 @@ const ProviderAddedCard: FC<ProviderAddedCardProps> = ({
)
}
{
configurationMethods.includes(ConfigurationMethodEnum.predefinedModel) && isCurrentWorkspaceManager && (
showCredential && (
<CredentialPanel
onSetup={() => onOpenModal(ConfigurationMethodEnum.predefinedModel)}
provider={provider}
@ -116,6 +120,8 @@ const ProviderAddedCard: FC<ProviderAddedCardProps> = ({
{
collapsed && (
<div className='group flex items-center justify-between pl-2 py-1.5 pr-[11px] border-t border-t-black/5 bg-white/30 text-xs font-medium text-gray-500'>
{(showQuota || !notConfigured) && (
<>
<div className='group-hover:hidden flex items-center pl-1 pr-1.5 h-6 leading-6'>
{
hasModelList
@ -140,6 +146,14 @@ const ProviderAddedCard: FC<ProviderAddedCardProps> = ({
)
}
</div>
</>
)}
{!showQuota && notConfigured && (
<div className='flex items-center pl-1 pr-1.5 h-6'>
<RiInformation2Fill className='mr-1 w-4 h-4 text-text-accent' />
<span>{t('common.modelProvider.configureTip')}</span>
</div>
)}
{
configurationMethods.includes(ConfigurationMethodEnum.customizableModel) && isCurrentWorkspaceManager && (
<AddModelButton

2
web/app/components/header/account-setting/model-provider-page/provider-added-card/model-list.tsx
View File

@ -53,7 +53,7 @@ const ModelList: FC<ModelListProps> = ({
<div className='py-1 bg-white rounded-lg'>
<div className='flex items-center pl-1 pr-[3px]'>
<span className='group shrink-0 flex items-center mr-2'>
<span className='group-hover:hidden pl-1 pr-1.5 h-6 leading-6 text-xs font-medium text-gray-500'>
<span className='group-hover:hidden inline-flex pl-1 pr-1.5 h-6 leading-6 text-xs font-medium text-gray-500'>
{t('common.modelProvider.modelsNum', { num: models.length })}
<RiArrowRightSLine className='mr-0.5 w-4 h-4 rotate-90' />
</span>