npm - @tracked/emails - Versions diffs - 0.1.0 - Mend

@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

package/LICENSE +21 -0
package/README.md +211 -0
package/dist/emails/bodyweight-goal-reached.d.ts +14 -0
package/dist/emails/bodyweight-goal-reached.d.ts.map +1 -0
package/dist/emails/bodyweight-goal-reached.js +177 -0
package/dist/emails/bodyweight-goal-reached.js.map +1 -0
package/dist/emails/client-accepted-invitation.d.ts +10 -0
package/dist/emails/client-accepted-invitation.d.ts.map +1 -0
package/dist/emails/client-accepted-invitation.js +99 -0
package/dist/emails/client-accepted-invitation.js.map +1 -0
package/dist/emails/coach-invite.d.ts +10 -0
package/dist/emails/coach-invite.d.ts.map +1 -0
package/dist/emails/coach-invite.js +126 -0
package/dist/emails/coach-invite.js.map +1 -0
package/dist/emails/coach-removed-client.d.ts +8 -0
package/dist/emails/coach-removed-client.d.ts.map +1 -0
package/dist/emails/coach-removed-client.js +80 -0
package/dist/emails/coach-removed-client.js.map +1 -0
package/dist/emails/direct-message.d.ts +11 -0
package/dist/emails/direct-message.d.ts.map +1 -0
package/dist/emails/direct-message.js +103 -0
package/dist/emails/direct-message.js.map +1 -0
package/dist/emails/feature-discovery.d.ts +11 -0
package/dist/emails/feature-discovery.d.ts.map +1 -0
package/dist/emails/feature-discovery.js +121 -0
package/dist/emails/feature-discovery.js.map +1 -0
package/dist/emails/first-workout-assigned.d.ts +10 -0
package/dist/emails/first-workout-assigned.d.ts.map +1 -0
package/dist/emails/first-workout-assigned.js +98 -0
package/dist/emails/first-workout-assigned.js.map +1 -0
package/dist/emails/first-workout-completed.d.ts +11 -0
package/dist/emails/first-workout-completed.d.ts.map +1 -0
package/dist/emails/first-workout-completed.js +129 -0
package/dist/emails/first-workout-completed.js.map +1 -0
package/dist/emails/index.d.ts +7 -0
package/dist/emails/index.d.ts.map +1 -0
package/dist/emails/index.js +7 -0
package/dist/emails/index.js.map +1 -0
package/dist/emails/new-follower.d.ts +11 -0
package/dist/emails/new-follower.d.ts.map +1 -0
package/dist/emails/new-follower.js +98 -0
package/dist/emails/new-follower.js.map +1 -0
package/dist/emails/subscription-canceled.d.ts +10 -0
package/dist/emails/subscription-canceled.d.ts.map +1 -0
package/dist/emails/subscription-canceled.js +131 -0
package/dist/emails/subscription-canceled.js.map +1 -0
package/dist/emails/support-email.d.ts +8 -0
package/dist/emails/support-email.d.ts.map +1 -0
package/dist/emails/support-email.js +40 -0
package/dist/emails/support-email.js.map +1 -0
package/dist/emails/team-invite.d.ts +11 -0
package/dist/emails/team-invite.d.ts.map +1 -0
package/dist/emails/team-invite.js +100 -0
package/dist/emails/team-invite.js.map +1 -0
package/dist/emails/team-member-removed-email.d.ts +8 -0
package/dist/emails/team-member-removed-email.d.ts.map +1 -0
package/dist/emails/team-member-removed-email.js +97 -0
package/dist/emails/team-member-removed-email.js.map +1 -0
package/dist/emails/tracked-magic-link-activate.d.ts +7 -0
package/dist/emails/tracked-magic-link-activate.d.ts.map +1 -0
package/dist/emails/tracked-magic-link-activate.js +93 -0
package/dist/emails/tracked-magic-link-activate.js.map +1 -0
package/dist/emails/tracked-magic-link.d.ts +7 -0
package/dist/emails/tracked-magic-link.d.ts.map +1 -0
package/dist/emails/tracked-magic-link.js +101 -0
package/dist/emails/tracked-magic-link.js.map +1 -0
package/dist/emails/week-one-checkin.d.ts +10 -0
package/dist/emails/week-one-checkin.d.ts.map +1 -0
package/dist/emails/week-one-checkin.js +141 -0
package/dist/emails/week-one-checkin.js.map +1 -0
package/dist/emails/welcome.d.ts +8 -0
package/dist/emails/welcome.d.ts.map +1 -0
package/dist/emails/welcome.js +146 -0
package/dist/emails/welcome.js.map +1 -0
package/dist/index.d.ts +22 -0
package/dist/index.d.ts.map +1 -0
package/dist/index.js +24 -0
package/dist/index.js.map +1 -0
package/dist/utils/email-validation.d.ts +48 -0
package/dist/utils/email-validation.d.ts.map +1 -0
package/dist/utils/email-validation.js +72 -0
package/dist/utils/email-validation.js.map +1 -0
package/dist/utils/index.d.ts +8 -0
package/dist/utils/index.d.ts.map +1 -0
package/dist/utils/index.js +8 -0
package/dist/utils/index.js.map +1 -0
package/dist/utils/username-validation.d.ts +54 -0
package/dist/utils/username-validation.d.ts.map +1 -0
package/dist/utils/username-validation.js +76 -0
package/dist/utils/username-validation.js.map +1 -0
package/package.json +78 -0
package/src/emails/bodyweight-goal-reached.tsx +396 -0
package/src/emails/client-accepted-invitation.tsx +258 -0
package/src/emails/coach-invite.tsx +270 -0
package/src/emails/coach-removed-client.tsx +212 -0
package/src/emails/direct-message.tsx +249 -0
package/src/emails/feature-discovery.tsx +289 -0
package/src/emails/first-workout-assigned.tsx +255 -0
package/src/emails/first-workout-completed.tsx +312 -0
package/src/emails/index.tsx +6 -0
package/src/emails/new-follower.tsx +260 -0
package/src/emails/subscription-canceled.tsx +311 -0
package/src/emails/support-email.tsx +80 -0
package/src/emails/team-invite.tsx +262 -0
package/src/emails/team-member-removed-email.tsx +240 -0
package/src/emails/tracked-magic-link-activate.tsx +252 -0
package/src/emails/tracked-magic-link.tsx +264 -0
package/src/emails/week-one-checkin.tsx +353 -0
package/src/emails/welcome.tsx +341 -0
package/src/index.ts +57 -0
package/src/utils/email-validation.test.ts +78 -0
package/src/utils/email-validation.ts +80 -0
package/src/utils/index.ts +13 -0
package/src/utils/username-validation.test.ts +118 -0
package/src/utils/username-validation.ts +89 -0
package/static/tracked-logo.png +0 -0

