⬆️ Upgrade chakra version

baptisteArno · Jun 17, 2024 · bec9cb6 · bec9cb6
1 parent 0f2f4d2
commit bec9cb6
Show file tree

Hide file tree

Showing 61 changed files with 724 additions and 1,793 deletions.
diff --git a/apps/builder/package.json b/apps/builder/package.json
@@ -14,14 +14,14 @@
   },
   "dependencies": {
     "@braintree/sanitize-url": "7.0.1",
-    "@chakra-ui/anatomy": "2.1.1",
-    "@chakra-ui/react": "2.7.1",
-    "@chakra-ui/theme-tools": "2.0.18",
+    "@chakra-ui/anatomy": "2.2.2",
+    "@chakra-ui/react": "2.8.2",
+    "@chakra-ui/theme-tools": "2.1.2",
     "@dnd-kit/core": "6.0.8",
     "@dnd-kit/sortable": "7.0.2",
     "@dnd-kit/utilities": "3.2.1",
-    "@emotion/react": "11.11.1",
-    "@emotion/styled": "11.11.0",
+    "@emotion/react": "11.11.4",
+    "@emotion/styled": "11.11.5",
     "@faire/mjml-react": "3.3.0",
     "@giphy/js-fetch-api": "5.0.0",
     "@giphy/js-types": "4.4.0",
@@ -65,13 +65,13 @@
     "dequal": "2.0.3",
     "emojilib": "3.0.10",
     "focus-visible": "5.2.0",
-    "framer-motion": "10.3.0",
+    "framer-motion": "11.1.7",
     "google-auth-library": "8.9.0",
     "google-spreadsheet": "4.1.1",
     "immer": "10.0.2",
     "isolated-vm": "4.7.2",
     "jsonwebtoken": "9.0.1",
-    "ky": "1.2.3",
+    "ky": "1.2.4",
     "libphonenumber-js": "1.10.37",
     "micro": "10.0.1",
     "micro-cors": "0.1.1",
@@ -99,7 +99,7 @@
     "zustand": "4.5.0"
   },
   "devDependencies": {
-    "@chakra-ui/styled-system": "2.9.1",
+    "@chakra-ui/styled-system": "2.9.2",
     "@playwright/test": "1.43.1",
     "@typebot.io/billing": "workspace:*",
     "@typebot.io/forge": "workspace:*",

diff --git a/apps/builder/src/components/EditableEmojiOrImageIcon.tsx b/apps/builder/src/components/EditableEmojiOrImageIcon.tsx
@@ -6,6 +6,7 @@ import {
   PopoverContent,
   Flex,
   useColorModeValue,
+  Portal,
 } from '@chakra-ui/react'
 import React from 'react'
 import { EmojiOrImageIcon } from './EmojiOrImageIcon'
@@ -55,16 +56,19 @@ export const EditableEmojiOrImageIcon = ({
               </PopoverTrigger>
             </Flex>
           </Tooltip>
-          <PopoverContent p="2">
-            <ImageUploadContent
-              uploadFileProps={uploadFileProps}
-              defaultUrl={icon ?? ''}
-              onSubmit={onChangeIcon}
-              excludedTabs={['giphy', 'unsplash']}
-              onClose={onClose}
-              initialTab="icon"
-            />
-          </PopoverContent>
+          <Portal>
+            <PopoverContent p="2">
+              <ImageUploadContent
+                uploadFileProps={uploadFileProps}
+                defaultUrl={icon ?? ''}
+                onSubmit={onChangeIcon}
+                excludedTabs={['giphy', 'unsplash']}
+                onClose={onClose}
+                initialTab="icon"
+                linkWithVariableButton={false}
+              />
+            </PopoverContent>
+          </Portal>
         </>
       )}
     </Popover>

diff --git a/apps/builder/src/components/ImageUploadContent/ImageUploadContent.tsx b/apps/builder/src/components/ImageUploadContent/ImageUploadContent.tsx
@@ -16,6 +16,7 @@ type Props = {
   defaultUrl?: string
   imageSize?: 'small' | 'regular' | 'thumb'
   initialTab?: Tabs
+  linkWithVariableButton?: boolean
   onSubmit: (url: string) => void
   onClose?: () => void
 } & (
@@ -43,6 +44,7 @@ export const ImageUploadContent = ({
   imageSize = 'regular',
   onClose,
   initialTab,
+  linkWithVariableButton,
   ...props
 }: Props) => {
   const includedTabs =
@@ -128,6 +130,7 @@ export const ImageUploadContent = ({
         imageSize={imageSize}
         onSubmit={handleSubmit}
         defaultUrl={defaultUrl}
+        linkWithVariableButton={linkWithVariableButton}
       />
     </Stack>
   )
@@ -138,12 +141,14 @@ const BodyContent = ({
   tab,
   defaultUrl,
   imageSize,
+  linkWithVariableButton,
   onSubmit,
 }: {
   uploadFileProps?: FilePathUploadProps
   tab: Tabs
   defaultUrl?: string
   imageSize: 'small' | 'regular' | 'thumb'
+  linkWithVariableButton?: boolean
   onSubmit: (url: string) => void
 }) => {
   switch (tab) {
@@ -157,7 +162,13 @@ const BodyContent = ({
       )
     }
     case 'link':
-      return <EmbedLinkContent defaultUrl={defaultUrl} onNewUrl={onSubmit} />
+      return (
+        <EmbedLinkContent
+          defaultUrl={defaultUrl}
+          onNewUrl={onSubmit}
+          withVariableButton={linkWithVariableButton}
+        />
+      )
     case 'giphy':
       return <GiphyContent onNewUrl={onSubmit} />
     case 'emoji':
@@ -194,7 +205,8 @@ const UploadFileContent = ({
 const EmbedLinkContent = ({
   defaultUrl,
   onNewUrl,
-}: ContentProps & { defaultUrl?: string }) => {
+  withVariableButton,
+}: ContentProps & { defaultUrl?: string; withVariableButton?: boolean }) => {
   const { t } = useTranslate()
 
   return (
@@ -203,6 +215,7 @@ const EmbedLinkContent = ({
         placeholder={t('editor.header.linkTab.searchInputPlaceholder.label')}
         onChange={onNewUrl}
         defaultValue={defaultUrl ?? ''}
+        withVariableButton={withVariableButton}
       />
     </Stack>
   )

diff --git a/apps/docs/package.json b/apps/docs/package.json
@@ -9,7 +9,7 @@
   },
   "devDependencies": {
     "mintlify": "4.0.75",
-    "tsx": "^4.6.2",
+    "tsx": "4.6.2",
     "dotenv-cli": "7.4.1"
   }
-}
+}
diff --git a/apps/viewer/package.json b/apps/viewer/package.json
@@ -27,7 +27,7 @@
     "google-spreadsheet": "4.1.1",
     "got": "12.6.0",
     "isolated-vm": "4.7.2",
-    "ky": "1.2.3",
+    "ky": "1.2.4",
     "next": "14.1.0",
     "nextjs-cors": "2.1.2",
     "nodemailer": "6.9.8",
@@ -68,4 +68,4 @@
     "typescript": "5.4.5",
     "zod": "3.22.4"
   }
-}
+}
diff --git a/ee/apps/landing-page/assets/icons/AccessibilityIcon.tsx b/ee/apps/landing-page/assets/icons/AccessibilityIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const AccessibilityIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/ArrowRight.tsx b/ee/apps/landing-page/assets/icons/ArrowRight.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const ArrowRight = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/CaluclatorIcon.tsx b/ee/apps/landing-page/assets/icons/CaluclatorIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const CalculatorIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/CapterraIcon.tsx b/ee/apps/landing-page/assets/icons/CapterraIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 
 export const CapterraIcon = (props: IconProps) => (
   <Icon

diff --git a/ee/apps/landing-page/assets/icons/CheckCircleIcon.tsx b/ee/apps/landing-page/assets/icons/CheckCircleIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const CheckCircleIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/CheckIcon.tsx b/ee/apps/landing-page/assets/icons/CheckIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 import { featherIconsBaseProps } from '.'
 

diff --git a/ee/apps/landing-page/assets/icons/ChevronDownIcon.tsx b/ee/apps/landing-page/assets/icons/ChevronDownIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const ChevronDownIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/ChevronRightIcon.tsx b/ee/apps/landing-page/assets/icons/ChevronRightIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const ChevronRightIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/ConditionIcon.tsx b/ee/apps/landing-page/assets/icons/ConditionIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const ConditionIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/DoIcon.tsx b/ee/apps/landing-page/assets/icons/DoIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const DoIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/DocIcon.tsx b/ee/apps/landing-page/assets/icons/DocIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const DocIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/DontIcon.tsx b/ee/apps/landing-page/assets/icons/DontIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const DontIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/EmailIcon.tsx b/ee/apps/landing-page/assets/icons/EmailIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import { featherIconsBaseProps } from './HamburgerIcon'
 
 export const EmailIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/ExternalLinkIcon.tsx b/ee/apps/landing-page/assets/icons/ExternalLinkIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import { featherIconsBaseProps } from './HamburgerIcon'
 
 export const ExternalLinkIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/FolderIcon.tsx b/ee/apps/landing-page/assets/icons/FolderIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const FolderIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/HamburgerIcon.tsx b/ee/apps/landing-page/assets/icons/HamburgerIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const featherIconsBaseProps: IconProps = {

diff --git a/ee/apps/landing-page/assets/icons/Logo.tsx b/ee/apps/landing-page/assets/icons/Logo.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const Logo = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/MapIcon.tsx b/ee/apps/landing-page/assets/icons/MapIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const MapIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/NewspaperIcon.tsx b/ee/apps/landing-page/assets/icons/NewspaperIcon.tsx
@@ -0,0 +1,7 @@
+import { Icon } from '@chakra-ui/icon'
+
+export const NewspaperIcon = () => (
+  <Icon viewBox="0 0 512 512" fill="currentcolor">
+    <path d="M96 96c0-35.3 28.7-64 64-64H448c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H80c-44.2 0-80-35.8-80-80V128c0-17.7 14.3-32 32-32s32 14.3 32 32V400c0 8.8 7.2 16 16 16s16-7.2 16-16V96zm64 24v80c0 13.3 10.7 24 24 24H296c13.3 0 24-10.7 24-24V120c0-13.3-10.7-24-24-24H184c-13.3 0-24 10.7-24 24zm208-8c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16s-7.2-16-16-16H384c-8.8 0-16 7.2-16 16zm0 96c0 8.8 7.2 16 16 16h48c8.8 0 16-7.2 16-16s-7.2-16-16-16H384c-8.8 0-16 7.2-16 16zM160 304c0 8.8 7.2 16 16 16H432c8.8 0 16-7.2 16-16s-7.2-16-16-16H176c-8.8 0-16 7.2-16 16zm0 96c0 8.8 7.2 16 16 16H432c8.8 0 16-7.2 16-16s-7.2-16-16-16H176c-8.8 0-16 7.2-16 16z" />
+  </Icon>
+)
diff --git a/ee/apps/landing-page/assets/icons/PeopleCircleIcon.tsx b/ee/apps/landing-page/assets/icons/PeopleCircleIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const PeopleCircleIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/PersonAddIcon.tsx b/ee/apps/landing-page/assets/icons/PersonAddIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const PersonAddIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/ProductHuntIcon.tsx b/ee/apps/landing-page/assets/icons/ProductHuntIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 
 export const ProductHuntIcon = (props: IconProps) => (
   <Icon

diff --git a/ee/apps/landing-page/assets/icons/QuoteLeftIcon.tsx b/ee/apps/landing-page/assets/icons/QuoteLeftIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const QuoteLeftIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/assets/icons/RedditIcon.tsx b/ee/apps/landing-page/assets/icons/RedditIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 
 export const RedditIcon = (props: IconProps) => (
   <Icon

diff --git a/ee/apps/landing-page/assets/icons/ShareIcon.tsx b/ee/apps/landing-page/assets/icons/ShareIcon.tsx
@@ -1,4 +1,4 @@
-import Icon, { IconProps } from '@chakra-ui/icon'
+import { Icon, IconProps } from '@chakra-ui/icon'
 import React from 'react'
 
 export const ShareIcon = (props: IconProps) => (

diff --git a/ee/apps/landing-page/components/common/Header/_data.tsx b/ee/apps/landing-page/components/common/Header/_data.tsx
@@ -1,6 +1,6 @@
 import { GitHubIcon } from 'assets/icons'
 import { DocIcon } from 'assets/icons/DocIcon'
-import { MapIcon } from 'assets/icons/MapIcon'
+import { NewspaperIcon } from 'assets/icons/NewspaperIcon'
 import { PeopleCircleIcon } from 'assets/icons/PeopleCircleIcon'
 import * as React from 'react'
 
@@ -22,11 +22,11 @@ export const links = [
         icon: <DocIcon />,
       },
       {
-        label: 'Roadmap',
+        label: 'Blog',
         description:
-          "Follow the development and make suggestions for which features you'd like to see",
-        href: 'https://feedback.typebot.io/roadmap',
-        icon: <MapIcon />,
+          'Read the latest news and updates about Typebot and the chatbots ecosystem',
+        href: '/blog',
+        icon: <NewspaperIcon />,
       },
       {
         label: 'Community',

diff --git a/ee/apps/landing-page/package.json b/ee/apps/landing-page/package.json
@@ -11,19 +11,19 @@
     "analyze": "cross-env ANALYZE=true next build"
   },
   "dependencies": {
-    "@chakra-ui/icon": "3.0.15",
+    "@chakra-ui/icon": "3.2.0",
     "@chakra-ui/next-js": "2.2.0",
-    "@chakra-ui/react": "2.7.1",
-    "@emotion/react": "11.11.1",
-    "@emotion/styled": "11.11.0",
+    "@chakra-ui/react": "2.8.2",
+    "@emotion/react": "11.11.4",
+    "@emotion/styled": "11.11.5",
     "@typebot.io/billing": "workspace:*",
     "@typebot.io/lib": "workspace:*",
     "@typebot.io/nextjs": "workspace:*",
     "@typebot.io/prisma": "workspace:*",
     "@typebot.io/schemas": "workspace:*",
     "aos": "2.3.4",
     "focus-visible": "5.2.0",
-    "framer-motion": "10.12.20",
+    "framer-motion": "11.1.7",
     "next": "14.1.0",
     "next-mdx-remote": "4.4.1",
     "react": "18.2.0",
@@ -33,7 +33,7 @@
   },
   "devDependencies": {
     "@babel/core": "7.22.9",
-    "@chakra-ui/styled-system": "2.9.1",
+    "@chakra-ui/styled-system": "2.9.2",
     "@tailwindcss/typography": "0.5.12",
     "@typebot.io/env": "workspace:*",
     "@typebot.io/tsconfig": "workspace:*",