import { Flex, Text, Tooltip } from '@mantine/core'
import { IconInfoCircle } from '@tabler/icons-react'

export const errorTip = (message) =>
  message && (
    <Tooltip label={message} color="red" position="top-start">
      <IconInfoCircle size={15} color="red" />
    </Tooltip>
  )

export const labelWithIcon = (text, Icon = null, iconProps = {}) => (
  <Flex display="inline-flex" align="center" gap={5}>
    {Icon && <Icon size={15} color="black" {...iconProps} />}
    <Text size="sm" lh={1} fw={500}>
      {text}
    </Text>
  </Flex>
)
