Altera mensagem inicial para quando um fluxo é criado pela primeira vez em um projeto by willamyalves · Pull Request #138 · cloudhumans/typebot.io

willamyalves · 2026-01-16T17:07:47Z

Agora o popup mostra uma mensagem inicial de Boas Vindas ao Editor do Eddie com breves descrições sobre a ClaudIA e Eddie e como eles funcionam. Ao final enviamos link de primeiros passos do Eddie + imagem cosmética.

… um novo projeto (traduções inglês e espanhol inclusas)

apps/builder/src/features/editor/components/GettingStartedModal.tsx

…l.tsx Co-authored-by: Alexandre Machado <alexandre@machado.cc>

Copilot

Pull request overview

Esta PR altera a mensagem inicial exibida quando um fluxo é criado pela primeira vez em um projeto. Em vez de mostrar instruções detalhadas do editor com vídeos do YouTube, agora exibe uma mensagem de boas-vindas simples sobre o Eddie e ClaudIA, com um link para a FAQ e uma imagem cosmética.

Changes:

Substituição completa do conteúdo do modal de boas-vindas por texto explicativo sobre Eddie e ClaudIA
Adição de link para FAQ do Eddie e imagem decorativa
Melhoria no tratamento do parâmetro de query isFirstBot para lidar com arrays
Adição de novas chaves de tradução para busca de grupos no editor (pt-BR e en)

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 6 comments.

File	Description
apps/builder/src/i18n/pt-BR.json	Adiciona novas chaves de tradução para a mensagem de boas-vindas (paragraph, paragraph2-4, faq, imageEddie) e chaves de busca de grupos do editor
apps/builder/src/i18n/es.json	Adiciona as mesmas chaves de tradução da mensagem de boas-vindas em espanhol
apps/builder/src/i18n/en.json	Adiciona as mesmas chaves de tradução da mensagem de boas-vindas em inglês e chaves de busca de grupos
apps/builder/src/features/editor/components/GettingStartedModal.tsx	Simplifica drasticamente o componente removendo accordion, lista numerada e vídeos, substituindo por texto simples, link e imagem

apps/builder/src/i18n/pt-BR.json

apps/builder/src/i18n/es.json

Copilot · 2026-01-28T19:49:06Z

apps/builder/src/i18n/en.json

+  "editor.gettingStartedModal.editorBasics.list.paragraph2": "Here you can create and customize intelligent conversation flows for your bot. Eddie is designed to be intuitive, letting you add message blocks, integrations and logic in a simple, visual way.",
+  "editor.gettingStartedModal.editorBasics.list.paragraph3": "Eddie integrates seamlessly with ClaudIA, our customer support AI. This means you can combine automated flows with intelligent AI-generated responses to provide a smooth, efficient experience for your customers.",
+  "editor.gettingStartedModal.editorBasics.list.paragraph4": "To learn more about how Eddie works, its communication with ClaudIA, advanced interactions and usage tips, check out our full FAQ:",
+  "editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/pt_BR/categories/conhecendo-o-eddie",


The FAQ URL points to the Portuguese-BR version for the English translation. While users can switch languages on the FAQ site, it would provide a better user experience to link directly to an English version of the FAQ if available, or use a locale-neutral URL that redirects based on browser language.

Suggested change

"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/pt_BR/categories/conhecendo-o-eddie",

"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice",

Daria para por o link em cada idioma mesmo, temos a feat de traducao de faqs no CC

@gabrielbolner se deixar só o padrão "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice", ele puxa language do navegador ou é padrão pt_BR?

apps/builder/src/features/editor/components/GettingStartedModal.tsx

gabrielbolner · 2026-03-02T19:25:03Z

apps/builder/src/i18n/es.json

+  "editor.gettingStartedModal.editorBasics.list.imageEddie": "ClaudIA y Eddie felices en un bosque florecido",
  "editor.gettingStartedModal.editorBasics.list.four.label": "Previsualiza tu bot haciendo clic en el botón de previsualización en la esquina superior derecha",
  "editor.gettingStartedModal.editorBasics.list.label": "Si tienes alguna pregunta, no dudes en usar la burbuja en la esquina inferior derecha. Suelo responder en las próximas 24 horas.",
  "editor.gettingStartedModal.editorBasics.list.one.label": "La barra lateral izquierda contiene bloques que puedes arrastrar y soltar en el tablero.",


faltou essas keys no espanhol:

"editor.graph.search.title": "Search",
"editor.graph.search.placeholder": "Search groups...",
"editor.graph.search.description": "Type any text to search group titles.",
"editor.graph.search.noResults": "No results"

…l-eddie

Copilot

Pull request overview

