🚧 Use TS project references

apps/builder/next.config.mjs

@@ -37,12 +37,12 @@ configureRuntimeEnv()
 const nextConfig = {
   reactStrictMode: true,
   output: 'standalone',
-  transpilePackages: [
+  typescript: {
-    '@typebot.io/lib',
+    ignoreBuildErrors: true,
-    '@typebot.io/schemas',
+  },
-    '@typebot.io/emails',
+  eslint: {
-    '@typebot.io/env',
+    ignoreDuringBuilds: true,
-  ],
+  },
   i18n: {
     defaultLocale: 'en',
     locales: ['en', 'fr', 'pt', 'pt-BR', 'de', 'ro', 'es', 'it', 'el'],

apps/builder/package.json

@@ -113,7 +113,6 @@
     "@typebot.io/results": "workspace:*",
     "@typebot.io/schemas": "workspace:*",
     "@typebot.io/telemetry": "workspace:*",
-    "@typebot.io/tsconfig": "workspace:*",
     "@typebot.io/variables": "workspace:*",
     "@types/canvas-confetti": "1.6.0",
     "@types/jsonwebtoken": "9.0.2",
@@ -124,7 +123,7 @@
     "@types/papaparse": "5.3.7",
     "@types/prettier": "2.7.3",
     "@types/qs": "6.9.7",
-    "@types/react": "18.2.15",
+    "@types/react": "18.3.4",
     "@types/tinycolor2": "1.4.3",
     "dotenv": "16.4.5",
     "dotenv-cli": "7.4.1",
@@ -132,7 +131,6 @@
     "eslint-config-custom": "workspace:*",
     "next-runtime-env": "1.6.2",
     "superjson": "1.12.4",
-    "typescript": "5.4.5",
     "zod": "3.22.4"
   }
 }

apps/builder/src/components/ColorPicker.tsx

@@ -15,7 +15,7 @@ import {
   Box,
 } from '@chakra-ui/react'
 import { useTranslate } from '@tolgee/react'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import tinyColor from 'tinycolor2'
 import { useDebouncedCallback } from 'use-debounce'
 

apps/builder/src/components/CopyButton.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react'
+import { useEffect } from 'react'
 import { ButtonProps, Button, useClipboard } from '@chakra-ui/react'
 import { useTranslate } from '@tolgee/react'
 

apps/builder/src/components/DropdownList.tsx

@@ -14,7 +14,7 @@ import {
   Stack,
 } from '@chakra-ui/react'
 import { ChevronLeftIcon } from '@/components/icons'
-import React, { ReactNode } from 'react'
+import { ReactNode } from 'react'
 import { MoreInfoTooltip } from './MoreInfoTooltip'
 
 type Item =

apps/builder/src/components/EditableEmojiOrImageIcon.tsx

@@ -8,7 +8,7 @@ import {
   useColorModeValue,
   Portal,
 } from '@chakra-ui/react'
-import React, { RefObject } from 'react'
+import { RefObject } from 'react'
 import { EmojiOrImageIcon } from './EmojiOrImageIcon'
 import { ImageUploadContent } from './ImageUploadContent'
 import { FilePathUploadProps } from '@/features/upload/api/generateUploadUrl'

apps/builder/src/components/EmojiOrImageIcon.tsx

@@ -1,5 +1,4 @@
 import { ToolIcon } from '@/components/icons'
-import React from 'react'
 import { chakra, IconProps, Image } from '@chakra-ui/react'
 import { isSvgSrc } from '@typebot.io/lib/utils'
 

apps/builder/src/components/ImageUploadContent/GiphyPicker.tsx

@@ -2,7 +2,7 @@ import { Flex, Stack, Text } from '@chakra-ui/react'
 import { GiphyFetch } from '@giphy/js-fetch-api'
 import { Grid } from '@giphy/react-components'
 import { GiphyLogo } from '../logos/GiphyLogo'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { TextInput } from '../inputs'
 import { env } from '@typebot.io/env'
 

apps/builder/src/components/PrimitiveList.tsx

@@ -1,6 +1,6 @@
 import { Box, Button, Fade, Flex, IconButton, Stack } from '@chakra-ui/react'
 import { TrashIcon, PlusIcon } from '@/components/icons'
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { createId } from '@paralleldrive/cuid2'
 
 type ItemWithId<T extends number | string | boolean> = { id: string; value?: T }

apps/builder/src/components/SupportBubble.tsx

@@ -1,7 +1,7 @@
 import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { useUser } from '@/features/account/hooks/useUser'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { Bubble, BubbleProps } from '@typebot.io/nextjs'
 import { planToReadable } from '@/features/billing/helpers/planToReadable'
 import { Plan } from '@typebot.io/prisma'

apps/builder/src/components/SwitchWithRelatedSettings.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { SwitchWithLabel, SwitchWithLabelProps } from './inputs/SwitchWithLabel'
 import { Stack } from '@chakra-ui/react'
 

