fix(bot): mobile keyboard covering input

packages/bot-engine/src/components/ChatGroup/ChatBlock/inputs/TextForm/TextInputContent.tsx

@@ -14,6 +14,7 @@ import React, {
   useRef,
 } from 'react'
 import PhoneInput, { Value, Country } from 'react-phone-number-input'
+import { isMobile } from 'services/utils'
 
 type TextInputProps = {
   block:
@@ -30,8 +31,7 @@ export const TextInput = ({ block, value, onChange }: TextInputProps) => {
   const inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null)
 
   useEffect(() => {
-    if (!inputRef.current) return
-    inputRef.current.focus()
+    setTimeout(() => inputRef.current?.focus(), isMobile ? 500 : 0)
   }, [])
 
   const handleInputChange = (

packages/bot-engine/src/services/utils.ts

@@ -5,3 +5,7 @@ export const sanitizeUrl = (url: string): string =>
   url.startsWith('sms:')
     ? url
     : `https://${url}`
+
+export const isMobile =
+  typeof window !== 'undefined' &&
+  window.matchMedia('only screen and (max-width: 760px)').matches