📝 Add v2.26 newsletter
This commit is contained in:
Baptiste Arnaud
Binary file not shown.
|
After Width: | Height: | Size: 12 MiB |
BIN
apps/builder/public/images/emails/V2dot26Update/nocodb.jpg
Normal file
BIN
apps/builder/public/images/emails/V2dot26Update/nocodb.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 962 KiB |
98
packages/transactional/templates/marketing/V2dot26Update.tsx
Normal file
98
packages/transactional/templates/marketing/V2dot26Update.tsx
Normal file
@ -0,0 +1,98 @@
|
|||||||
|
import { Text, Hr } from '@react-email/components'
|
||||||
|
import * as React from 'react'
|
||||||
|
import { env } from '@typebot.io/env'
|
||||||
|
import { text, hr } from './styles'
|
||||||
|
import { NewsletterLayout } from './components/NewsletterLayout'
|
||||||
|
import { NewsletterSection } from './components/NewsletterSection'
|
||||||
|
|
||||||
|
const imagesBaseUrl = `${env.NEXTAUTH_URL}/images/emails/V2dot26Update`
|
||||||
|
|
||||||
|
export const V2dot26Update = () => (
|
||||||
|
<NewsletterLayout preview="Unveiling Typebot's Latest Innovations - v2.26 Update! 🌟">
|
||||||
|
<Text style={text}>
|
||||||
|
Heya, <br />
|
||||||
|
<br />
|
||||||
|
Typebot v2.26 was just released. It comes with cool new stuff.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
Let's dive into what's new! 🔥
|
||||||
|
</Text>
|
||||||
|
|
||||||
|
<NewsletterSection
|
||||||
|
title="NocoDB block"
|
||||||
|
image={{
|
||||||
|
src: `${imagesBaseUrl}/nocodb.jpg`,
|
||||||
|
alt: 'New NocoDB block',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
The NocoDB block is a new block that allows you to store and retrieve data
|
||||||
|
from a NocoDB database. It's a powerful tool for building applications
|
||||||
|
that require data storage and retrieval.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
Finally, a great open-source alternative to existing Google Sheets block.
|
||||||
|
</NewsletterSection>
|
||||||
|
|
||||||
|
<NewsletterSection
|
||||||
|
title="Variables panel"
|
||||||
|
image={{
|
||||||
|
alt: 'Variables panel',
|
||||||
|
src: `${imagesBaseUrl}/variablesPanel.gif`,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Allows you to see all your variables at a glance and edit them with much
|
||||||
|
more comfort 💆
|
||||||
|
</NewsletterSection>
|
||||||
|
|
||||||
|
<NewsletterSection title="Transcript variable">
|
||||||
|
The "Set variable" block now has a "Transcript" value option. This injects
|
||||||
|
the entire conversation transcript in a variable. This is useful if you
|
||||||
|
need to provide context for an AI block. <br />
|
||||||
|
<br />
|
||||||
|
For example you could add in a system prompt:
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
"Your answer should be based on the context inside the <context> XML
|
||||||
|
element:
|
||||||
|
<br />
|
||||||
|
<context>{'{{'}Transcript{'}}'}</context>"
|
||||||
|
</NewsletterSection>
|
||||||
|
|
||||||
|
<NewsletterSection
|
||||||
|
title="New container theme options"
|
||||||
|
image={{
|
||||||
|
alt: 'Chat window theme options demo',
|
||||||
|
src: `${imagesBaseUrl}/chatContainerThemeOptions.gif`,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
You can now customize the chat window theme with the new container theme
|
||||||
|
options. This allows you to change the background color, border color, and
|
||||||
|
text color of the chat window.
|
||||||
|
</NewsletterSection>
|
||||||
|
|
||||||
|
<NewsletterSection title="New templates">
|
||||||
|
🏃 Quick Carb Calculator - Designed specifically for athlete fueling
|
||||||
|
brands looking to attract and engage active audiences, this chatbot serves
|
||||||
|
as an effective lead magnet by providing instant, customized carbohydrate
|
||||||
|
intake recommendations based on user input.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
💆♀️ Skin Typology - A skin typology expert bot designed as a lead magnet
|
||||||
|
for Typology, this bot asks a series of personalized questions to
|
||||||
|
determine the user's unique skin type. He then receives a detailed
|
||||||
|
diagnosis and tailored skincare AI-based recommendations.
|
||||||
|
</NewsletterSection>
|
||||||
|
|
||||||
|
<Hr style={hr} />
|
||||||
|
|
||||||
|
<Text style={{ ...text, marginBottom: '60px' }}>
|
||||||
|
As always, your feedback is invaluable, so please don't hesitate to share
|
||||||
|
your thoughts.
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
Baptiste.
|
||||||
|
</Text>
|
||||||
|
</NewsletterLayout>
|
||||||
|
)
|
||||||
|
|
||||||
|
export default V2dot26Update
|
||||||
@ -0,0 +1,55 @@
|
|||||||
|
import {
|
||||||
|
Html,
|
||||||
|
Head,
|
||||||
|
Preview,
|
||||||
|
Body,
|
||||||
|
Container,
|
||||||
|
Img,
|
||||||
|
Link,
|
||||||
|
Text,
|
||||||
|
} from '@react-email/components'
|
||||||
|
import { main, container, footer, link } from '../styles'
|
||||||
|
import { env } from '@typebot.io/env'
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
children: React.ReactNode
|
||||||
|
preview: string
|
||||||
|
}
|
||||||
|
export const NewsletterLayout = ({ preview, children }: Props) => (
|
||||||
|
<Html>
|
||||||
|
<Head />
|
||||||
|
<Preview>{preview}</Preview>
|
||||||
|
<Body style={main}>
|
||||||
|
<Container style={container}>
|
||||||
|
<Img
|
||||||
|
src={`${env.NEXTAUTH_URL}/images/logo.png`}
|
||||||
|
width="32"
|
||||||
|
height="32"
|
||||||
|
alt="Typebot's Logo"
|
||||||
|
style={{
|
||||||
|
margin: '24px 0',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
{children}
|
||||||
|
<Img
|
||||||
|
src={`${env.NEXTAUTH_URL}/images/logo.png`}
|
||||||
|
width="32"
|
||||||
|
height="32"
|
||||||
|
alt="Typebot's Logo"
|
||||||
|
style={{
|
||||||
|
marginTop: '24px',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Text style={footer}>Typebot.io - Powering Conversations at Scale</Text>
|
||||||
|
<Link
|
||||||
|
href="{{unsubscribe}}"
|
||||||
|
target="_blank"
|
||||||
|
style={{ ...link, color: '#898989', fontSize: '12px' }}
|
||||||
|
>
|
||||||
|
Unsubscribe
|
||||||
|
</Link>
|
||||||
|
</Container>
|
||||||
|
</Body>
|
||||||
|
</Html>
|
||||||
|
)
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
import { Img, Text, Heading, Section } from '@react-email/components'
|
||||||
|
import { featureSection, heading, text, image as imageStyle } from '../styles'
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
title: string
|
||||||
|
children: React.ReactNode
|
||||||
|
image?: {
|
||||||
|
src: string
|
||||||
|
alt: string
|
||||||
|
}
|
||||||
|
}
|
||||||
|
export const NewsletterSection = ({ title, image, children }: Props) => (
|
||||||
|
<Section style={featureSection}>
|
||||||
|
<Heading style={heading}>{title}</Heading>
|
||||||
|
<Text style={text}>{children}</Text>
|
||||||
|
{image && <Img src={image.src} alt={image.alt} style={imageStyle} />}
|
||||||
|
</Section>
|
||||||
|
)
|
||||||
Reference in New Issue
Block a user