初始化

wwf

3 天以前 a430284aa21e3ae1f0d5654e55b2ad2852519cc2

 app/components/header/account-setting/model-provider-page/provider-added-card/index.tsx

@@ -2,8 +2,6 @@
import { useState } from 'react'
import { useTranslation } from 'react-i18next'
import {
  RiArrowRightSLine,
  RiInformation2Fill,
  RiLoader2Line,
} from '@remixicon/react'
import type {
@@ -13,6 +11,7 @@
} from '../declarations'
import { ConfigurationMethodEnum } from '../declarations'
import {
  DEFAULT_BACKGROUND_COLOR,
  MODEL_PROVIDER_QUOTA_GET_PAID,
  modelTypeFormat,
} from '../utils'
@@ -22,20 +21,18 @@
import QuotaPanel from './quota-panel'
import ModelList from './model-list'
import AddModelButton from './add-model-button'
import { ChevronDownDouble } from '@/app/components/base/icons/src/vender/line/arrows'
import { fetchModelProviderModelList } from '@/service/common'
import { useEventEmitterContextContext } from '@/context/event-emitter'
import { IS_CE_EDITION } from '@/config'
import { useAppContext } from '@/context/app-context'
import cn from '@/utils/classnames'

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,
}) => {
@@ -50,7 +47,6 @@
  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)
@@ -82,14 +78,11 @@

  return (
    <div
      className={cn(
        'mb-2 rounded-xl border-[0.5px] border-divider-regular bg-third-party-model-bg-default shadow-xs',
        provider.provider === 'langgenius/openai/openai' && 'bg-third-party-model-bg-openai',
        provider.provider === 'langgenius/anthropic/anthropic' && 'bg-third-party-model-bg-anthropic',
      )}
      className='mb-2 rounded-xl border-[0.5px] border-black/5 shadow-xs'
      style={{ background: provider.background || DEFAULT_BACKGROUND_COLOR }}
    >
      <div className='flex rounded-t-xl py-2 pl-3 pr-2'>
        <div className='grow px-1 pb-0.5 pt-1'>
      <div className='flex pl-3 py-2 pr-2 rounded-t-xl'>
        <div className='grow px-1 pt-1 pb-0.5'>
          <ProviderIcon
            className='mb-2'
            provider={provider}
@@ -112,7 +105,7 @@
          )
        }
        {
          showCredential && (
          configurationMethods.includes(ConfigurationMethodEnum.predefinedModel) && isCurrentWorkspaceManager && (
            <CredentialPanel
              onSetup={() => onOpenModal(ConfigurationMethodEnum.predefinedModel)}
              provider={provider}
@@ -122,46 +115,35 @@
      </div>
      {
        collapsed && (
          <div className='system-xs-medium group flex items-center justify-between border-t border-t-divider-subtle py-1.5 pl-2 pr-[11px] text-text-tertiary'>
            {(showQuota || !notConfigured) && (
              <>
                <div className='flex h-6 items-center pl-1 pr-1.5 leading-6 group-hover:hidden'>
          <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'>
            <div className='group-hover:hidden pl-1 pr-1.5 h-6 leading-6'>
                  {
                    hasModelList
                      ? t('common.modelProvider.modelsNum', { num: modelList.length })
                      : t('common.modelProvider.showModels')
                  }
                  {!loading && <RiArrowRightSLine className='h-4 w-4' />}
                </div>
                <div
                  className='hidden h-6 cursor-pointer items-center rounded-lg pl-1 pr-1.5 hover:bg-components-button-ghost-bg-hover group-hover:flex'
              className='hidden group-hover:flex items-center pl-1 pr-1.5 h-6 rounded-lg hover:bg-white cursor-pointer'
                  onClick={handleOpenModelList}
                >
              <ChevronDownDouble className='mr-0.5 w-3 h-3' />
                  {
                    hasModelList
                      ? t('common.modelProvider.showModelsNum', { num: modelList.length })
                      : t('common.modelProvider.showModels')
                  }
                  {!loading && <RiArrowRightSLine className='h-4 w-4' />}
                  {
                    loading && (
                      <RiLoader2Line className='ml-0.5 h-3 w-3 animate-spin' />
                  <RiLoader2Line className='ml-0.5 animate-spin w-3 h-3' />
                    )
                  }
                </div>
              </>
            )}
            {!showQuota && notConfigured && (
              <div className='flex h-6 items-center pl-1 pr-1.5'>
                <RiInformation2Fill className='mr-1 h-4 w-4 text-text-accent' />
                <span className='system-xs-medium text-text-secondary'>{t('common.modelProvider.configureTip')}</span>
              </div>
            )}
            {
              configurationMethods.includes(ConfigurationMethodEnum.customizableModel) && isCurrentWorkspaceManager && (
                <AddModelButton
                  onClick={() => onOpenModal(ConfigurationMethodEnum.customizableModel)}
                  className='flex'
                  className='hidden group-hover:flex group-hover:text-primary-600'
                />
              )
            }