@tracked/emails 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (116) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +211 -0
  3. package/dist/emails/bodyweight-goal-reached.d.ts +14 -0
  4. package/dist/emails/bodyweight-goal-reached.d.ts.map +1 -0
  5. package/dist/emails/bodyweight-goal-reached.js +177 -0
  6. package/dist/emails/bodyweight-goal-reached.js.map +1 -0
  7. package/dist/emails/client-accepted-invitation.d.ts +10 -0
  8. package/dist/emails/client-accepted-invitation.d.ts.map +1 -0
  9. package/dist/emails/client-accepted-invitation.js +99 -0
  10. package/dist/emails/client-accepted-invitation.js.map +1 -0
  11. package/dist/emails/coach-invite.d.ts +10 -0
  12. package/dist/emails/coach-invite.d.ts.map +1 -0
  13. package/dist/emails/coach-invite.js +126 -0
  14. package/dist/emails/coach-invite.js.map +1 -0
  15. package/dist/emails/coach-removed-client.d.ts +8 -0
  16. package/dist/emails/coach-removed-client.d.ts.map +1 -0
  17. package/dist/emails/coach-removed-client.js +80 -0
  18. package/dist/emails/coach-removed-client.js.map +1 -0
  19. package/dist/emails/direct-message.d.ts +11 -0
  20. package/dist/emails/direct-message.d.ts.map +1 -0
  21. package/dist/emails/direct-message.js +103 -0
  22. package/dist/emails/direct-message.js.map +1 -0
  23. package/dist/emails/feature-discovery.d.ts +11 -0
  24. package/dist/emails/feature-discovery.d.ts.map +1 -0
  25. package/dist/emails/feature-discovery.js +121 -0
  26. package/dist/emails/feature-discovery.js.map +1 -0
  27. package/dist/emails/first-workout-assigned.d.ts +10 -0
  28. package/dist/emails/first-workout-assigned.d.ts.map +1 -0
  29. package/dist/emails/first-workout-assigned.js +98 -0
  30. package/dist/emails/first-workout-assigned.js.map +1 -0
  31. package/dist/emails/first-workout-completed.d.ts +11 -0
  32. package/dist/emails/first-workout-completed.d.ts.map +1 -0
  33. package/dist/emails/first-workout-completed.js +129 -0
  34. package/dist/emails/first-workout-completed.js.map +1 -0
  35. package/dist/emails/index.d.ts +7 -0
  36. package/dist/emails/index.d.ts.map +1 -0
  37. package/dist/emails/index.js +7 -0
  38. package/dist/emails/index.js.map +1 -0
  39. package/dist/emails/new-follower.d.ts +11 -0
  40. package/dist/emails/new-follower.d.ts.map +1 -0
  41. package/dist/emails/new-follower.js +98 -0
  42. package/dist/emails/new-follower.js.map +1 -0
  43. package/dist/emails/subscription-canceled.d.ts +10 -0
  44. package/dist/emails/subscription-canceled.d.ts.map +1 -0
  45. package/dist/emails/subscription-canceled.js +131 -0
  46. package/dist/emails/subscription-canceled.js.map +1 -0
  47. package/dist/emails/support-email.d.ts +8 -0
  48. package/dist/emails/support-email.d.ts.map +1 -0
  49. package/dist/emails/support-email.js +40 -0
  50. package/dist/emails/support-email.js.map +1 -0
  51. package/dist/emails/team-invite.d.ts +11 -0
  52. package/dist/emails/team-invite.d.ts.map +1 -0
  53. package/dist/emails/team-invite.js +100 -0
  54. package/dist/emails/team-invite.js.map +1 -0
  55. package/dist/emails/team-member-removed-email.d.ts +8 -0
  56. package/dist/emails/team-member-removed-email.d.ts.map +1 -0
  57. package/dist/emails/team-member-removed-email.js +97 -0
  58. package/dist/emails/team-member-removed-email.js.map +1 -0
  59. package/dist/emails/tracked-magic-link-activate.d.ts +7 -0
  60. package/dist/emails/tracked-magic-link-activate.d.ts.map +1 -0
  61. package/dist/emails/tracked-magic-link-activate.js +93 -0
  62. package/dist/emails/tracked-magic-link-activate.js.map +1 -0
  63. package/dist/emails/tracked-magic-link.d.ts +7 -0
  64. package/dist/emails/tracked-magic-link.d.ts.map +1 -0
  65. package/dist/emails/tracked-magic-link.js +101 -0
  66. package/dist/emails/tracked-magic-link.js.map +1 -0
  67. package/dist/emails/week-one-checkin.d.ts +10 -0
  68. package/dist/emails/week-one-checkin.d.ts.map +1 -0
  69. package/dist/emails/week-one-checkin.js +141 -0
  70. package/dist/emails/week-one-checkin.js.map +1 -0
  71. package/dist/emails/welcome.d.ts +8 -0
  72. package/dist/emails/welcome.d.ts.map +1 -0
  73. package/dist/emails/welcome.js +146 -0
  74. package/dist/emails/welcome.js.map +1 -0
  75. package/dist/index.d.ts +22 -0
  76. package/dist/index.d.ts.map +1 -0
  77. package/dist/index.js +24 -0
  78. package/dist/index.js.map +1 -0
  79. package/dist/utils/email-validation.d.ts +48 -0
  80. package/dist/utils/email-validation.d.ts.map +1 -0
  81. package/dist/utils/email-validation.js +72 -0
  82. package/dist/utils/email-validation.js.map +1 -0
  83. package/dist/utils/index.d.ts +8 -0
  84. package/dist/utils/index.d.ts.map +1 -0
  85. package/dist/utils/index.js +8 -0
  86. package/dist/utils/index.js.map +1 -0
  87. package/dist/utils/username-validation.d.ts +54 -0
  88. package/dist/utils/username-validation.d.ts.map +1 -0
  89. package/dist/utils/username-validation.js +76 -0
  90. package/dist/utils/username-validation.js.map +1 -0
  91. package/package.json +78 -0
  92. package/src/emails/bodyweight-goal-reached.tsx +396 -0
  93. package/src/emails/client-accepted-invitation.tsx +258 -0
  94. package/src/emails/coach-invite.tsx +270 -0
  95. package/src/emails/coach-removed-client.tsx +212 -0
  96. package/src/emails/direct-message.tsx +249 -0
  97. package/src/emails/feature-discovery.tsx +289 -0
  98. package/src/emails/first-workout-assigned.tsx +255 -0
  99. package/src/emails/first-workout-completed.tsx +312 -0
  100. package/src/emails/index.tsx +6 -0
  101. package/src/emails/new-follower.tsx +260 -0
  102. package/src/emails/subscription-canceled.tsx +311 -0
  103. package/src/emails/support-email.tsx +80 -0
  104. package/src/emails/team-invite.tsx +262 -0
  105. package/src/emails/team-member-removed-email.tsx +240 -0
  106. package/src/emails/tracked-magic-link-activate.tsx +252 -0
  107. package/src/emails/tracked-magic-link.tsx +264 -0
  108. package/src/emails/week-one-checkin.tsx +353 -0
  109. package/src/emails/welcome.tsx +341 -0
  110. package/src/index.ts +57 -0
  111. package/src/utils/email-validation.test.ts +78 -0
  112. package/src/utils/email-validation.ts +80 -0
  113. package/src/utils/index.ts +13 -0
  114. package/src/utils/username-validation.test.ts +118 -0
  115. package/src/utils/username-validation.ts +89 -0
  116. package/static/tracked-logo.png +0 -0