Copilot reviewed 4 out of 5 changed files in this pull request and generated 11 comments.

Copilot · 2026-03-03T12:56:42Z

apps/builder/src/i18n/en.json

  "editor.gettingStartedModal.editorBasics.list.four.label": "Preview your bot by clicking the test button on the top right",
  "editor.gettingStartedModal.editorBasics.list.label": "Feel free to use the bottom-right bubble to reach out if you have any question. I usually answer within the next 24 hours.",


Os keys antigos editor.gettingStartedModal.editorBasics.list.four.label e editor.gettingStartedModal.editorBasics.list.label continuam no arquivo, mas não há mais referências a eles no código (o modal agora renderiza list.paragraph*). Sugestão: remover para evitar traduções órfãs.

Suggested change

"editor.gettingStartedModal.editorBasics.list.four.label": "Preview your bot by clicking the test button on the top right",

"editor.gettingStartedModal.editorBasics.list.label": "Feel free to use the bottom-right bubble to reach out if you have any question. I usually answer within the next 24 hours.",

Copilot · 2026-03-03T12:56:42Z

apps/builder/src/i18n/es.json

+  "editor.gettingStartedModal.editorBasics.list.paragraph2": "Aquí puedes crear y personalizar flujos de conversación inteligentes para tu bot. Eddie está diseñado para ser intuitivo, permitiéndote añadir bloques de mensajes, integraciones y lógica de forma sencilla y visual.",
+  "editor.gettingStartedModal.editorBasics.list.paragraph3": "Eddie se integra perfectamente con ClaudIA, nuestra IA de atención al cliente. Esto significa que puedes combinar flujos automatizados con respuestas inteligentes generadas por la IA, garantizando una experiencia fluida y eficiente para tus clientes.",
+  "editor.gettingStartedModal.editorBasics.list.paragraph4": "Para aprender más sobre cómo funciona Eddie, su comunicación con ClaudIA, interacciones avanzadas y consejos de uso, consulta nuestra FAQ completa:",
+  "editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/pt_BR/categories/conhecendo-o-eddie",


O valor de editor.gettingStartedModal.editorBasics.list.faq no es.json aponta para uma URL com locale pt_BR. Para UX consistente, ajuste para a versão em espanhol da FAQ (ou uma URL locale-neutral que redirecione).

Suggested change

"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/pt_BR/categories/conhecendo-o-eddie",

"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/categories/conhecendo-o-eddie",

Copilot · 2026-03-03T12:56:42Z

apps/builder/src/i18n/es.json

  "editor.gettingStartedModal.editorBasics.list.four.label": "Previsualiza tu bot haciendo clic en el botón de previsualización en la esquina superior derecha",
  "editor.gettingStartedModal.editorBasics.list.label": "Si tienes alguna pregunta, no dudes en usar la burbuja en la esquina inferior derecha. Suelo responder en las próximas 24 horas.",


Os keys antigos editor.gettingStartedModal.editorBasics.list.four.label e editor.gettingStartedModal.editorBasics.list.label continuam no arquivo, mas não há mais referências a eles no código (o modal agora renderiza list.paragraph*). Sugestão: remover para evitar traduções órfãs.

Suggested change

"editor.gettingStartedModal.editorBasics.list.four.label": "Previsualiza tu bot haciendo clic en el botón de previsualización en la esquina superior derecha",

"editor.gettingStartedModal.editorBasics.list.label": "Si tienes alguna pregunta, no dudes en usar la burbuja en la esquina inferior derecha. Suelo responder en las próximas 24 horas.",

Copilot · 2026-03-03T12:56:43Z

apps/builder/src/i18n/pt-BR.json

  "editor.gettingStartedModal.editorBasics.heading": "Fundamentos do Editor",
  "editor.gettingStartedModal.editorBasics.list.four.label": "Pré-visualize o seu bot ao clicar no botão de visualizar no canto superior direito",


Os keys editor.gettingStartedModal.editorBasics.heading e editor.gettingStartedModal.editorBasics.list.four.label não parecem mais ser usados em lugar nenhum (não há referências no codebase). Como o modal foi refeito para usar list.paragraph*, vale remover esses keys antigos para evitar traduções órfãs e reduzir custo de manutenção.

Suggested change

"editor.gettingStartedModal.editorBasics.heading": "Fundamentos do Editor",

"editor.gettingStartedModal.editorBasics.list.four.label": "Pré-visualize o seu bot ao clicar no botão de visualizar no canto superior direito",

Copilot · 2026-03-03T12:56:43Z

