2
0

fix: 🐛 Minor changes and improved accessibility

This commit is contained in:
Baptiste Arnaud
2022-03-24 11:44:34 +01:00
parent bcff2e0c14
commit b784e8918e
9 changed files with 24 additions and 8 deletions

View File

@ -51,7 +51,7 @@ export const TypebotButton = ({
if (draggedTypebotDebounced) return
router.push(
isMobile
? `/typebots/${typebot.id}/results/responses`
? `/typebots/${typebot.id}/results`
: `/typebots/${typebot.id}/edit`
)
}

View File

@ -27,6 +27,7 @@ export const Edge = ({ edge }: { edge: EdgeProps }) => {
blocksCoordinates,
graphPosition,
isReadOnly,
setPreviewingEdge,
} = useGraph()
const [isMouseOver, setIsMouseOver] = useState(false)
const { isOpen, onOpen, onClose } = useDisclosure()
@ -92,8 +93,13 @@ export const Edge = ({ edge }: { edge: EdgeProps }) => {
const handleMouseLeave = () => setIsMouseOver(false)
const handleEdgeClick = (e: React.MouseEvent) => {
const handleEdgeClick = () => {
setPreviewingEdge(edge)
}
const handleContextMenuTrigger = (e: React.MouseEvent) => {
if (isReadOnly) return
e.preventDefault()
setEdgeMenuPosition({ x: e.clientX, y: e.clientY })
onOpen()
}
@ -113,6 +119,7 @@ export const Edge = ({ edge }: { edge: EdgeProps }) => {
onMouseEnter={handleMouseEnter}
onMouseLeave={handleMouseLeave}
onClick={handleEdgeClick}
onContextMenu={handleContextMenuTrigger}
/>
<path
data-testid="edge"

View File

@ -36,6 +36,7 @@ export const Graph = ({
setGraphPosition: setGlobalGraphPosition,
setOpenedStepId,
updateBlockCoordinates,
setPreviewingEdge,
} = useGraph()
const [graphPosition, setGraphPosition] = useState(graphPositionDefaultValue)
const [debouncedGraphPosition] = useDebounce(graphPosition, 200)
@ -98,7 +99,10 @@ export const Graph = ({
if (isRightClick) e.stopPropagation()
}
const handleClick = () => setOpenedStepId(undefined)
const handleClick = () => {
setOpenedStepId(undefined)
setPreviewingEdge(undefined)
}
useEventListener('wheel', handleMouseWheel, graphContainerRef.current)
useEventListener('mousedown', handleCaptureMouseDown, undefined, {

View File

@ -56,7 +56,7 @@ export const ButtonNodeContent = ({
}
return (
<Flex px={4} py={2} justify="center" w="full">
<Flex px={4} py={2} justify="center" w="90%">
<Editable
ref={editableRef}
flex="1"

View File

@ -13,6 +13,7 @@ export const TextBubbleContent = ({ step }: Props) => {
if (!typebot) return <></>
return (
<Flex
isTruncated
flexDir={'column'}
opacity={step.content.html === '' ? '0.5' : '1'}
className="slate-html-container"

View File

@ -54,7 +54,7 @@ export const TypebotHeader = () => {
bgColor="white"
flexShrink={0}
>
<HStack>
<HStack display={['none', 'flex']}>
<Button
as={NextChakraLink}
href={`/typebots/${typebot?.id}/edit`}
@ -126,6 +126,7 @@ export const TypebotHeader = () => {
)}
<Tooltip label="Undo">
<IconButton
display={['none', 'flex']}
icon={<UndoIcon />}
size="sm"
aria-label="Undo"
@ -136,6 +137,7 @@ export const TypebotHeader = () => {
<Tooltip label="Redo">
<IconButton
display={['none', 'flex']}
icon={<RedoIcon />}
size="sm"
aria-label="Redo"
@ -154,7 +156,7 @@ export const TypebotHeader = () => {
)}
</HStack>
<HStack right="40px" pos="absolute">
<HStack right="40px" pos="absolute" display={['none', 'flex']}>
<CollaborationMenuButton />
{router.pathname.includes('/edit') && isNotDefined(rightPanel) && (
<Button onClick={handlePreviewClick}>Preview</Button>

View File

@ -43,6 +43,7 @@ export const ResultsContent = () => {
w="full"
justifyContent="center"
h="60px"
display={['none', 'flex']}
>
<HStack maxW="1200px" w="full">
<Button
@ -70,7 +71,7 @@ export const ResultsContent = () => {
</Button>
</HStack>
</Flex>
<Flex pt="60px" w="full" justify="center">
<Flex pt={['10px', '60px']} w="full" justify="center">
{publishedTypebot &&
(isAnalytics ? (
<AnalyticsContent stats={stats} />

View File

@ -145,7 +145,7 @@ export const SubmissionsContent = ({
}
return (
<Stack maxW="1200px" w="full" pb="28">
<Stack maxW="1200px" w="full" pb="28" px={['4', '0']}>
{totalHiddenResults && (
<UnlockProPlanInfo
buttonLabel={`Unlock ${totalHiddenResults} results`}

View File

@ -15,6 +15,7 @@ export const SEO = ({
}: SEOProps) => (
<Head>
<title>{title ?? typebotName}</title>
<meta name="robots" content="noindex" />
<link
rel="icon"
type="image/png"