@@ -0,0 +1,289 @@
1
+ import React from "react";
2
+ import {
3
+ Body,
4
+ Column,
5
+ Container,
6
+ Head,
7
+ Hr,
8
+ Html,
9
+ Img,
10
+ Link,
11
+ Preview,
12
+ Row,
13
+ Section,
14
+ Text,
15
+ } from "@react-email/components";
16
+
17
+ interface FeatureDiscoveryEmailProps {
18
+ userName: string;
19
+ featureName: string;
20
+ featureDescription: string;
21
+ featureBenefits: string[];
22
+ featureUrl: string;
23
+ websiteUrl: string;
24
+ }
25
+
26
+ const baseUrl = "https://tracked.gg/android-chrome-192x192.png";
27
+
28
+ export const FeatureDiscoveryEmail = ({
29
+ userName,
30
+ featureName,
31
+ featureDescription,
32
+ featureBenefits,
33
+ featureUrl,
34
+ websiteUrl = "https://tracked.gg",
35
+ }: FeatureDiscoveryEmailProps) => {
36
+ return (
37
+ <Html>
38
+ <Head>
39
+ <meta name="color-scheme" content="light only" />
40
+ <meta name="supported-color-schemes" content="light only" />
41
+ </Head>
42
+ <Preview>Discover {featureName} on Tracked</Preview>
43
+ <Body style={main}>
44
+ <Container style={container}>
45
+ <Section style={box}>
46
+ <Row style={{ marginBottom: "8px" }}>
47
+ <Column style={{ width: "auto", verticalAlign: "middle" }}>
48
+ <Img src={`${baseUrl}`} width="28" height="28" alt="Tracked" />
49
+ </Column>
50
+ <Column
51
+ style={{
52
+ width: "auto",
53
+ verticalAlign: "middle",
54
+ paddingLeft: "4px",
55
+ }}
56
+ >
57
+ <Text
58
+ style={{
59
+ fontSize: "28px",
60
+ fontWeight: "900",
61
+ fontFamily:
62
+ "Raleway, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
63
+ color: "#020617",
64
+ margin: "0",
65
+ lineHeight: "32px",
66
+ letterSpacing: "0.5px",
67
+ }}
68
+ >
69
+ TRACKED
70
+ </Text>
71
+ </Column>
72
+ </Row>
73
+ <Hr style={hr} />
74
+
75
+ <Section style={{ textAlign: "center" as const, margin: "16px 0" }}>
76
+ <Text style={{ fontSize: "36px", margin: "0" }}>💡</Text>
77
+ </Section>
78
+
79
+ <Text style={heading}>Unlock More with Tracked</Text>
80
+ <Text style={paragraph}>
81
+ Hi {userName}, we noticed you haven't tried {featureName} yet - a
82
+ powerful feature that could take your training to the next level.
83
+ </Text>
84
+
85
+ <Section style={featureBox}>
86
+ <Text style={featureHeading}>{featureName}</Text>
87
+ <Text style={featureDescriptionStyle}>{featureDescription}</Text>
88
+ </Section>
89
+
90
+ {featureBenefits.length > 0 && (
91
+ <Section style={benefitsBox}>
92
+ <Text style={benefitsHeading}>Why you'll love it:</Text>
93
+ <ul style={benefitsList}>
94
+ {featureBenefits.map((benefit, index) => (
95
+ <li key={index} style={benefitItem}>
96
+ {benefit}
97
+ </li>
98
+ ))}
99
+ </ul>
100
+ </Section>
101
+ )}
102
+
103
+ <div
104
+ style={{
105
+ marginTop: "24px",
106
+ marginBottom: "24px",
107
+ textAlign: "left" as const,
108
+ }}
109
+ >
110
+ <a
111
+ href={featureUrl}
112
+ style={{
113
+ backgroundColor: "#0f172a",
114
+ borderRadius: "8px",
115
+ fontSize: "16px",
116
+ fontWeight: "bold",
117
+ textDecoration: "none",
118
+ padding: "12px 32px",
119
+ display: "inline-block",
120
+ }}
121
+ >
122
+ <span style={{ color: "#ffffff", textDecoration: "none" }}>
123
+ Try {featureName}
124
+ </span>
125
+ </a>
126
+ </div>
127
+
128
+ <Text style={{ ...paragraph, fontSize: "14px", color: "#94a3b8" }}>
129
+ We're constantly adding new features to help you reach your fitness
130
+ goals. Stay tuned for more updates!
131
+ </Text>
132
+
133
+ <div
134
+ style={{
135
+ textAlign: "left" as const,
136
+ margin: "24px 0",
137
+ }}
138
+ >
139
+ <a
140
+ href="https://www.discord.gg/trackedgg"
141
+ style={{
142
+ backgroundColor: "#5865F2",
143
+ borderRadius: "8px",
144
+ fontSize: "16px",
145
+ fontWeight: "bold",
146
+ textDecoration: "none",
147
+ padding: "12px 32px",
148
+ display: "inline-block",
149
+ }}
150
+ >
151
+ <span style={{ color: "#ffffff", textDecoration: "none" }}>
152
+ Join our Discord Community
153
+ </span>
154
+ </a>
155
+ </div>
156
+
157
+ <Hr style={hr} />
158
+ <Text style={footer}>
159
+ Copyright © Tracked Training Platform Inc. <br /> 9101 Horne
160
+ Street, Vancouver, BC
161
+ </Text>
162
+
163
+ <Container>
164
+ <Link
165
+ href={`${websiteUrl}/terms`}
166
+ style={{ ...footer, paddingRight: 10 }}
167
+ >
168
+ Terms
169
+ </Link>
170
+ <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
171
+ <Link
172
+ href={`${websiteUrl}/privacy`}
173
+ style={{ ...footer, paddingRight: 10 }}
174
+ >
175
+ Privacy
176
+ </Link>
177
+ <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
178
+ <Link
179
+ href={`${websiteUrl}/support`}
180
+ style={{ ...footer, paddingRight: 10 }}
181
+ >
182
+ Support
183
+ </Link>
184
+ </Container>
185
+
186
+ <Text style={footer}>
187
+ This is a service notification by the Tracked Training Platform.
188
+ </Text>
189
+ </Section>
190
+ </Container>
191
+ </Body>
192
+ </Html>
193
+ );
194
+ };
195
+
196
+ const main = {
197
+ backgroundColor: "#020617", // slate-950
198
+ fontFamily:
199
+ '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif',
200
+ };
201
+
202
+ const container = {
203
+ backgroundColor: "#020617", // slate-950
204
+ margin: "0 auto",
205
+ padding: "20px 0 48px",
206
+ marginBottom: "64px",
207
+ borderRadius: "8px",
208
+ };
209
+
210
+ const box = {
211
+ padding: "0 24px",
212
+ };
213
+
214
+ const hr = {
215
+ borderColor: "#4ade80", // green-400
216
+ margin: "24px 0",
217
+ borderWidth: "1px",
218
+ };
219
+
220
+ const paragraph = {
221
+ color: "#ffffff", // white
222
+ fontSize: "16px",
223
+ lineHeight: "24px",
224
+ textAlign: "left" as const,
225
+ };
226
+
227
+ const heading = {
228
+ color: "#ffffff", // white
229
+ fontSize: "24px",
230
+ lineHeight: "32px",
231
+ fontWeight: "bold",
232
+ marginBottom: "16px",
233
+ textAlign: "center" as const,
234
+ };
235
+
236
+ const featureBox = {
237
+ backgroundColor: "#1e293b",
238
+ padding: "20px 24px",
239
+ borderRadius: "8px",
240
+ margin: "24px 0",
241
+ borderLeft: "4px solid #4ade80",
242
+ };
243
+
244
+ const featureHeading = {
245
+ color: "#4ade80",
246
+ fontSize: "18px",
247
+ fontWeight: "bold",
248
+ marginBottom: "8px",
249
+ };
250
+
251
+ const featureDescriptionStyle = {
252
+ color: "#e2e8f0",
253
+ fontSize: "15px",
254
+ lineHeight: "22px",
255
+ };
256
+
257
+ const benefitsBox = {
258
+ backgroundColor: "#1e293b",
259
+ padding: "16px 24px",
260
+ borderRadius: "8px",
261
+ margin: "24px 0",
262
+ };
263
+
264
+ const benefitsHeading = {
265
+ color: "#ffffff",
266
+ fontSize: "16px",
267
+ fontWeight: "bold",
268
+ marginBottom: "12px",
269
+ };
270
+
271
+ const benefitsList = {
272
+ margin: "0",
273
+ paddingLeft: "20px",
274
+ };
275
+
276
+ const benefitItem = {
277
+ color: "#e2e8f0",
278
+ fontSize: "14px",
279
+ lineHeight: "24px",
280
+ marginBottom: "8px",
281
+ };
282
+
283
+ const footer = {
284
+ color: "#94a3b8", // slate-400 for subtle footer text
285
+ fontSize: "12px",
286
+ lineHeight: "16px",
287
+ };
288
+
289
+ export default FeatureDiscoveryEmail;
@@ -0,0 +1,255 @@
1
+ import React from "react";
2
+ import {
3
+ Body,
4
+ Column,
5
+ Container,
6
+ Head,
7
+ Hr,
8
+ Html,
9
+ Img,
10
+ Link,
11
+ Preview,
12
+ Row,
13
+ Section,
14
+ Text,
15
+ } from "@react-email/components";
16
+
17
+ interface FirstWorkoutAssignedEmailProps {
18
+ clientName: string;
19
+ coachName: string;
20
+ programName: string;
21
+ workoutUrl: string;
22
+ websiteUrl: string;
23
+ }
24
+
25
+ const baseUrl = "https://tracked.gg/android-chrome-192x192.png";
26
+
27
+ export const FirstWorkoutAssignedEmail = ({
28
+ clientName,
29
+ coachName,
30
+ programName,
31
+ workoutUrl,
32
+ websiteUrl = "https://tracked.gg",
33
+ }: FirstWorkoutAssignedEmailProps) => {
34
+ return (
35
+ <Html>
36
+ <Head>
37
+ <meta name="color-scheme" content="light only" />
38
+ <meta name="supported-color-schemes" content="light only" />
39
+ </Head>
40
+ <Preview>
41
+ {coachName} has assigned your first workout program on Tracked
42
+ </Preview>
43
+ <Body style={main}>
44
+ <Container style={container}>
45
+ <Section style={box}>
46
+ <Row style={{ marginBottom: "8px" }}>
47
+ <Column style={{ width: "auto", verticalAlign: "middle" }}>
48
+ <Img src={`${baseUrl}`} width="28" height="28" alt="Tracked" />
49
+ </Column>
50
+ <Column
51
+ style={{
52
+ width: "auto",
53
+ verticalAlign: "middle",
54
+ paddingLeft: "4px",
55
+ }}
56
+ >
57
+ <Text
58
+ style={{
59
+ fontSize: "28px",
60
+ fontWeight: "900",
61
+ fontFamily:
62
+ "Raleway, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
63
+ color: "#020617",
64
+ margin: "0",
65
+ lineHeight: "32px",
66
+ letterSpacing: "0.5px",
67
+ }}
68
+ >
69
+ TRACKED
70
+ </Text>
71
+ </Column>
72
+ </Row>
73
+ <Hr style={hr} />
74
+
75
+ <Text style={heading}>Your Training Journey Begins!</Text>
76
+ <Text style={paragraph}>
77
+ Hi {clientName}, {coachName} has created your personalized workout
78
+ program and it's ready for you to start.
79
+ </Text>
80
+
81
+ <Section style={infoBox}>
82
+ <Text style={infoHeading}>Program Details:</Text>
83
+ <Text style={infoText}>
84
+ <strong>Program:</strong> {programName}
85
+ </Text>
86
+ <Text style={infoText}>
87
+ <strong>Coach:</strong> {coachName}
88
+ </Text>
89
+ </Section>
90
+
91
+ <Text style={paragraph}>
92
+ Your coach has designed this program specifically for your goals.
93
+ Open the app to view your workouts and get started!
94
+ </Text>
95
+
96
+ <div
97
+ style={{
98
+ marginTop: "24px",
99
+ marginBottom: "24px",
100
+ textAlign: "left" as const,
101
+ }}
102
+ >
103
+ <a
104
+ href={workoutUrl}
105
+ style={{
106
+ backgroundColor: "#0f172a",
107
+ borderRadius: "8px",
108
+ fontSize: "16px",
109
+ fontWeight: "bold",
110
+ textDecoration: "none",
111
+ padding: "12px 32px",
112
+ display: "inline-block",
113
+ }}
114
+ >
115
+ <span style={{ color: "#ffffff", textDecoration: "none" }}>
116
+ View Your Program
117
+ </span>
118
+ </a>
119
+ </div>
120
+
121
+ <Text style={{ ...paragraph }}>
122
+ Remember to track each workout and communicate with your coach if
123
+ you have any questions or concerns.
124
+ </Text>
125
+
126
+ <div
127
+ style={{
128
+ textAlign: "left" as const,
129
+ margin: "24px 0",
130
+ }}
131
+ >
132
+ <a
133
+ href="https://www.discord.gg/trackedgg"
134
+ style={{
135
+ backgroundColor: "#5865F2",
136
+ borderRadius: "8px",
137
+ fontSize: "16px",
138
+ fontWeight: "bold",
139
+ textDecoration: "none",
140
+ padding: "12px 32px",
141
+ display: "inline-block",
142
+ }}
143
+ >
144
+ <span style={{ color: "#ffffff", textDecoration: "none" }}>
145
+ Join our Discord Community
146
+ </span>
147
+ </a>
148
+ </div>
149
+
150
+ <Hr style={hr} />
151
+ <Text style={footer}>
152
+ Copyright © Tracked Training Platform Inc. <br /> 9101 Horne
153
+ Street, Vancouver, BC
154
+ </Text>
155
+
156
+ <Container>
157
+ <Link
158
+ href={`${websiteUrl}/terms`}
159
+ style={{ ...footer, paddingRight: 10 }}
160
+ >
161
+ Terms
162
+ </Link>
163
+ <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
164
+ <Link
165
+ href={`${websiteUrl}/privacy`}
166
+ style={{ ...footer, paddingRight: 10 }}
167
+ >
168
+ Privacy
169
+ </Link>
170
+ <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
171
+ <Link
172
+ href={`${websiteUrl}/support`}
173
+ style={{ ...footer, paddingRight: 10 }}
174
+ >
175
+ Support
176
+ </Link>
177
+ </Container>
178
+
179
+ <Text style={footer}>
180
+ This is a service notification by the Tracked Training Platform.
181
+ </Text>
182
+ </Section>
183
+ </Container>
184
+ </Body>
185
+ </Html>
186
+ );
187
+ };
188
+
189
+ const main = {
190
+ backgroundColor: "#020617", // slate-950
191
+ fontFamily:
192
+ '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif',
193
+ };
194
+
195
+ const container = {
196
+ backgroundColor: "#020617", // slate-950
197
+ margin: "0 auto",
198
+ padding: "20px 0 48px",
199
+ marginBottom: "64px",
200
+ borderRadius: "8px",
201
+ };
202
+
203
+ const box = {
204
+ padding: "0 24px",
205
+ };
206
+
207
+ const hr = {
208
+ borderColor: "#4ade80", // green-400
209
+ margin: "24px 0",
210
+ borderWidth: "1px",
211
+ };
212
+
213
+ const paragraph = {
214
+ color: "#ffffff", // white
215
+ fontSize: "16px",
216
+ lineHeight: "24px",
217
+ textAlign: "left" as const,
218
+ };
219
+
220
+ const heading = {
221
+ color: "#ffffff", // white
222
+ fontSize: "24px",
223
+ lineHeight: "32px",
224
+ fontWeight: "bold",
225
+ marginBottom: "16px",
226
+ };
227
+
228
+ const infoBox = {
229
+ backgroundColor: "#1e293b",
230
+ padding: "16px 24px",
231
+ borderRadius: "8px",
232
+ margin: "24px 0",
233
+ };
234
+
235
+ const infoHeading = {
236
+ color: "#ffffff",
237
+ fontSize: "16px",
238
+ fontWeight: "bold",
239
+ marginBottom: "12px",
240
+ };
241
+
242
+ const infoText = {
243
+ color: "#e2e8f0",
244
+ fontSize: "14px",
245
+ lineHeight: "24px",
246
+ marginBottom: "4px",
247
+ };
248
+
249
+ const footer = {
250
+ color: "#94a3b8", // slate-400 for subtle footer text
251
+ fontSize: "12px",
252
+ lineHeight: "16px",
253
+ };
254
+
255
+ export default FirstWorkoutAssignedEmail;