47 lines
1.3 KiB
TypeScript
47 lines
1.3 KiB
TypeScript
import { Text } from '@react-email/components';
|
|
import React from 'react';
|
|
import { z } from 'zod';
|
|
import { Layout } from '../components/layout';
|
|
import { List } from '../components/list';
|
|
|
|
export const zOnboardingWhatToTrack = z.object({
|
|
firstName: z.string().optional(),
|
|
});
|
|
|
|
export type Props = z.infer<typeof zOnboardingWhatToTrack>;
|
|
export default OnboardingWhatToTrack;
|
|
export function OnboardingWhatToTrack({
|
|
firstName,
|
|
unsubscribeUrl,
|
|
}: Props & { unsubscribeUrl?: string }) {
|
|
return (
|
|
<Layout unsubscribeUrl={unsubscribeUrl}>
|
|
<Text>Hi{firstName ? ` ${firstName}` : ''},</Text>
|
|
<Text>
|
|
Tracking can be overwhelming at first, and that's why its important to
|
|
focus on what's matters. For most products, that's something like:
|
|
</Text>
|
|
<List
|
|
items={[
|
|
'Find good funnels to track (onboarding or checkout)',
|
|
'Conversions (how many clicks your hero CTA)',
|
|
'What did the user do after clicking the CTA',
|
|
]}
|
|
/>
|
|
<Text>
|
|
Start small and incrementally add more events as you go is usually the
|
|
best approach.
|
|
</Text>
|
|
<Text>
|
|
If you're not sure whether something's worth tracking, or have any
|
|
questions, just reply here.
|
|
</Text>
|
|
<Text>
|
|
Best regards,
|
|
<br />
|
|
Carl
|
|
</Text>
|
|
</Layout>
|
|
);
|
|
}
|