🧑‍💻 Migrate to Tolgee (#976)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

### Summary by CodeRabbit

- Refactor: Transitioned to a new translation library (`@tolgee/react`)
across the application, enhancing the localization capabilities and
consistency.
- New Feature: Introduced a JSON configuration file for application
settings, improving customization and flexibility.
- Refactor: Updated SVG attribute naming convention in the
`WhatsAppLogo` component to align with React standards.
- Chore: Adjusted the `.gitignore` file and added a new line at the end.
- Documentation: Added instructions for setting up environment variables
for the Tolgee i18n contribution dev tool, improving the self-hosting
configuration guide.
- Style: Updated the `CollaborationMenuButton` to hide the
`PopoverContent` component by scaling it down to zero.
- Refactor: Simplified error handling logic for fetching and updating
typebots in `TypebotProvider.tsx`, improving code readability and
maintenance.
- Refactor: Removed the dependency on the `parseGroupTitle` function,
simplifying the code in several components.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

apps/builder/src/features/blocks/bubbles/video/components/VideoUploadContent.tsx

@@ -5,7 +5,7 @@ import {
   VideoBubbleContentType,
 } from '@typebot.io/schemas'
 import { NumberInput, TextInput } from '@/components/inputs'
-import { useScopedI18n } from '@/locales'
+import { useTranslate } from '@tolgee/react'
 import { parseVideoUrl } from '@typebot.io/lib/parseVideoUrl'
 
 type Props = {
@@ -14,7 +14,7 @@ type Props = {
 }
 
 export const VideoUploadContent = ({ content, onSubmit }: Props) => {
-  const scopedT = useScopedI18n('editor.blocks.bubbles.video.settings')
+  const { t } = useTranslate()
   const updateUrl = (url: string) => {
     const info = parseVideoUrl(url)
     return onSubmit({
@@ -33,12 +33,14 @@ export const VideoUploadContent = ({ content, onSubmit }: Props) => {
     <Stack p="2" spacing={4}>
       <Stack>
         <TextInput
-          placeholder={scopedT('worksWith.placeholder')}
+          placeholder={t(
+            'editor.blocks.bubbles.video.settings.worksWith.placeholder'
+          )}
           defaultValue={content?.url ?? ''}
           onChange={updateUrl}
         />
         <Text fontSize="sm" color="gray.400" textAlign="center">
-          {scopedT('worksWith.text')}
+          {t('editor.blocks.bubbles.video.settings.worksWith.text')}
         </Text>
       </Stack>
 
@@ -47,7 +49,7 @@ export const VideoUploadContent = ({ content, onSubmit }: Props) => {
           label="Height:"
           defaultValue={content?.height ?? 400}
           onValueChange={updateHeight}
-          suffix={scopedT('numberInput.unit')}
+          suffix={t('editor.blocks.bubbles.video.settings.numberInput.unit')}
           width="150px"
         />
       )}