apps/builder/src/components/TableList.tsx

@@ -9,7 +9,7 @@ import {
 } from '@chakra-ui/react'
 import { TrashIcon, PlusIcon } from '@/components/icons'
 import { createId } from '@paralleldrive/cuid2'
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 
 const defaultItem = {
   id: createId(),

apps/builder/src/components/TextLink.tsx

@@ -1,5 +1,4 @@
 import Link, { LinkProps } from 'next/link'
-import React from 'react'
 import { chakra, HStack, TextProps } from '@chakra-ui/react'
 import { ExternalLinkIcon } from '@/components/icons'
 

apps/builder/src/components/UnlockPlanAlertInfo.tsx

@@ -7,7 +7,6 @@ import {
   Text,
   useDisclosure,
 } from '@chakra-ui/react'
-import React from 'react'
 import {
   ChangePlanModal,
   ChangePlanModalProps,

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

@@ -9,7 +9,7 @@ import {
   useColorModeValue,
   useDisclosure,
 } from '@chakra-ui/react'
-import React, { ReactNode, useEffect, useRef, useState } from 'react'
+import { ReactNode, useEffect, useRef, useState } from 'react'
 import { useDebouncedCallback } from 'use-debounce'
 import { VariablesButton } from '@/features/variables/components/VariablesButton'
 import { Variable } from '@typebot.io/schemas'

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

@@ -6,7 +6,7 @@ import {
   Switch,
   SwitchProps,
 } from '@chakra-ui/react'
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { MoreInfoTooltip } from '../MoreInfoTooltip'
 import { isDefined } from '@typebot.io/lib'
 

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

@@ -11,7 +11,7 @@ import {
   Stack,
 } from '@chakra-ui/react'
 import { Variable } from '@typebot.io/schemas'
-import React, {
+import {
   forwardRef,
   ReactNode,
   useEffect,

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

@@ -11,7 +11,7 @@ import {
   Stack,
 } from '@chakra-ui/react'
 import { Variable } from '@typebot.io/schemas'
-import React, { ReactNode, useEffect, useRef, useState } from 'react'
+import { ReactNode, useEffect, useRef, useState } from 'react'
 import { useDebouncedCallback } from 'use-debounce'
 import { env } from '@typebot.io/env'
 import { MoreInfoTooltip } from '../MoreInfoTooltip'

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

@@ -22,7 +22,7 @@ import { EditIcon, PlusIcon, TrashIcon } from '@/components/icons'
 import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { createId } from '@paralleldrive/cuid2'
 import { Variable } from '@typebot.io/schemas'
-import React, { useState, useRef, ChangeEvent, ReactNode } from 'react'
+import { useState, useRef, ChangeEvent, ReactNode } from 'react'
 import { byId, isDefined, isNotDefined } from '@typebot.io/lib'
 import { useOutsideClick } from '@/hooks/useOutsideClick'
 import { useParentModal } from '@/features/graph/providers/ParentModalProvider'

apps/builder/src/features/account/components/ApiTokensList.tsx

@@ -18,7 +18,7 @@ import {
 import { ConfirmModal } from '@/components/ConfirmModal'
 import { useToast } from '@/hooks/useToast'
 import { User } from '@typebot.io/prisma'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { byId, isDefined } from '@typebot.io/lib'
 import { CreateTokenModal } from './CreateTokenModal'
 import { useApiTokens } from '../hooks/useApiTokens'

apps/builder/src/features/account/components/CreateTokenModal.tsx

@@ -15,7 +15,7 @@ import {
   InputGroup,
   InputRightElement,
 } from '@chakra-ui/react'
-import React, { FormEvent, useRef, useState } from 'react'
+import { FormEvent, useRef, useState } from 'react'
 import { createApiTokenQuery } from '../queries/createApiTokenQuery'
 import { ApiTokenFromServer } from '../types'
 

apps/builder/src/features/account/components/MyAccountForm.tsx

@@ -1,6 +1,6 @@
 import { Stack, HStack, Avatar, Text, Tooltip } from '@chakra-ui/react'
 import { UploadIcon } from '@/components/icons'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { ApiTokensList } from './ApiTokensList'
 import { UploadButton } from '@/components/ImageUploadContent/UploadButton'
 import { useUser } from '../hooks/useUser'

apps/builder/src/features/account/components/UserPreferencesForm.tsx

@@ -9,7 +9,7 @@ import {
   HStack,
 } from '@chakra-ui/react'
 import { GraphNavigation } from '@typebot.io/prisma'
-import React, { useEffect } from 'react'
+import { useEffect } from 'react'
 import { AppearanceRadioGroup } from './AppearanceRadioGroup'
 import { useUser } from '../hooks/useUser'
 import { ChevronDownIcon } from '@/components/icons'

apps/builder/src/features/analytics/components/AnalyticsGraphContainer.tsx

@@ -12,7 +12,7 @@ import {
   TotalAnswers,
   TotalVisitedEdges,
 } from '@typebot.io/schemas'
-import React, { useMemo } from 'react'
+import { useMemo } from 'react'
 import { StatsCards } from './StatsCards'
 import { ChangePlanModal } from '@/features/billing/components/ChangePlanModal'
 import { Graph } from '@/features/graph/components/Graph'

apps/builder/src/features/analytics/components/StatsCards.tsx

@@ -9,7 +9,6 @@ import {
   useColorModeValue,
 } from '@chakra-ui/react'
 import { Stats } from '@typebot.io/schemas'
-import React from 'react'
 import { timeFilterValues } from '../constants'
 import { TimeFilterDropdown } from './TimeFilterDropdown'
 

apps/builder/src/features/auth/components/DividerWithText.tsx

@@ -6,7 +6,6 @@ import {
   Text,
   useColorModeValue,
 } from '@chakra-ui/react'
-import React from 'react'
 
 export const DividerWithText = (props: FlexProps) => {
   const { children, ...flexProps } = props

apps/builder/src/features/auth/components/SignInForm.tsx

@@ -11,7 +11,7 @@ import {
   AlertIcon,
   SlideFade,
 } from '@chakra-ui/react'
-import React, { ChangeEvent, FormEvent, useEffect } from 'react'
+import { ChangeEvent, FormEvent, useEffect } from 'react'
 import { useState } from 'react'
 import {
   ClientSafeProvider,

apps/builder/src/features/auth/components/SocialLoginButtons.tsx

@@ -7,7 +7,7 @@ import {
   useSession,
 } from 'next-auth/react'
 import { useRouter } from 'next/router'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { stringify } from 'qs'
 import { BuiltInProviderType } from 'next-auth/providers'
 import { GoogleLogo } from '@/components/GoogleLogo'

apps/builder/src/features/billing/components/BillingSettingsLayout.tsx

@@ -1,6 +1,5 @@
 import { Stack } from '@chakra-ui/react'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
-import React from 'react'
 import { InvoicesList } from './InvoicesList'
 import { ChangePlanForm } from './ChangePlanForm'
 import { UsageProgressBars } from './UsageProgressBars'

apps/builder/src/features/billing/components/CurrentSubscriptionSummary.tsx

@@ -7,7 +7,6 @@ import {
   AlertIcon,
 } from '@chakra-ui/react'
 import { Plan } from '@typebot.io/prisma'
-import React from 'react'
 import { PlanTag } from './PlanTag'
 import { BillingPortalButton } from './BillingPortalButton'
 import { trpc } from '@/lib/trpc'

apps/builder/src/features/billing/components/InvoicesList.tsx

@@ -15,7 +15,6 @@ import {
 } from '@chakra-ui/react'
 import { DownloadIcon, FileIcon } from '@/components/icons'
 import Link from 'next/link'
-import React from 'react'
 import { trpc } from '@/lib/trpc'
 import { useToast } from '@/hooks/useToast'
 import { useTranslate } from '@tolgee/react'

apps/builder/src/features/billing/components/PreCheckoutModal.tsx

@@ -15,7 +15,7 @@ import {
   Stack,
 } from '@chakra-ui/react'
 import { useRouter } from 'next/router'
-import React, { FormEvent, useState } from 'react'
+import { FormEvent, useState } from 'react'
 import { isDefined } from '@typebot.io/lib'
 import { useTranslate } from '@tolgee/react'
 import { taxIdTypes } from '@typebot.io/billing/taxIdTypes'

apps/builder/src/features/billing/components/UpgradeButton.tsx

@@ -1,6 +1,5 @@
 import { Button, ButtonProps, useDisclosure } from '@chakra-ui/react'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
-import React from 'react'
 import { isNotDefined } from '@typebot.io/lib'
 import { ChangePlanModal } from './ChangePlanModal'
 import { useTranslate } from '@tolgee/react'

apps/builder/src/features/blocks/bubbles/audio/components/AudioBubbleIcon.tsx

@@ -1,6 +1,5 @@
 import { featherIconsBaseProps } from '@/components/icons'
 import { Icon, IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const AudioBubbleIcon = (props: IconProps) => (
   <Icon color="blue.500" {...featherIconsBaseProps} {...props}>

apps/builder/src/features/blocks/bubbles/embed/components/EmbedBubbleIcon.tsx

@@ -1,6 +1,5 @@
 import { LayoutIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const EmbedBubbleIcon = (props: IconProps) => (
   <LayoutIcon color="blue.500" {...props} />

apps/builder/src/features/blocks/bubbles/image/components/ImageBubbleIcon.tsx

@@ -1,6 +1,5 @@
 import { ImageIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const ImageBubbleIcon = (props: IconProps) => (
   <ImageIcon color="blue.500" {...props} />

apps/builder/src/features/blocks/bubbles/image/components/ImageBubbleSettings.tsx

@@ -6,7 +6,7 @@ import { useTranslate } from '@tolgee/react'
 import { Stack } from '@chakra-ui/react'
 import { isDefined, isNotEmpty } from '@typebot.io/lib'
 import { ImageBubbleBlock } from '@typebot.io/schemas'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { defaultImageBubbleContent } from '@typebot.io/schemas/features/blocks/bubbles/image/constants'
 
 type Props = {

apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleContent.tsx

@@ -1,6 +1,5 @@
 import { Flex } from '@chakra-ui/react'
 import { TextBubbleBlock } from '@typebot.io/schemas'
-import React from 'react'
 import { PlateBlock } from './plate/PlateBlock'
 
 type Props = {

apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleEditor.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef } from 'react'
+import { useEffect, useRef } from 'react'
 import { Plate } from '@udecode/plate-core'
 import { platePlugins } from '@/lib/plate'
 import { TElement } from '@udecode/plate-common'

apps/builder/src/features/blocks/bubbles/textBubble/components/TextBubbleIcon.tsx

@@ -1,6 +1,5 @@
 import { ChatIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const TextBubbleIcon = (props: IconProps) => (
   <ChatIcon color="blue.500" {...props} />

apps/builder/src/features/blocks/bubbles/textBubble/components/plate/LinkFloatingInput.tsx

@@ -1,4 +1,4 @@
-import React, { useRef } from 'react'
+import { useRef } from 'react'
 import {
   flip,
   offset,

apps/builder/src/features/blocks/bubbles/textBubble/components/plate/LinkToolbarButton.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { IconButton, IconButtonProps } from '@chakra-ui/react'
 import {
   useLinkToolbarButton,

apps/builder/src/features/blocks/bubbles/textBubble/components/plate/MarkToolbarButton.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import {
   useMarkToolbarButton,
   useMarkToolbarButtonState,

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

@@ -1,6 +1,5 @@
 import { FilmIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const VideoBubbleIcon = (props: IconProps) => (
   <FilmIcon color="blue.500" {...props} />

apps/builder/src/features/blocks/inputs/buttons/components/ButtonsBlockNode.tsx

@@ -1,5 +1,4 @@
 import { BlockIndices, ChoiceInputBlock } from '@typebot.io/schemas'
-import React from 'react'
 import { Stack, Tag, Text, Wrap } from '@chakra-ui/react'
 import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { SetVariableLabel } from '@/components/SetVariableLabel'

apps/builder/src/features/blocks/inputs/buttons/components/ButtonsBlockSettings.tsx

@@ -3,7 +3,6 @@ import { MoreInfoTooltip } from '@/components/MoreInfoTooltip'
 import { VariableSearchInput } from '@/components/inputs/VariableSearchInput'
 import { FormControl, FormLabel, Stack } from '@chakra-ui/react'
 import { ChoiceInputBlock, Variable } from '@typebot.io/schemas'
-import React from 'react'
 import { SwitchWithRelatedSettings } from '@/components/SwitchWithRelatedSettings'
 import { defaultChoiceInputOptions } from '@typebot.io/schemas/features/blocks/inputs/choice/constants'
 import { useTranslate } from '@tolgee/react'

apps/builder/src/features/blocks/inputs/buttons/components/ButtonsIcon.tsx

@@ -1,6 +1,5 @@
 import { CheckSquareIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const ButtonsInputIcon = (props: IconProps) => (
   <CheckSquareIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/buttons/components/ButtonsItemNode.tsx

@@ -17,7 +17,7 @@ import {
 import { PlusIcon, SettingsIcon } from '@/components/icons'
 import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { ButtonItem, Item, ItemIndices } from '@typebot.io/schemas'
-import React, { useRef, useState } from 'react'
+import { useRef, useState } from 'react'
 import { isEmpty } from '@typebot.io/lib'
 import { useGraph } from '@/features/graph/providers/GraphProvider'
 import { ButtonsItemSettings } from './ButtonsItemSettings'

apps/builder/src/features/blocks/inputs/buttons/components/ButtonsItemSettings.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Stack } from '@chakra-ui/react'
 import { SwitchWithRelatedSettings } from '@/components/SwitchWithRelatedSettings'
 import { ConditionForm } from '@/features/blocks/logic/condition/components/ConditionForm'

apps/builder/src/features/blocks/inputs/date/components/DateInputIcon.tsx

@@ -1,6 +1,5 @@
 import { CalendarIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const DateInputIcon = (props: IconProps) => (
   <CalendarIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/date/components/DateInputSettings.tsx

@@ -4,7 +4,6 @@ import { SwitchWithLabel } from '@/components/inputs/SwitchWithLabel'
 import { VariableSearchInput } from '@/components/inputs/VariableSearchInput'
 import { FormLabel, Stack } from '@chakra-ui/react'
 import { DateInputBlock, Variable } from '@typebot.io/schemas'
-import React from 'react'
 import { defaultDateInputOptions } from '@typebot.io/schemas/features/blocks/inputs/date/constants'
 import { useTranslate } from '@tolgee/react'
 

apps/builder/src/features/blocks/inputs/date/components/DateNodeContent.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Text } from '@chakra-ui/react'
 import { WithVariableContent } from '@/features/graph/components/nodes/block/WithVariableContent'
 

apps/builder/src/features/blocks/inputs/emailInput/components/EmailInputIcon.tsx

@@ -1,6 +1,5 @@
 import { EmailIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const EmailInputIcon = (props: IconProps) => (
   <EmailIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/emailInput/components/EmailInputNodeContent.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Text } from '@chakra-ui/react'
 import { EmailInputBlock } from '@typebot.io/schemas'
 import { WithVariableContent } from '@/features/graph/components/nodes/block/WithVariableContent'

apps/builder/src/features/blocks/inputs/emailInput/components/EmailInputSettings.tsx

@@ -4,7 +4,6 @@ import { FormLabel, Stack } from '@chakra-ui/react'
 import { useTranslate } from '@tolgee/react'
 import { EmailInputBlock, Variable } from '@typebot.io/schemas'
 import { defaultEmailInputOptions } from '@typebot.io/schemas/features/blocks/inputs/email/constants'
-import React from 'react'
 
 type Props = {
   options: EmailInputBlock['options']

apps/builder/src/features/blocks/inputs/fileUpload/components/FileInputIcon.tsx

@@ -1,6 +1,5 @@
 import { UploadIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const FileInputIcon = (props: IconProps) => (
   <UploadIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/fileUpload/components/FileInputSettings.tsx

@@ -9,7 +9,6 @@ import {
 } from '@chakra-ui/react'
 import { CodeEditor } from '@/components/inputs/CodeEditor'
 import { FileInputBlock, Variable } from '@typebot.io/schemas'
-import React from 'react'
 import { TextInput } from '@/components/inputs'
 import { SwitchWithLabel } from '@/components/inputs/SwitchWithLabel'
 import { VariableSearchInput } from '@/components/inputs/VariableSearchInput'

apps/builder/src/features/blocks/inputs/number/components/NumberInputIcon.tsx

@@ -1,6 +1,5 @@
 import { NumberIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const NumberInputIcon = (props: IconProps) => (
   <NumberIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/number/components/NumberInputSettings.tsx

@@ -4,7 +4,6 @@ import { FormLabel, Stack } from '@chakra-ui/react'
 import { useTranslate } from '@tolgee/react'
 import { NumberInputBlock, Variable } from '@typebot.io/schemas'
 import { defaultNumberInputOptions } from '@typebot.io/schemas/features/blocks/inputs/number/constants'
-import React from 'react'
 
 type Props = {
   options: NumberInputBlock['options']

apps/builder/src/features/blocks/inputs/number/components/NumberNodeContent.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Text } from '@chakra-ui/react'
 import { NumberInputBlock } from '@typebot.io/schemas'
 import { WithVariableContent } from '@/features/graph/components/nodes/block/WithVariableContent'

apps/builder/src/features/blocks/inputs/payment/components/PaymentAddressSettings.tsx

@@ -6,7 +6,6 @@ import {
   AccordionItem,
   AccordionPanel,
 } from '@chakra-ui/react'
-import React from 'react'
 import { TextInput } from '@/components/inputs'
 import { PaymentAddress } from '@typebot.io/schemas'
 import { useTranslate } from '@tolgee/react'

apps/builder/src/features/blocks/inputs/payment/components/PaymentInputIcon.tsx

@@ -1,6 +1,5 @@
 import { CreditCardIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const PaymentInputIcon = (props: IconProps) => (
   <CreditCardIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/payment/components/PaymentSettings.tsx

@@ -12,7 +12,7 @@ import {
 } from '@chakra-ui/react'
 import { DropdownList } from '@/components/DropdownList'
 import { PaymentAddress, PaymentInputBlock } from '@typebot.io/schemas'
-import React, { ChangeEvent } from 'react'
+import { ChangeEvent } from 'react'
 import { currencies } from '../currencies'
 import { StripeConfigModal } from './StripeConfigModal'
 import { CredentialsDropdown } from '@/features/credentials/components/CredentialsDropdown'

apps/builder/src/features/blocks/inputs/payment/components/StripeConfigModal.tsx

@@ -13,7 +13,7 @@ import {
   Text,
   HStack,
 } from '@chakra-ui/react'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
 import { useToast } from '@/hooks/useToast'
 import { TextInput } from '@/components/inputs'

apps/builder/src/features/blocks/inputs/phone/components/CountryCodeSelect.tsx

@@ -1,6 +1,6 @@
 import { Select } from '@chakra-ui/react'
 import { useTranslate } from '@tolgee/react'
-import React, { ChangeEvent } from 'react'
+import { ChangeEvent } from 'react'
 
 type Props = {
   countryCode?: string

apps/builder/src/features/blocks/inputs/phone/components/PhoneInputIcon.tsx

@@ -1,6 +1,5 @@
 import { PhoneIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const PhoneInputIcon = (props: IconProps) => (
   <PhoneIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/phone/components/PhoneInputSettings.tsx

@@ -2,7 +2,6 @@ import { TextInput } from '@/components/inputs'
 import { VariableSearchInput } from '@/components/inputs/VariableSearchInput'
 import { FormLabel, Stack } from '@chakra-ui/react'
 import { PhoneNumberInputBlock, Variable } from '@typebot.io/schemas'
-import React from 'react'
 import { CountryCodeSelect } from './CountryCodeSelect'
 import { useTranslate } from '@tolgee/react'
 import { defaultPhoneInputOptions } from '@typebot.io/schemas/features/blocks/inputs/phone/constants'

apps/builder/src/features/blocks/inputs/phone/components/PhoneNodeContent.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Text } from '@chakra-ui/react'
 import { WithVariableContent } from '@/features/graph/components/nodes/block/WithVariableContent'
 import { PhoneNumberInputBlock } from '@typebot.io/schemas'

apps/builder/src/features/blocks/inputs/pictureChoice/components/PictureChoiceIcon.tsx

@@ -1,6 +1,5 @@
 import { ImageIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const PictureChoiceIcon = (props: IconProps) => (
   <ImageIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/pictureChoice/components/PictureChoiceItemNode.tsx

@@ -15,7 +15,7 @@ import {
 import { ImageIcon, PlusIcon } from '@/components/icons'
 import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { ItemIndices } from '@typebot.io/schemas'
-import React, { useRef } from 'react'
+import { useRef } from 'react'
 import { PictureChoiceItem } from '@typebot.io/schemas/features/blocks/inputs/pictureChoice'
 import { useGraph } from '@/features/graph/providers/GraphProvider'
 import { PictureChoiceItemSettings } from './PictureChoiceItemSettings'

apps/builder/src/features/blocks/inputs/pictureChoice/components/PictureChoiceItemSettings.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { TextInput, Textarea } from '@/components/inputs'
 import { PictureChoiceItem } from '@typebot.io/schemas/features/blocks/inputs/pictureChoice'
 import {

apps/builder/src/features/blocks/inputs/pictureChoice/components/PictureChoiceNode.tsx

@@ -1,5 +1,4 @@
 import { BlockIndices } from '@typebot.io/schemas'
-import React from 'react'
 import { Stack, Tag, Wrap, Text } from '@chakra-ui/react'
 import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { SetVariableLabel } from '@/components/SetVariableLabel'

apps/builder/src/features/blocks/inputs/pictureChoice/components/PictureChoiceSettings.tsx

@@ -2,7 +2,6 @@ import { TextInput } from '@/components/inputs'
 import { VariableSearchInput } from '@/components/inputs/VariableSearchInput'
 import { FormLabel, Stack } from '@chakra-ui/react'
 import { Variable } from '@typebot.io/schemas'
-import React from 'react'
 import { PictureChoiceBlock } from '@typebot.io/schemas/features/blocks/inputs/pictureChoice'
 import { SwitchWithRelatedSettings } from '@/components/SwitchWithRelatedSettings'
 import { defaultPictureChoiceOptions } from '@typebot.io/schemas/features/blocks/inputs/pictureChoice/constants'

apps/builder/src/features/blocks/inputs/rating/components/RatingInputIcon.tsx

@@ -1,6 +1,5 @@
 import { StarIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const RatingInputIcon = (props: IconProps) => (
   <StarIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/rating/components/RatingInputSettings.tsx

@@ -1,7 +1,6 @@
 import { FormLabel, Stack } from '@chakra-ui/react'
 import { DropdownList } from '@/components/DropdownList'
 import { RatingInputBlock, Variable } from '@typebot.io/schemas'
-import React from 'react'
 import { SwitchWithLabel } from '@/components/inputs/SwitchWithLabel'
 import { NumberInput, TextInput } from '@/components/inputs'
 import { VariableSearchInput } from '@/components/inputs/VariableSearchInput'

apps/builder/src/features/blocks/inputs/textInput/components/TextInputIcon.tsx

@@ -1,6 +1,5 @@
 import { TextIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const TextInputIcon = (props: IconProps) => (
   <TextIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/textInput/components/TextInputNodeContent.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Stack, Text } from '@chakra-ui/react'
 import { WithVariableContent } from '@/features/graph/components/nodes/block/WithVariableContent'
 import { TextInputBlock } from '@typebot.io/schemas'

apps/builder/src/features/blocks/inputs/textInput/components/TextInputSettings.tsx

@@ -8,7 +8,6 @@ import { useTranslate } from '@tolgee/react'
 import { TextInputBlock, Variable } from '@typebot.io/schemas'
 import { fileVisibilityOptions } from '@typebot.io/schemas/features/blocks/inputs/file/constants'
 import { defaultTextInputOptions } from '@typebot.io/schemas/features/blocks/inputs/text/constants'
-import React from 'react'
 
 type Props = {
   options: TextInputBlock['options']

apps/builder/src/features/blocks/inputs/url/components/UrlInputIcon.tsx

@@ -1,6 +1,5 @@
 import { GlobeIcon } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const UrlInputIcon = (props: IconProps) => (
   <GlobeIcon color="orange.500" {...props} />

apps/builder/src/features/blocks/inputs/url/components/UrlInputSettings.tsx

@@ -4,7 +4,6 @@ import { FormLabel, Stack } from '@chakra-ui/react'
 import { useTranslate } from '@tolgee/react'
 import { UrlInputBlock, Variable } from '@typebot.io/schemas'
 import { defaultUrlInputOptions } from '@typebot.io/schemas/features/blocks/inputs/url/constants'
-import React from 'react'
 
 type Props = {
   options: UrlInputBlock['options']

apps/builder/src/features/blocks/inputs/url/components/UrlNodeContent.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Text } from '@chakra-ui/react'
 import { WithVariableContent } from '@/features/graph/components/nodes/block/WithVariableContent'
 import { UrlInputBlock } from '@typebot.io/schemas'

apps/builder/src/features/blocks/integrations/chatwoot/components/ChatwootSettings.tsx

@@ -13,7 +13,6 @@ import {
   chatwootTasks,
   defaultChatwootOptions,
 } from '@typebot.io/schemas/features/blocks/integrations/chatwoot/constants'
-import React from 'react'
 
 type Props = {
   options: ChatwootBlock['options']

apps/builder/src/features/blocks/integrations/googleAnalytics/components/GoogleAnalyticsNodeBody.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Text } from '@chakra-ui/react'
 import { GoogleAnalyticsBlock } from '@typebot.io/schemas'
 

apps/builder/src/features/blocks/integrations/googleAnalytics/components/GoogleAnalyticsSettings.tsx

@@ -9,7 +9,6 @@ import {
   Stack,
 } from '@chakra-ui/react'
 import { GoogleAnalyticsBlock } from '@typebot.io/schemas'
-import React from 'react'
 
 type Props = {
   options?: GoogleAnalyticsBlock['options']

apps/builder/src/features/blocks/integrations/googleSheets/components/GoogleSheetsConnectModal.tsx

@@ -14,7 +14,6 @@ import {
 } from '@chakra-ui/react'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
 import Link from 'next/link'
-import React from 'react'
 import { AlertInfo } from '@/components/AlertInfo'
 import { GoogleLogo } from '@/components/GoogleLogo'
 import { getGoogleSheetsConsentScreenUrlQuery } from '../queries/getGoogleSheetsConsentScreenUrlQuery'

apps/builder/src/features/blocks/integrations/googleSheets/components/GoogleSheetsNodeContent.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Stack, Text } from '@chakra-ui/react'
 import { useTypebot } from '@/features/editor/providers/TypebotProvider'
 import { SetVariableLabel } from '@/components/SetVariableLabel'

apps/builder/src/features/blocks/integrations/googleSheets/components/GoogleSheetsSettings.tsx

@@ -19,7 +19,7 @@ import {
   GoogleSheetsInsertRowOptions,
   GoogleSheetsUpdateRowOptionsV6,
 } from '@typebot.io/schemas'
-import React, { useMemo } from 'react'
+import { useMemo } from 'react'
 import { isDefined } from '@typebot.io/lib'
 import { SheetsDropdown } from './SheetsDropdown'
 import { CellWithValueStack } from './CellWithValueStack'

apps/builder/src/features/blocks/integrations/googleSheets/components/GoogleSpreadsheetPicker.tsx

@@ -2,7 +2,7 @@ import { FileIcon } from '@/components/icons'
 import { trpc } from '@/lib/trpc'
 import { Button, Flex, HStack, IconButton, Text } from '@chakra-ui/react'
 import { env } from '@typebot.io/env'
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { GoogleSheetsLogo } from './GoogleSheetsLogo'
 import { isDefined } from '@typebot.io/lib'
 

apps/builder/src/features/blocks/integrations/googleSheets/components/RowsFilterComparisonItem.tsx

@@ -4,7 +4,6 @@ import { TableListItemProps } from '@/components/TableList'
 import { Stack } from '@chakra-ui/react'
 import { RowsFilterComparison } from '@typebot.io/schemas'
 import { ComparisonOperators } from '@typebot.io/schemas/features/blocks/logic/condition/constants'
-import React from 'react'
 
 export const RowsFilterComparisonItem = ({
   item,

apps/builder/src/features/blocks/integrations/googleSheets/components/RowsFilterTableList.tsx

@@ -5,7 +5,6 @@ import {
   GoogleSheetsGetOptions,
   RowsFilterComparison,
 } from '@typebot.io/schemas'
-import React from 'react'
 import { RowsFilterComparisonItem } from './RowsFilterComparisonItem'
 import { LogicalOperator } from '@typebot.io/schemas/features/blocks/logic/condition/constants'
 

apps/builder/src/features/blocks/integrations/makeCom/components/MakeComSettings.tsx

@@ -1,7 +1,6 @@
 import { Alert, AlertIcon, Button, Link, Stack, Text } from '@chakra-ui/react'
 import { ExternalLinkIcon } from '@/components/icons'
 import { MakeComBlock, HttpRequest } from '@typebot.io/schemas'
-import React from 'react'
 import { HttpRequestAdvancedConfigForm } from '../../webhook/components/HttpRequestAdvancedConfigForm'
 
 type Props = {

apps/builder/src/features/blocks/integrations/openai/components/OpenAICredentialsModal.tsx

@@ -16,7 +16,7 @@ import {
   Alert,
   AlertIcon,
 } from '@chakra-ui/react'
-import React, { useState } from 'react'
+import { useState } from 'react'
 
 const openAITokensPage = 'https://platform.openai.com/account/api-keys'
 

apps/builder/src/features/blocks/integrations/openai/components/OpenAISettings.tsx

@@ -8,7 +8,6 @@ import {
   useDisclosure,
   Text,
 } from '@chakra-ui/react'
-import React from 'react'
 import { CredentialsDropdown } from '@/features/credentials/components/CredentialsDropdown'
 import {
   ChatCompletionOpenAIOptions,

apps/builder/src/features/blocks/integrations/pabbly/components/PabblyConnectSettings.tsx

@@ -1,7 +1,6 @@
 import { Alert, AlertIcon, Button, Link, Stack, Text } from '@chakra-ui/react'
 import { ExternalLinkIcon } from '@/components/icons'
 import { PabblyConnectBlock, HttpRequest } from '@typebot.io/schemas'
-import React from 'react'
 import { HttpRequestAdvancedConfigForm } from '../../webhook/components/HttpRequestAdvancedConfigForm'
 import { TextInput } from '@/components/inputs'
 

apps/builder/src/features/blocks/integrations/pixel/components/PixelNodeBody.tsx

@@ -1,4 +1,3 @@
-import React from 'react'
 import { Text } from '@chakra-ui/react'
 import { PixelBlock } from '@typebot.io/schemas'
 

apps/builder/src/features/blocks/integrations/pixel/components/PixelSettings.tsx

@@ -14,7 +14,6 @@ import {
   pixelEventTypes,
   pixelObjectProperties,
 } from '@typebot.io/schemas/features/blocks/integrations/pixel/constants'
-import React from 'react'
 
 const pixelReferenceUrl =
   'https://developers.facebook.com/docs/meta-pixel/reference#standard-events'

apps/builder/src/features/blocks/integrations/sendEmail/components/SendEmailIcon.tsx

@@ -1,5 +1,4 @@
 import { SendEmailIcon as SendEmailIco } from '@/components/icons'
 import { IconProps } from '@chakra-ui/react'
-import React from 'react'
 
 export const SendEmailIcon = (props: IconProps) => <SendEmailIco {...props} />

apps/builder/src/features/blocks/integrations/sendEmail/components/SendEmailSettings.tsx

@@ -14,7 +14,6 @@ import {
 } from '@chakra-ui/react'
 import { CodeEditor } from '@/components/inputs/CodeEditor'
 import { SendEmailBlock, Variable } from '@typebot.io/schemas'
-import React from 'react'
 import { isNotEmpty } from '@typebot.io/lib'
 import { SmtpConfigModal } from './SmtpConfigModal'
 import { SwitchWithLabel } from '@/components/inputs/SwitchWithLabel'

apps/builder/src/features/blocks/integrations/sendEmail/components/SmtpConfigForm.tsx

@@ -3,7 +3,6 @@ import { SwitchWithLabel } from '@/components/inputs/SwitchWithLabel'
 import { Stack } from '@chakra-ui/react'
 import { isDefined } from '@udecode/plate-common'
 import { SmtpCredentials } from '@typebot.io/schemas'
-import React from 'react'
 
 type Props = {
   config: SmtpCredentials['data'] | undefined

apps/builder/src/features/blocks/integrations/sendEmail/components/SmtpConfigModal.tsx

@@ -9,7 +9,7 @@ import {
   Button,
 } from '@chakra-ui/react'
 import { useUser } from '@/features/account/hooks/useUser'
-import React, { useState } from 'react'
+import { useState } from 'react'
 import { isNotDefined } from '@typebot.io/lib'
 import { SmtpConfigForm } from './SmtpConfigForm'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'