package/src/emails/subscription-canceled.tsx ADDED Viewed

@@ -0,0 +1,311 @@
+import React from "react";
+import {
+  Body,
+  Column,
+  Container,
+  Head,
+  Hr,
+  Html,
+  Img,
+  Link,
+  Preview,
+  Row,
+  Section,
+  Text,
+} from "@react-email/components";
+interface SubscriptionCanceledEmailProps {
+  userName: string;
+  cancellationDate: string;
+  feedbackUrl?: string;
+  reactivateUrl: string;
+  websiteUrl: string;
+}
+const baseUrl = "https://tracked.gg/android-chrome-192x192.png";
+export const SubscriptionCanceledEmail = ({
+  userName,
+  cancellationDate,
+  feedbackUrl,
+  reactivateUrl,
+  websiteUrl = "https://tracked.gg",
+}: SubscriptionCanceledEmailProps) => {
+  return (
+    <Html>
+      <Head>
+        <meta name="color-scheme" content="light only" />
+        <meta name="supported-color-schemes" content="light only" />
+      </Head>
+      <Preview>Your Tracked subscription has been canceled</Preview>
+      <Body style={main}>
+        <Container style={container}>
+          <Section style={box}>
+            <Row style={{ marginBottom: "8px" }}>
+              <Column style={{ width: "auto", verticalAlign: "middle" }}>
+                <Img src={`${baseUrl}`} width="28" height="28" alt="Tracked" />
+              </Column>
+              <Column
+                style={{
+                  width: "auto",
+                  verticalAlign: "middle",
+                  paddingLeft: "4px",
+                }}
+              >
+                <Text
+                  style={{
+                    fontSize: "28px",
+                    fontWeight: "900",
+                    fontFamily:
+                      "Raleway, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
+                    color: "#020617",
+                    margin: "0",
+                    lineHeight: "32px",
+                    letterSpacing: "0.5px",
+                  }}
+                >
+                  TRACKED
+                </Text>
+              </Column>
+            </Row>
+            <Hr style={hr} />
+            <Text style={heading}>Subscription Canceled</Text>
+            <Text style={paragraph}>
+              Hi {userName}, we've confirmed that your Tracked subscription has
+              been canceled.
+            </Text>
+            <Section style={infoBox}>
+              <Text style={infoHeading}>What happens next:</Text>
+              <Text style={infoText}>
+                • Your subscription will remain active until {cancellationDate}
+              </Text>
+              <Text style={infoText}>
+                • You'll continue to have full access until that date
+              </Text>
+              <Text style={infoText}>
+                • Your data will be safely stored and available if you return
+              </Text>
+            </Section>
+            <Text style={paragraph}>
+              We're sorry to see you go! Your feedback helps us improve Tracked
+              for everyone.
+            </Text>
+            {feedbackUrl && (
+              <div
+                style={{
+                  marginTop: "16px",
+                  marginBottom: "16px",
+                  textAlign: "left" as const,
+                }}
+              >
+                <a
+                  href={feedbackUrl}
+                  style={{
+                    backgroundColor: "transparent",
+                    border: "1px solid #4ade80",
+                    borderRadius: "8px",
+                    fontSize: "14px",
+                    fontWeight: "bold",
+                    textDecoration: "none",
+                    padding: "10px 24px",
+                    display: "inline-block",
+                  }}
+                >
+                  <span
+                    style={{
+                      color: "#4ade80",
+                      textDecoration: "none",
+                    }}
+                  >
+                    Share Feedback
+                  </span>
+                </a>
+              </div>
+            )}
+            <Section style={winbackBox}>
+              <Text style={winbackHeading}>Changed your mind?</Text>
+              <Text style={winbackText}>
+                You can reactivate your subscription at any time before{" "}
+                {cancellationDate}.
+              </Text>
+              <div
+                style={{
+                  marginTop: "16px",
+                  textAlign: "left" as const,
+                }}
+              >
+                <a
+                  href={reactivateUrl}
+                  style={{
+                    backgroundColor: "#0f172a",
+                    borderRadius: "8px",
+                    fontSize: "16px",
+                    fontWeight: "bold",
+                    textDecoration: "none",
+                    padding: "12px 32px",
+                    display: "inline-block",
+                  }}
+                >
+                  <span style={{ color: "#ffffff", textDecoration: "none" }}>
+                    Reactivate Subscription
+                  </span>
+                </a>
+              </div>
+            </Section>
+            <div
+              style={{
+                textAlign: "left" as const,
+                margin: "24px 0",
+              }}
+            >
+              <a
+                href="https://www.discord.gg/trackedgg"
+                style={{
+                  backgroundColor: "#5865F2",
+                  borderRadius: "8px",
+                  fontSize: "16px",
+                  fontWeight: "bold",
+                  textDecoration: "none",
+                  padding: "12px 32px",
+                  display: "inline-block",
+                }}
+              >
+                <span style={{ color: "#ffffff", textDecoration: "none" }}>
+                  Join our Discord Community
+                </span>
+              </a>
+            </div>
+            <Hr style={hr} />
+            <Text style={footer}>
+              Copyright © Tracked Training Platform Inc. <br /> 9101 Horne
+              Street, Vancouver, BC
+            </Text>
+            <Container>
+              <Link
+                href={`${websiteUrl}/terms`}
+                style={{ ...footer, paddingRight: 10 }}
+              >
+                Terms
+              </Link>
+              <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
+              <Link
+                href={`${websiteUrl}/privacy`}
+                style={{ ...footer, paddingRight: 10 }}
+              >
+                Privacy
+              </Link>
+              <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
+              <Link
+                href={`${websiteUrl}/support`}
+                style={{ ...footer, paddingRight: 10 }}
+              >
+                Support
+              </Link>
+            </Container>
+            <Text style={footer}>
+              This is a service notification by the Tracked Training Platform.
+            </Text>
+          </Section>
+        </Container>
+      </Body>
+    </Html>
+  );
+};
+const main = {
+  backgroundColor: "#020617", // slate-950
+  fontFamily:
+    '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif',
+};
+const container = {
+  backgroundColor: "#020617", // slate-950
+  margin: "0 auto",
+  padding: "20px 0 48px",
+  marginBottom: "64px",
+  borderRadius: "8px",
+};
+const box = {
+  padding: "0 24px",
+};
+const hr = {
+  borderColor: "#4ade80", // green-400
+  margin: "24px 0",
+  borderWidth: "1px",
+};
+const paragraph = {
+  color: "#ffffff", // white
+  fontSize: "16px",
+  lineHeight: "24px",
+  textAlign: "left" as const,
+};
+const heading = {
+  color: "#ffffff", // white
+  fontSize: "24px",
+  lineHeight: "32px",
+  fontWeight: "bold",
+  marginBottom: "16px",
+};
+const infoBox = {
+  backgroundColor: "#1e293b",
+  padding: "16px 24px",
+  borderRadius: "8px",
+  margin: "24px 0",
+};
+const infoHeading = {
+  color: "#ffffff",
+  fontSize: "16px",
+  fontWeight: "bold",
+  marginBottom: "12px",
+};
+const infoText = {
+  color: "#e2e8f0",
+  fontSize: "14px",
+  lineHeight: "24px",
+  marginBottom: "4px",
+};
+const winbackBox = {
+  backgroundColor: "#1e293b",
+  padding: "20px 24px",
+  borderRadius: "8px",
+  margin: "24px 0",
+  borderLeft: "4px solid #4ade80",
+};
+const winbackHeading = {
+  color: "#4ade80",
+  fontSize: "18px",
+  fontWeight: "bold",
+  marginBottom: "8px",
+};
+const winbackText = {
+  color: "#e2e8f0",
+  fontSize: "14px",
+  lineHeight: "20px",
+};
+const footer = {
+  color: "#94a3b8", // slate-400 for subtle footer text
+  fontSize: "12px",
+  lineHeight: "16px",
+};
+export default SubscriptionCanceledEmail;

