Skip to content

Commit 218b7b9

Browse files
github-actions[bot]tofikwest
github-actions[bot]
and
tofikwest
authored
[dev] [tofikwest] tofik/evidence-review-workflow (#2113)
* feat(tasks): add email templates and notification logic for evidence review requests * fix(tasks): adjust layout of TabsContent in SingleTask component --------- Co-authored-by: Tofik Hasanov <annexcies@gmail.com>
1 parent 38ac4f2 commit 218b7b9

31 files changed

Lines changed: 2602 additions & 204 deletions

‎apps/api/src/email/templates/evidence-bulk-review-requested.tsx‎

Lines changed: 137 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,137 @@
1+
import * as React from 'react';
2+
import {
3+
Body,
4+
Button,
5+
Container,
6+
Font,
7+
Heading,
8+
Html,
9+
Link,
10+
Preview,
11+
Section,
12+
Tailwind,
13+
Text,
14+
} from '@react-email/components';
15+
import { Footer } from '../components/footer';
16+
import { Logo } from '../components/logo';
17+
import { getUnsubscribeUrl } from '@trycompai/email';
18+
19+
interface TaskItem {
20+
title: string;
21+
url: string;
22+
}
23+
24+
interface Props {
25+
toName: string;
26+
toEmail: string;
27+
taskCount: number;
28+
submittedByName: string;
29+
organizationName: string;
30+
tasksUrl: string;
31+
tasks: TaskItem[];
32+
}
33+
34+
export const EvidenceBulkReviewRequestedEmail = ({
35+
toName,
36+
toEmail,
37+
taskCount,
38+
submittedByName,
39+
organizationName,
40+
tasksUrl,
41+
tasks,
42+
}: Props) => {
43+
const unsubscribeUrl = getUnsubscribeUrl(toEmail);
44+
const taskText = taskCount === 1 ? 'task' : 'tasks';
45+
46+
return (
47+
<Html>
48+
<Tailwind>
49+
<head>
50+
<Font
51+
fontFamily="Geist"
52+
fallbackFontFamily="Helvetica"
53+
fontWeight={400}
54+
fontStyle="normal"
55+
/>
56+
<Font
57+
fontFamily="Geist"
58+
fallbackFontFamily="Helvetica"
59+
fontWeight={500}
60+
fontStyle="normal"
61+
/>
62+
</head>
63+
<Preview>
64+
{`${taskCount} ${taskText} submitted for your review`}
65+
</Preview>
66+
67+
<Body className="mx-auto my-auto bg-[#fff] font-sans">
68+
<Container
69+
className="mx-auto my-[40px] max-w-[600px] border-transparent p-[20px] md:border-[#E8E7E1]"
70+
style={{ borderStyle: 'solid', borderWidth: 1 }}
71+
>
72+
<Logo />
73+
<Heading className="mx-0 my-[30px] p-0 text-center text-[24px] font-normal text-[#121212]">
74+
Evidence Review Requested
75+
</Heading>
76+
77+
<Text className="text-[14px] leading-[24px] text-[#121212]">
78+
Hello {toName},
79+
</Text>
80+
81+
<Text className="text-[14px] leading-[24px] text-[#121212]">
82+
<strong>{submittedByName}</strong> has submitted {taskCount}{' '}
83+
{taskText} for your review in <strong>{organizationName}</strong>.
84+
</Text>
85+
86+
<Text className="text-[14px] leading-[24px] text-[#121212]">
87+
Please review the evidence and approve or reject each task:
88+
</Text>
89+
90+
<Section className="mt-[16px] mb-[16px]">
91+
{tasks.map((task, index) => (
92+
<Text key={index} className="my-[4px] text-[14px] leading-[24px] text-[#121212]">
93+
{'• '}
94+
<Link href={task.url} className="text-[#121212] underline">
95+
{task.title}
96+
</Link>
97+
</Text>
98+
))}
99+
</Section>
100+
101+
<Section className="mt-[32px] mb-[32px] text-center">
102+
<Button
103+
className="rounded-[3px] bg-[#121212] px-[20px] py-[12px] text-center text-[14px] font-semibold text-white no-underline"
104+
href={tasksUrl}
105+
>
106+
Review Tasks
107+
</Button>
108+
</Section>
109+
110+
<Text className="text-[14px] leading-[24px] text-[#121212]">
111+
or copy and paste this URL into your browser:{' '}
112+
<a href={tasksUrl} className="text-[#121212] underline">
113+
{tasksUrl}
114+
</a>
115+
</Text>
116+
117+
<Section className="mt-[30px] mb-[20px]">
118+
<Text className="text-[12px] leading-[20px] text-[#666666]">
119+
Don't want to receive task assignment notifications?{' '}
120+
<Link href={unsubscribeUrl} className="text-[#121212] underline">
121+
Manage your email preferences
122+
</Link>
123+
.
124+
</Text>
125+
</Section>
126+
127+
<br />
128+
129+
<Footer />
130+
</Container>
131+
</Body>
132+
</Tailwind>
133+
</Html>
134+
);
135+
};
136+
137+
export default EvidenceBulkReviewRequestedEmail;

‎apps/api/src/email/templates/evidence-review-requested.tsx‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
import * as React from 'react';
2+
import {
3+
Body,
4+
Button,
5+
Container,
6+
Font,
7+
Heading,
8+
Html,
9+
Link,
10+
Preview,
11+
Section,
12+
Tailwind,
13+
Text,
14+
} from '@react-email/components';
15+
import { Footer } from '../components/footer';
16+
import { Logo } from '../components/logo';
17+
import { getUnsubscribeUrl } from '@trycompai/email';
18+
19+
interface Props {
20+
toName: string;
21+
toEmail: string;
22+
taskTitle: string;
23+
submittedByName: string;
24+
organizationName: string;
25+
taskUrl: string;
26+
}
27+
28+
export const EvidenceReviewRequestedEmail = ({
29+
toName,
30+
toEmail,
31+
taskTitle,
32+
submittedByName,
33+
organizationName,
34+
taskUrl,
35+
}: Props) => {
36+
const unsubscribeUrl = getUnsubscribeUrl(toEmail);
37+
38+
return (
39+
<Html>
40+
<Tailwind>
41+
<head>
42+
<Font
43+
fontFamily="Geist"
44+
fallbackFontFamily="Helvetica"
45+
fontWeight={400}
46+
fontStyle="normal"
47+
/>
48+
<Font
49+
fontFamily="Geist"
50+
fallbackFontFamily="Helvetica"
51+
fontWeight={500}
52+
fontStyle="normal"
53+
/>
54+
</head>
55+
<Preview>
56+
{`You've been requested to review evidence for "${taskTitle}"`}
57+
</Preview>
58+
59+
<Body className="mx-auto my-auto bg-[#fff] font-sans">
60+
<Container
61+
className="mx-auto my-[40px] max-w-[600px] border-transparent p-[20px] md:border-[#E8E7E1]"
62+
style={{ borderStyle: 'solid', borderWidth: 1 }}
63+
>
64+
<Logo />
65+
<Heading className="mx-0 my-[30px] p-0 text-center text-[24px] font-normal text-[#121212]">
66+
Evidence Review Requested
67+
</Heading>
68+
69+
<Text className="text-[14px] leading-[24px] text-[#121212]">
70+
Hello {toName},
71+
</Text>
72+
73+
<Text className="text-[14px] leading-[24px] text-[#121212]">
74+
<strong>{submittedByName}</strong> has submitted evidence for{' '}
75+
<strong>"{taskTitle}"</strong> and requested your approval in{' '}
76+
<strong>{organizationName}</strong>.
77+
</Text>
78+
79+
<Text className="text-[14px] leading-[24px] text-[#121212]">
80+
Please review the evidence and approve or reject it.
81+
</Text>
82+
83+
<Section className="mt-[32px] mb-[32px] text-center">
84+
<Button
85+
className="rounded-[3px] bg-[#121212] px-[20px] py-[12px] text-center text-[14px] font-semibold text-white no-underline"
86+
href={taskUrl}
87+
>
88+
Review Evidence
89+
</Button>
90+
</Section>
91+
92+
<Text className="text-[14px] leading-[24px] text-[#121212]">
93+
or copy and paste this URL into your browser:{' '}
94+
<a href={taskUrl} className="text-[#121212] underline">
95+
{taskUrl}
96+
</a>
97+
</Text>
98+
99+
<Section className="mt-[30px] mb-[20px]">
100+
<Text className="text-[12px] leading-[20px] text-[#666666]">
101+
Don't want to receive task assignment notifications?{' '}
102+
<Link href={unsubscribeUrl} className="text-[#121212] underline">
103+
Manage your email preferences
104+
</Link>
105+
.
106+
</Text>
107+
</Section>
108+
109+
<br />
110+
111+
<Footer />
112+
</Container>
113+
</Body>
114+
</Tailwind>
115+
</Html>
116+
);
117+
};
118+
119+
export default EvidenceReviewRequestedEmail;

0 commit comments

Comments
 (0)