empty-trigger.tsx 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. import type { FC } from 'react'
  2. import { RiEqualizer2Line } from '@remixicon/react'
  3. import { CubeOutline } from '@/app/components/base/icons/src/vender/line/shapes'
  4. import cn from '@/utils/classnames'
  5. import { useTranslation } from 'react-i18next'
  6. type ModelTriggerProps = {
  7. open: boolean
  8. className?: string
  9. }
  10. const ModelTrigger: FC<ModelTriggerProps> = ({
  11. open,
  12. className,
  13. }) => {
  14. const { t } = useTranslation()
  15. return (
  16. <div
  17. className={cn(
  18. 'flex items-center p-1 gap-0.5 rounded-lg bg-components-input-bg-normal hover:bg-components-input-bg-hover cursor-pointer', open && 'bg-components-input-bg-hover',
  19. className,
  20. )}
  21. >
  22. <div className='grow flex items-center'>
  23. <div className='mr-1.5 flex items-center justify-center w-4 h-4 rounded-[5px] border border-dashed border-divider-regular'>
  24. <CubeOutline className='w-3 h-3 text-text-quaternary' />
  25. </div>
  26. <div
  27. className='text-[13px] text-text-tertiary truncate'
  28. title='Configure model'
  29. >
  30. {t('plugin.detailPanel.configureModel')}
  31. </div>
  32. </div>
  33. <div className='shrink-0 flex items-center justify-center w-4 h-4'>
  34. <RiEqualizer2Line className='w-3.5 h-3.5 text-text-tertiary' />
  35. </div>
  36. </div>
  37. )
  38. }
  39. export default ModelTrigger