🌐 Add translation keys for input blocks (#1114)

<!-- 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>

apps/builder/src/components/SetVariableLabel.tsx

@@ -1,4 +1,5 @@
 import { useColorModeValue, HStack, Tag, Text } from '@chakra-ui/react'
+import { useTranslate } from '@tolgee/react'
 import { Variable } from '@typebot.io/schemas'
 
 export const SetVariableLabel = ({
@@ -8,6 +9,7 @@ export const SetVariableLabel = ({
   variableId: string
   variables?: Variable[]
 }) => {
+  const { t } = useTranslate()
   const textColor = useColorModeValue('gray.600', 'gray.400')
   const variableName = variables?.find(
     (variable) => variable.id === variableId
@@ -17,7 +19,7 @@ export const SetVariableLabel = ({
   return (
     <HStack fontStyle="italic" spacing={1}>
       <Text fontSize="sm" color={textColor}>
-        Set
+        {t('variables.set')}
       </Text>
       <Tag bg="orange.400" color="white" size="sm">
         {variableName}

apps/builder/src/components/inputs/VariableSearchInput.tsx

@@ -33,6 +33,7 @@ import { byId, isDefined, isNotDefined } from '@typebot.io/lib'
 import { useOutsideClick } from '@/hooks/useOutsideClick'
 import { useParentModal } from '@/features/graph/providers/ParentModalProvider'
 import { MoreInfoTooltip } from '../MoreInfoTooltip'
+import { useTranslate } from '@tolgee/react'
 
 type Props = {
   initialVariableId: string | undefined
@@ -78,6 +79,7 @@ export const VariableSearchInput = ({
   const createVariableItemRef = useRef<HTMLButtonElement | null>(null)
   const itemsRef = useRef<(HTMLButtonElement | null)[]>([])
   const { ref: parentModalRef } = useParentModal()
+  const { t } = useTranslate()
 
   useOutsideClick({
     ref: dropdownRef,
@@ -137,7 +139,7 @@ export const VariableSearchInput = ({
   const handleRenameVariableClick =
     (variable: Variable) => (e: React.MouseEvent) => {
       e.stopPropagation()
-      const name = prompt('Rename variable', variable.name)
+      const name = prompt(t('variables.rename'), variable.name)
       if (!name) return
       updateVariable(variable.id, { name })
       setFilteredItems(
@@ -221,7 +223,7 @@ export const VariableSearchInput = ({
               onChange={onInputChange}
               onFocus={openDropdown}
               onKeyDown={handleKeyUp}
-              placeholder={placeholder ?? 'Select a variable'}
+              placeholder={placeholder ?? t('variables.select')}
               autoComplete="off"
               {...inputProps}
             />
@@ -255,7 +257,7 @@ export const VariableSearchInput = ({
                       : 'transparent'
                   }
                 >
-                  Create
+                  {t('create')}
                   <Tag colorScheme="orange" ml="1">
                     <Text noOfLines={0} display="block">
                       {inputValue}
@@ -296,13 +298,13 @@ export const VariableSearchInput = ({
                         <HStack>
                           <IconButton
                             icon={<EditIcon />}
-                            aria-label="Rename variable"
+                            aria-label={t('variables.rename')}
                             size="xs"
                             onClick={handleRenameVariableClick(item)}
                           />
                           <IconButton
                             icon={<TrashIcon />}
-                            aria-label="Remove variable"
+                            aria-label={t('variables.remove')}
                             size="xs"
                             onClick={handleDeleteVariableClick(item)}
                           />