- Add singleSelect to status/role filters in API keys, users, and redemptions tables (#4880) - Fix affiliate link 404 by changing /register to /sign-up (#4893) - Open FetchModelsDialog in channel creation mode via customFetcher prop (#4817) - Add TruncatedText component with tooltip for long channel names, token names, and usernames (#4877) - Elevate forgot-password link z-index to prevent label click interception (#4898)
39 lines
802 B
TypeScript
Vendored
39 lines
802 B
TypeScript
Vendored
import { cn } from '@/lib/utils'
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipProvider,
|
|
TooltipTrigger,
|
|
} from '@/components/ui/tooltip'
|
|
|
|
interface TruncatedTextProps {
|
|
text: string
|
|
className?: string
|
|
maxWidth?: string
|
|
side?: 'top' | 'bottom' | 'left' | 'right'
|
|
}
|
|
|
|
export function TruncatedText({
|
|
text,
|
|
className,
|
|
maxWidth = 'max-w-[200px]',
|
|
side = 'top',
|
|
}: TruncatedTextProps) {
|
|
return (
|
|
<TooltipProvider delay={300}>
|
|
<Tooltip>
|
|
<TooltipTrigger
|
|
render={
|
|
<span className={cn('block truncate', maxWidth, className)} />
|
|
}
|
|
>
|
|
{text}
|
|
</TooltipTrigger>
|
|
<TooltipContent side={side} className='max-w-xs break-all'>
|
|
{text}
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
)
|
|
}
|