package/src/emails/support-email.tsx ADDED Viewed

@@ -0,0 +1,80 @@
+import React from "react";
+import { Container, Hr, Text } from "@react-email/components";
+interface SupportEmailProps {
+  email: string;
+  message: string;
+  category: string;
+}
+export const SupportEmail = ({
+  email,
+  message,
+  category,
+}: SupportEmailProps) => (
+  <Container style={styles.container}>
+    <Hr style={styles.hr} />
+    <Text style={styles.text}>
+      <strong>Email:</strong> {email}
+    </Text>
+    <Text style={styles.text}>
+      <strong>Message:</strong> {message}
+    </Text>
+    <Text style={styles.text}>
+      <strong>Category:</strong> {category}
+    </Text>
+    <div
+      style={{
+        textAlign: "left" as const,
+        margin: "24px 0",
+      }}
+    >
+      <a
+        href="https://www.discord.gg/trackedgg"
+        style={{
+          backgroundColor: "#5865F2",
+          borderRadius: "8px",
+          fontSize: "16px",
+          fontWeight: "bold",
+          textDecoration: "none",
+          padding: "12px 32px",
+          display: "inline-block",
+        }}
+      >
+        <span style={{ color: "#ffffff", textDecoration: "none" }}>
+          Join our Discord Community
+        </span>
+      </a>
+    </div>
+    <Hr style={styles.hr} />
+    <Text style={styles.footer}>Tracked, 9101 Horne Street, Vancouver, BC</Text>
+  </Container>
+);
+const styles = {
+  container: {
+    backgroundColor: "#1F2937",
+    margin: "0 auto",
+    padding: "16px",
+    paddingBottom: "64px",
+    borderRadius: "10px",
+    fontFamily: "sans-serif",
+  },
+  img: {
+    width: "40px",
+    height: "40px",
+  },
+  hr: {
+    borderColor: "#e6ebf1",
+    margin: "16px 0",
+  },
+  text: {
+    color: "#FFFFFF",
+  },
+  footer: {
+    color: "#6B7280",
+    fontSize: "12px",
+  },
+};

