jan/web/containers/ModelLabel/NotEnoughRamLabel.tsx
NamH db987e88f9
fix(Model): switch model caused app crash (#1596)
Signed-off-by: James <james@jan.ai>
Co-authored-by: James <james@jan.ai>
Co-authored-by: Louis <louis@jan.ai>
2024-01-17 09:33:40 +07:00

35 lines
876 B
TypeScript

import React from 'react'
import {
Badge,
Tooltip,
TooltipArrow,
TooltipContent,
TooltipPortal,
TooltipTrigger,
} from '@janhq/uikit'
import { InfoIcon } from 'lucide-react'
const NotEnoughRamLabel: React.FC = () => (
<Badge className="space-x-1 rounded-md" themes="danger">
<span>Not enough RAM</span>
<Tooltip>
<TooltipTrigger>
<InfoIcon size={16} />
</TooltipTrigger>
<TooltipPortal>
<TooltipContent side="right" sideOffset={10} className="max-w-[300px]">
<span>
{`This tag signals insufficient RAM for optimal model
performance. It's dynamic and may change with your system's
RAM availability.`}
</span>
<TooltipArrow />
</TooltipContent>
</TooltipPortal>
</Tooltip>
</Badge>
)
export default React.memo(NotEnoughRamLabel)