apps/builder/src/i18n/pt-BR.json

  "editor.gettingStartedModal.editorBasics.list.one.label": "A barra lateral esquerda contém blocos que podem ser arrastados e soltos no quadro.",
  "editor.gettingStartedModal.editorBasics.list.three.label": "Conecte os grupos entre eles",
  "editor.gettingStartedModal.editorBasics.list.two.label": "Você pode agrupar blocos juntos, colocando-os abaixo ou acima dos outros",


Os keys antigos editor.gettingStartedModal.editorBasics.list.one.label / two.label / three.label continuam no arquivo, mas não há mais referências a eles no código (o modal agora renderiza apenas list.paragraph*). Sugestão: remover esses keys para evitar traduções órfãs.

Suggested change

"editor.gettingStartedModal.editorBasics.list.one.label": "A barra lateral esquerda contém blocos que podem ser arrastados e soltos no quadro.",

"editor.gettingStartedModal.editorBasics.list.three.label": "Conecte os grupos entre eles",

"editor.gettingStartedModal.editorBasics.list.two.label": "Você pode agrupar blocos juntos, colocando-os abaixo ou acima dos outros",

Copilot · 2026-03-03T12:56:43Z

apps/builder/src/i18n/es.json

@@ -258,6 +258,12 @@
  "editor.blocks.bubbles.textEditor.searchVariable.placeholder": "Buscar una variable",
  "editor.blocks.start.text": "Inicio",
  "editor.gettingStartedModal.editorBasics.heading": "Conceptos básicos del Editor",


O key editor.gettingStartedModal.editorBasics.heading não parece mais ser usado em lugar nenhum (não há referências no codebase). Como o modal não exibe mais o heading, vale remover esse key para evitar traduções órfãs.

Suggested change

"editor.gettingStartedModal.editorBasics.heading": "Conceptos básicos del Editor",

Copilot · 2026-03-03T12:56:43Z

apps/builder/src/features/editor/components/GettingStartedModal.tsx

+          <Link href={t('editor.gettingStartedModal.editorBasics.list.faq')} isExternal>
+            <Text as="span" color="blue.500" _hover={{ textDecoration: 'underline', cursor: 'pointer' }}>
+              {t('editor.gettingStartedModal.editorBasics.list.faq')}
+            </Text>
+          </Link>

-          <Text>{t('editor.gettingStartedModal.editorBasics.list.label')}</Text>
-          <Stack spacing={4}>
-            <Heading fontSize="xl">
-              {t('editor.gettingStartedModal.seeAction.label')} ({`<`}{' '}
-              {t('editor.gettingStartedModal.seeAction.time')})
-            </Heading>
-            <iframe
-              width="100%"
-              height="315"
-              src="https://www.youtube.com/embed/jp3ggg_42-M"
-              title="YouTube video player"
-              allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-              allowFullScreen
-              style={{ borderRadius: '0.5rem', border: 'none' }}
-            />
-            <Accordion allowToggle>
-              <AccordionItem>
-                <AccordionButton>
-                  <Box flex="1" textAlign="left">
-                    {t('editor.gettingStartedModal.seeAction.item.label')}
-                  </Box>
-                  <AccordionIcon />
-                </AccordionButton>
-                <AccordionPanel py={10} as={Stack} spacing="10">
-                  <iframe
-                    width="100%"
-                    height="315"
-                    src="https://www.youtube.com/embed/6BudIC4GYNk"
-                    title="YouTube video player"
-                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-                    allowFullScreen
-                    style={{ borderRadius: '0.5rem', border: 'none' }}
-                  />
-                  <iframe
-                    width="100%"
-                    height="315"
-                    src="https://www.youtube.com/embed/ZuyDwFLRbfQ"
-                    title="YouTube video player"
-                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-                    allowFullScreen
-                    style={{ borderRadius: '0.5rem', border: 'none' }}
-                  />
-                </AccordionPanel>
-              </AccordionItem>
-            </Accordion>
-          </Stack>
+          {/* FAQ image */}
+          <Image
+            src={eddieImage.src}
+            alt={t('editor.gettingStartedModal.editorBasics.list.imageEddie')}
+            mt={4}
+            borderRadius="md"
+            maxW="100%"
+/>


A formatação desse bloco JSX parece ter ficado fora do padrão (ex.: a tag de fechamento do <Image /> está desalinhada e o <Text ... _hover={...}> está em uma linha muito longa). Para evitar diffs ruidosos e manter consistência, rode o formatter (Prettier) e ajuste a indentação/line breaks aqui.

Copilot · 2026-03-03T12:56:44Z

apps/builder/src/i18n/pt-BR.json

+  "editor.graph.search.title": "Pesquisar",
+  "editor.graph.search.placeholder": "Pesquisar grupos...",
+  "editor.graph.search.description": "Digite qualquer texto para buscar os títulos dos grupos.",
+  "editor.graph.search.noResults": "Nenhum resultado"


