| | |
| | | import { useTranslation } from 'react-i18next' |
| | | import { useContextSelector } from 'use-context-selector' |
| | | import dayjs from 'dayjs' |
| | | import PremiumBadge from '../../base/premium-badge' |
| | | import { RiHourglass2Fill } from '@remixicon/react' |
| | | |
| | | const LicenseNav = () => { |
| | | const { t } = useTranslation() |
| | |
| | | if (systemFeatures.license?.status === LicenseStatus.EXPIRING) { |
| | | const expiredAt = systemFeatures.license?.expired_at |
| | | const count = dayjs(expiredAt).diff(dayjs(), 'days') |
| | | return <PremiumBadge color='orange' className='select-none'> |
| | | <RiHourglass2Fill className='flex size-3 items-center pl-0.5 text-components-premium-badge-indigo-text-stop-0' /> |
| | | {count <= 1 && <span className='system-xs-medium px-0.5'>{t('common.license.expiring', { count })}</span>} |
| | | {count > 1 && <span className='system-xs-medium px-0.5'>{t('common.license.expiring_plural', { count })}</span>} |
| | | </PremiumBadge> |
| | | return <div className='px-2 py-1 mr-4 rounded-full bg-util-colors-orange-orange-50 border-util-colors-orange-orange-100 system-xs-medium text-util-colors-orange-orange-600'> |
| | | {count <= 1 && <span>{t('common.license.expiring', { count })}</span>} |
| | | {count > 1 && <span>{t('common.license.expiring_plural', { count })}</span>} |
| | | </div> |
| | | } |
| | | if (systemFeatures.license.status === LicenseStatus.ACTIVE) { |
| | | return <PremiumBadge color="indigo" className='select-none'> |
| | | <span className='system-xs-medium px-1'>Enterprise</span> |
| | | </PremiumBadge> |
| | | return <div className='px-2 py-1 mr-4 rounded-md bg-util-colors-indigo-indigo-50 border-util-colors-indigo-indigo-100 system-xs-medium text-util-colors-indigo-indigo-600'> |
| | | Enterprise |
| | | </div> |
| | | } |
| | | return null |
| | | } |