♿ (editor) Allow empty group titles

apps/builder/src/features/blocks/integrations/webhook/api/procedures/listWebhookBlocksProcedure.ts

@@ -3,7 +3,7 @@ import { canReadTypebots } from '@/utils/api/dbRules'
 import { authenticatedProcedure } from '@/utils/server/trpc'
 import { TRPCError } from '@trpc/server'
 import { Group, Typebot, Webhook, WebhookBlock } from 'models'
-import { byId, isWebhookBlock } from 'utils'
+import { byId, isWebhookBlock, parseGroupTitle } from 'utils'
 import { z } from 'zod'
 
 export const listWebhookBlocksProcedure = authenticatedProcedure
@@ -55,7 +55,7 @@ export const listWebhookBlocksProcedure = authenticatedProcedure
         ...webhookBlocks,
         ...blocks.map((b) => ({
           id: b.id,
-          label: `${group.title} > ${b.id}`,
+          label: `${parseGroupTitle(group.title)} > ${b.id}`,
           url: typebot?.webhooks.find(byId(b.webhookId))?.url ?? undefined,
         })),
       ]

apps/builder/src/features/blocks/logic/jump/components/JumpNodeBody.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Tag, Text } from '@chakra-ui/react'
 import { useTypebot } from '@/features/editor'
-import { byId, isDefined } from 'utils'
+import { byId, isDefined, parseGroupTitle } from 'utils'
 import { JumpBlock } from 'models/features/blocks/logic/jump'
 
 type Props = {
@@ -15,7 +15,8 @@ export const JumpNodeBody = ({ options }: Props) => {
   if (!selectedGroup) return <Text color="gray.500">Configure...</Text>
   return (
     <Text>
-      Jump to <Tag colorScheme="blue">{selectedGroup.title}</Tag>{' '}
+      Jump to{' '}
+      <Tag colorScheme="blue">{parseGroupTitle(selectedGroup.title)}</Tag>{' '}
       {isDefined(blockIndex) && blockIndex >= 0 ? (
         <>
           at block <Tag colorScheme="blue">{blockIndex + 1}</Tag>

apps/builder/src/features/blocks/logic/jump/components/JumpSettings.tsx

@@ -3,7 +3,7 @@ import { useTypebot } from '@/features/editor'
 import { Stack } from '@chakra-ui/react'
 import { JumpBlock } from 'models/features/blocks/logic/jump'
 import React from 'react'
-import { byId } from 'utils'
+import { byId, parseGroupTitle } from 'utils'
 
 type Props = {
   groupId: string
@@ -32,7 +32,7 @@ export const JumpSettings = ({ groupId, options, onOptionsChange }: Props) => {
         items={typebot.groups
           .filter((group) => group.id !== currentGroupId)
           .map((group) => ({
-            label: group.title,
+            label: parseGroupTitle(group.title),
             value: group.id,
           }))}
         selectedItem={selectedGroup?.id}

apps/builder/src/features/blocks/logic/typebotLink/components/TypebotLinkForm/GroupsDropdown.tsx

@@ -1,6 +1,7 @@
 import { Select } from '@/components/inputs/Select'
 import { Input } from '@chakra-ui/react'
 import { Group } from 'models'
+import { parseGroupTitle } from 'utils'
 
 type Props = {
   groups: Group[]
@@ -22,7 +23,7 @@ export const GroupsDropdown = ({
     <Select
       selectedItem={groupId}
       items={(groups ?? []).map((group) => ({
-        label: group.title,
+        label: parseGroupTitle(group.title),
         value: group.id,
       }))}
       onSelect={onGroupIdSelected}