Esses keys editor.graph.search.* foram adicionados aqui, mas não há nenhuma referência a eles no código (nenhum t('editor.graph.search...') no repo) e isso não parece fazer parte do objetivo descrito no PR. Se não houver UI correspondente neste PR, considere remover esses keys ou incluir a mudança de UI que os consome.

Copilot · 2026-03-03T12:56:44Z

apps/builder/src/i18n/en.json

+  "editor.gettingStartedModal.editorBasics.list.paragraph2": "Here you can create and customize intelligent conversation flows for your bot. Eddie is designed to be intuitive, letting you add message blocks, integrations and logic in a simple, visual way.",
+  "editor.gettingStartedModal.editorBasics.list.paragraph3": "Eddie integrates seamlessly with ClaudIA, our customer support AI. This means you can combine automated flows with intelligent AI-generated responses to provide a smooth, efficient experience for your customers.",
+  "editor.gettingStartedModal.editorBasics.list.paragraph4": "To learn more about how Eddie works, its communication with ClaudIA, advanced interactions and usage tips, check out our full FAQ:",
+  "editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/pt_BR/categories/conhecendo-o-eddie",


O valor de editor.gettingStartedModal.editorBasics.list.faq no en.json ainda aponta para uma URL com locale pt_BR. Para UX consistente, ajuste para a versão em inglês da FAQ (ou uma URL locale-neutral que redirecione).

Suggested change

"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/pt_BR/categories/conhecendo-o-eddie",

"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice",

Copilot · 2026-03-03T12:56:44Z

apps/builder/src/i18n/en.json

@@ -258,6 +258,12 @@
  "editor.blocks.bubbles.textEditor.searchVariable.placeholder": "Search for a variable",
  "editor.blocks.start.text": "Start",
  "editor.gettingStartedModal.editorBasics.heading": "Editor Basics",


O key editor.gettingStartedModal.editorBasics.heading não parece mais ser usado em lugar nenhum (não há referências no codebase). Como o modal não exibe mais o heading, vale remover esse key para evitar traduções órfãs.

Copilot · 2026-03-12T13:17:40Z

@willamyalves I've opened a new pull request, #172, to work on those changes. Once the pull request is ready, I'll request review from you.

Altera mensagem inicial quando um fluxo é criado pela primeira vez em…

867b1c6

… um novo projeto (traduções inglês e espanhol inclusas)

alexandre-machado reviewed Jan 20, 2026

View reviewed changes

apps/builder/src/features/editor/components/GettingStartedModal.tsx Outdated Show resolved Hide resolved

alexandre-machado reviewed Jan 20, 2026

View reviewed changes

apps/builder/src/features/editor/components/GettingStartedModal.tsx Outdated Show resolved Hide resolved

alexandre-machado added the Free Build Day 🎉 label Jan 20, 2026

Update apps/builder/src/features/editor/components/GettingStartedModa…

663dfb1

…l.tsx Co-authored-by: Alexandre Machado <alexandre@machado.cc>

Copilot AI review requested due to automatic review settings January 28, 2026 19:45

Copilot started reviewing on behalf of willamyalves January 28, 2026 19:45 View session

Copilot AI reviewed Jan 28, 2026

View reviewed changes

add eddie image to repo

6075bbc

willamyalves self-assigned this Feb 25, 2026

gabrielbolner reviewed Mar 2, 2026

View reviewed changes

alexandre-machado approved these changes Mar 3, 2026

View reviewed changes

Merge remote-tracking branch 'origin/main' into melhoria-popup-inicia…

a201ce6

…l-eddie

Copilot AI review requested due to automatic review settings March 3, 2026 12:52

Copilot started reviewing on behalf of alexandre-machado March 3, 2026 12:52 View session

Copilot AI reviewed Mar 3, 2026

View reviewed changes

🎨 add translations and improve Getting Started modal content

8283edd

Copilot AI mentioned this pull request Mar 12, 2026

Remove orphaned gettingStartedModal translation keys from all locale files #172

Draft

	"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice/pt_BR/categories/conhecendo-o-eddie",
	"editor.gettingStartedModal.editorBasics.list.faq": "https://cloudchat.cloudhumans.com/hc/eddie-claudia-backoffice",

Conversation

willamyalves commented Jan 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jan 28, 2026

Choose a reason for hiding this comment

Uh oh!

gabrielbolner Mar 2, 2026

Choose a reason for hiding this comment

Uh oh!

willamyalves Mar 12, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

gabrielbolner Mar 2, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Mar 3, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI commented Mar 12, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

willamyalves commented Jan 16, 2026 •

edited

Loading