package/src/emails/team-invite.tsx ADDED Viewed

@@ -0,0 +1,262 @@
+import * as React from "react";
+import {
+  Body,
+  Button,
+  Column,
+  Container,
+  Head,
+  Heading,
+  Hr,
+  Html,
+  Img,
+  Link,
+  Preview,
+  Row,
+  Section,
+  Tailwind,
+  Text,
+} from "@react-email/components";
+interface TeamInviteEmailProps {
+  teamName?: string;
+  teamRole?: string;
+  invitedByUsername?: string;
+  websiteUrl?: string;
+  teamImage?: string;
+  invitationLink?: string;
+}
+const baseUrl = "https://tracked.gg/android-chrome-192x192.png";
+export const TeamInviteEmail = ({
+  teamName = "Team Tracked Training",
+  teamRole = "Athlete",
+  websiteUrl = "https://www.tracked.training",
+  teamImage,
+  invitationLink,
+}: TeamInviteEmailProps) => {
+  return (
+    <Html>
+      <Head />
+      <Preview>Team Invite for {teamName}</Preview>
+      <Body style={main}>
+        <Container style={container}>
+          <Section style={box}>
+            <Row>
+              <Img src={`${baseUrl}`} width="40" height="40" alt="Tracked" />
+            </Row>
+            <Hr style={hr} />
+            {teamImage && (
+              <Img
+                src={teamImage || baseUrl}
+                height="70"
+                alt="Tracked"
+                style={{
+                  margin: "0 auto",
+                  padding: "20px",
+                }}
+              />
+            )}
+            <Text style={heading}>Invitation to join {teamName}</Text>
+            <Text style={paragraph}>
+              Join the team as a <strong>{teamRole}</strong> by pressing the
+              button below.
+            </Text>
+            <Button style={button} href={invitationLink}>
+              Join Team
+            </Button>
+            <Text style={{ ...paragraph }}>
+              If this email was not expected, please ignore it. You can learn
+              more about the Tracked Training Platform by visiting our{" "}
+              <Link style={anchor} href={websiteUrl}>
+                website
+              </Link>
+              .
+            </Text>
+            <Row style={row}>
+              <Column style={column}>
+                <Button
+                  style={appButton}
+                  href="https://apps.apple.com/app/tracked-training/id6450913418"
+                >
+                  <Img
+                    src="https://cdn.trckd.ca/assets/app-store-black.png"
+                    alt="Download on the App Store"
+                    style={img}
+                  />
+                </Button>
+              </Column>
+              <Column style={column}>
+                <Button
+                  style={appButton}
+                  href="https://play.google.com/store/apps/details?id=com.tracked.mobile"
+                >
+                  <Img
+                    src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png"
+                    alt="Google Play"
+                    style={img}
+                  />
+                </Button>
+              </Column>
+            </Row>
+            <div
+              style={{
+                textAlign: "left" as const,
+                margin: "24px 0",
+              }}
+            >
+              <a
+                href="https://www.discord.gg/trackedgg"
+                style={{
+                  backgroundColor: "#5865F2",
+                  borderRadius: "8px",
+                  fontSize: "16px",
+                  fontWeight: "bold",
+                  textDecoration: "none",
+                  padding: "12px 32px",
+                  display: "inline-block",
+                }}
+              >
+                <span style={{ color: "#ffffff", textDecoration: "none" }}>
+                  Join our Discord Community
+                </span>
+              </a>
+            </div>
+            <Hr style={hr} />
+            <Text style={footer}>
+              Copyright © Tracked Training Platform Inc. <br /> 9101 Horne
+              Street, Vancouver, BC
+            </Text>
+            <Container>
+              <Link
+                href="https://tracked.gg/terms"
+                style={{ ...footer, paddingRight: 10 }}
+              >
+                Terms
+              </Link>
+              <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
+              <Link
+                href="https://tracked.gg/privacy"
+                style={{ ...footer, paddingRight: 10 }}
+              >
+                Privacy
+              </Link>
+              <Link style={{ ...footer, paddingRight: 10 }}> | </Link>
+              <Link
+                href="https://tracked.gg/support"
+                style={{ ...footer, paddingRight: 10 }}
+              >
+                Support
+              </Link>
+            </Container>
+            <Text style={footer}>
+              This is a service notification by the Tracked Training Platform.
+            </Text>
+          </Section>
+        </Container>
+      </Body>
+    </Html>
+  );
+};
+export default TeamInviteEmail;
+const main = {
+  backgroundColor: "#1e293b",
+  fontFamily:
+    '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif',
+};
+const container = {
+  backgroundColor: "#0f172a",
+  margin: "0 auto",
+  padding: "20px 0 48px",
+  marginBottom: "64px",
+  borderRadius: "5px",
+};
+const box = {
+  padding: "0 48px",
+};
+const row = {
+  display: "flex",
+  flexDirection: "row" as const,
+};
+const column = {
+  flex: "0 0 48%",
+  "@media (maxWidth: 600px)": {
+    flex: "0 0 100%",
+    marginBottom: "10px",
+  },
+};
+const img = {
+  maxWidth: "100%",
+  height: "auto",
+};
+const appButton = {
+  backgroundColor: "transparent",
+  borderRadius: "5px",
+  color: "#ffffff",
+  fontSize: "16px",
+  fontWeight: "bold",
+  textDecoration: "none",
+  textAlign: "center" as const,
+  display: "block",
+  width: "100%",
+  maxWidth: "150px",
+};
+const hr = {
+  borderColor: "#475569",
+  margin: "20px 0",
+};
+const paragraph = {
+  color: "#e2e8f0",
+  fontSize: "16px",
+  lineHeight: "24px",
+  textAlign: "left" as const,
+};
+const heading = {
+  color: "#e2e8f0",
+  fontSize: "24px",
+  lineHeight: "32px",
+  fontWeight: "bold",
+  textAlign: "left" as const,
+};
+const anchor = {
+  color: "#4ade80",
+};
+const button = {
+  backgroundColor: "#4ade80",
+  borderRadius: "5px",
+  color: "#0f172a",
+  fontSize: "16px",
+  fontWeight: "bold",
+  textDecoration: "none",
+  textAlign: "center" as const,
+  display: "block",
+  width: "100%",
+  padding: "16px 0",
+};
+const footer = {
+  color: "#8898aa",
+  fontSize: "12px",
+  lineHeight: "16px",
+};