🚸 Improve support accessibility

Add documentation button in board menu and hide the support bubble in the editor. Makes it accessible only by clicking the "Help" button

apps/builder/src/components/SupportBubble.tsx

@@ -3,16 +3,14 @@ import { useUser } from '@/features/account/hooks/useUser'
 import { useWorkspace } from '@/features/workspace/WorkspaceProvider'
 import React from 'react'
 import { Bubble } from '@typebot.io/react'
-import { isCloudProdInstance } from '@/helpers/isCloudProdInstance'
 import { planToReadable } from '@/features/billing/helpers/planToReadable'
+import { BubbleProps } from '@typebot.io/js'
 
-export const SupportBubble = () => {
+export const SupportBubble = (props: Omit<BubbleProps, 'typebot'>) => {
   const { typebot } = useTypebot()
   const { user } = useUser()
   const { workspace } = useWorkspace()
 
-  if (!isCloudProdInstance) return null
-
   return (
     <Bubble
       apiHost="https://viewer.typebot.io"
@@ -30,6 +28,7 @@ export const SupportBubble = () => {
           backgroundColor: '#fff',
         },
       }}
+      {...props}
     />
   )
 }

apps/builder/src/components/icons.tsx

@@ -621,3 +621,10 @@ export const SmileIcon = (props: IconProps) => (
     <line x1="15" y1="9" x2="15.01" y2="9"></line>
   </Icon>
 )
+
+export const BookIcon = (props: IconProps) => (
+  <Icon viewBox="0 0 24 24" {...featherIconsBaseProps} {...props}>
+    <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path>
+    <path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path>
+  </Icon>
+)