File size: 2,231 Bytes
a8b3f00 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 |
import type { FC, PropsWithChildren } from 'react'
import {
modelTypeFormat,
sizeFormat,
} from '../utils'
import { useLanguage } from '../hooks'
import type { ModelItem } from '../declarations'
import ModelBadge from '../model-badge'
import FeatureIcon from '../model-selector/feature-icon'
import classNames from '@/utils/classnames'
type ModelNameProps = PropsWithChildren<{
modelItem: ModelItem
className?: string
showModelType?: boolean
modelTypeClassName?: string
showMode?: boolean
modeClassName?: string
showFeatures?: boolean
featuresClassName?: string
showContextSize?: boolean
}>
const ModelName: FC<ModelNameProps> = ({
modelItem,
className,
showModelType,
modelTypeClassName,
showMode,
modeClassName,
showFeatures,
featuresClassName,
showContextSize,
children,
}) => {
const language = useLanguage()
if (!modelItem)
return null
return (
<div
className={`
flex items-center truncate text-[13px] font-medium text-gray-800
${className}
`}
>
<div
className='truncate'
title={modelItem.label[language] || modelItem.label.en_US}
>
{modelItem.label[language] || modelItem.label.en_US}
</div>
{
showModelType && modelItem.model_type && (
<ModelBadge className={classNames('ml-1', modelTypeClassName)}>
{modelTypeFormat(modelItem.model_type)}
</ModelBadge>
)
}
{
modelItem.model_properties.mode && showMode && (
<ModelBadge className={classNames('ml-1', modeClassName)}>
{(modelItem.model_properties.mode as string).toLocaleUpperCase()}
</ModelBadge>
)
}
{
showFeatures && modelItem.features?.map(feature => (
<FeatureIcon
key={feature}
feature={feature}
className={featuresClassName}
/>
))
}
{
showContextSize && modelItem.model_properties.context_size && (
<ModelBadge className='ml-1'>
{sizeFormat(modelItem.model_properties.context_size as number)}
</ModelBadge>
)
}
{children}
</div>
)
}
export default ModelName
|