53b702e8b1
<!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Integrated localization support across various components using the `useTranslate` hook for dynamic translations. - **Enhancements** - Replaced hardcoded text with localized strings to support multiple languages in the user interface. - **User Interface** - Updated labels, placeholders, tooltips, and button texts to utilize translated content for a multilingual experience. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Baptiste Arnaud <baptiste.arnaud95@gmail.com>
30 lines
759 B
TypeScript
30 lines
759 B
TypeScript
import { useColorModeValue, HStack, Tag, Text } from '@chakra-ui/react'
|
|
import { useTranslate } from '@tolgee/react'
|
|
import { Variable } from '@typebot.io/schemas'
|
|
|
|
export const SetVariableLabel = ({
|
|
variableId,
|
|
variables,
|
|
}: {
|
|
variableId: string
|
|
variables?: Variable[]
|
|
}) => {
|
|
const { t } = useTranslate()
|
|
const textColor = useColorModeValue('gray.600', 'gray.400')
|
|
const variableName = variables?.find(
|
|
(variable) => variable.id === variableId
|
|
)?.name
|
|
|
|
if (!variableName) return null
|
|
return (
|
|
<HStack fontStyle="italic" spacing={1}>
|
|
<Text fontSize="sm" color={textColor}>
|
|
{t('variables.set')}
|
|
</Text>
|
|
<Tag bg="orange.400" color="white" size="sm">
|
|
{variableName}
|
|
</Tag>
|
|
</HStack>
|
|
)
|
|
}
|