wwf
2 天以前 a430284aa21e3ae1f0d5654e55b2ad2852519cc2
app/components/header/account-setting/model-provider-page/provider-icon/index.tsx
@@ -1,12 +1,6 @@
import type { FC } from 'react'
import type { ModelProvider } from '../declarations'
import { useLanguage } from '../hooks'
import { Openai } from '@/app/components/base/icons/src/vender/other'
import { AnthropicDark, AnthropicLight } from '@/app/components/base/icons/src/public/llm'
import { renderI18nObject } from '@/i18n'
import { Theme } from '@/types/app'
import cn from '@/utils/classnames'
import useTheme from '@/hooks/use-theme'
type ProviderIconProps = {
  provider: ModelProvider
@@ -16,35 +10,22 @@
  provider,
  className,
}) => {
  const { theme } = useTheme()
  const language = useLanguage()
  if (provider.provider === 'langgenius/anthropic/anthropic') {
  if (provider.icon_large) {
    return (
      <div className='mb-2 py-[7px]'>
        {theme === Theme.dark && <AnthropicLight className='h-2.5 w-[90px]' />}
        {theme === Theme.light && <AnthropicDark className='h-2.5 w-[90px]' />}
      </div>
    )
  }
  if (provider.provider === 'langgenius/openai/openai') {
    return (
      <div className='mb-2'>
        <Openai className='h-6 w-auto text-text-inverted-dimmed' />
      </div>
      <img
        alt='provider-icon'
        src={`${provider.icon_large[language] || provider.icon_large.en_US}`}
        className={`w-auto h-6 ${className}`}
      />
    )
  }
  return (
    <div className={cn('inline-flex items-center gap-2', className)}>
      <img
        alt='provider-icon'
        src={renderI18nObject(provider.icon_small, language)}
        className='h-6 w-6'
      />
      <div className='system-md-semibold text-text-primary'>
        {renderI18nObject(provider.label, language)}
    <div className={`inline-flex items-center ${className}`}>
      <div className='text-xs font-semibold text-black'>
        {provider.label[language] || provider.label.en_US}
      </div>
    </div>
  )