brookmind-emails 0.1.12 → 0.1.13

package/dist/modelfy/index.d.ts

@@ -2,8 +2,9 @@ import { OtpEmail, type OtpEmailProps } from "./templates/OtpEmail.js";
 import { PromoSubscriptionEmail, type PromoSubscriptionEmailProps } from "./templates/PromoSubscriptionEmail.js";
 import { GrantCreditsEmail, type GrantCreditsEmailProps } from "./templates/GrantCreditsEmail.js";
 import { WelcomeEmail, type WelcomeEmailProps } from "./templates/WelcomeEmail.js";
-export type { OtpEmailProps, PromoSubscriptionEmailProps, GrantCreditsEmailProps, WelcomeEmailProps };
-export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail };
+import { FeedbackRequestEmail, type FeedbackRequestEmailProps } from "./templates/FeedbackRequestEmail.js";
+export type { OtpEmailProps, PromoSubscriptionEmailProps, GrantCreditsEmailProps, WelcomeEmailProps, FeedbackRequestEmailProps, };
+export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail, FeedbackRequestEmail };
 export interface RenderResult {
     subject: string;
     html: string;
@@ -13,4 +14,5 @@ export declare function renderOtpEmail(props: OtpEmailProps): Promise<RenderResu
 export declare function renderPromoSubscriptionEmail(props: PromoSubscriptionEmailProps): Promise<RenderResult>;
 export declare function renderGrantCreditsEmail(props: GrantCreditsEmailProps): Promise<RenderResult>;
 export declare function renderWelcomeEmail(props: WelcomeEmailProps): Promise<RenderResult>;
+export declare function renderFeedbackRequestEmail(props: FeedbackRequestEmailProps): Promise<RenderResult>;
 //# sourceMappingURL=index.d.ts.map

package/dist/modelfy/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/modelfy/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EACL,sBAAsB,EACtB,KAAK,2BAA2B,EACjC,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;AAClG,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAGnF,YAAY,EAAE,aAAa,EAAE,2BAA2B,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,CAAC;AAGtG,OAAO,EAAE,QAAQ,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,YAAY,EAAE,CAAC;AAG7E,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,wBAAsB,cAAc,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAAC,YAAY,CAAC,CAShF;AAED,wBAAsB,4BAA4B,CAChD,KAAK,EAAE,2BAA2B,GACjC,OAAO,CAAC,YAAY,CAAC,CASvB;AAED,wBAAsB,uBAAuB,CAC3C,KAAK,EAAE,sBAAsB,GAC5B,OAAO,CAAC,YAAY,CAAC,CASvB;AAED,wBAAsB,kBAAkB,CACtC,KAAK,EAAE,iBAAiB,GACvB,OAAO,CAAC,YAAY,CAAC,CASvB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/modelfy/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EACL,sBAAsB,EACtB,KAAK,2BAA2B,EACjC,MAAM,uCAAuC,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;AAClG,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AACnF,OAAO,EACL,oBAAoB,EACpB,KAAK,yBAAyB,EAC/B,MAAM,qCAAqC,CAAC;AAG7C,YAAY,EACV,aAAa,EACb,2BAA2B,EAC3B,sBAAsB,EACtB,iBAAiB,EACjB,yBAAyB,GAC1B,CAAC;AAGF,OAAO,EAAE,QAAQ,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,YAAY,EAAE,oBAAoB,EAAE,CAAC;AAGnG,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,wBAAsB,cAAc,CAAC,KAAK,EAAE,aAAa,GAAG,OAAO,CAAC,YAAY,CAAC,CAShF;AAED,wBAAsB,4BAA4B,CAChD,KAAK,EAAE,2BAA2B,GACjC,OAAO,CAAC,YAAY,CAAC,CASvB;AAED,wBAAsB,uBAAuB,CAC3C,KAAK,EAAE,sBAAsB,GAC5B,OAAO,CAAC,YAAY,CAAC,CASvB;AAED,wBAAsB,kBAAkB,CACtC,KAAK,EAAE,iBAAiB,GACvB,OAAO,CAAC,YAAY,CAAC,CASvB;AAED,wBAAsB,0BAA0B,CAC9C,KAAK,EAAE,yBAAyB,GAC/B,OAAO,CAAC,YAAY,CAAC,CASvB"}

package/dist/modelfy/index.js

@@ -3,8 +3,9 @@ import { OtpEmail } from "./templates/OtpEmail.js";
 import { PromoSubscriptionEmail, } from "./templates/PromoSubscriptionEmail.js";
 import { GrantCreditsEmail } from "./templates/GrantCreditsEmail.js";
 import { WelcomeEmail } from "./templates/WelcomeEmail.js";
+import { FeedbackRequestEmail, } from "./templates/FeedbackRequestEmail.js";
 // Re-export components for preview
-export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail };
+export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail, FeedbackRequestEmail };
 export async function renderOtpEmail(props) {
     const html = await render(OtpEmail(props));
     const text = await render(OtpEmail(props), { plainText: true });
@@ -41,3 +42,12 @@ export async function renderWelcomeEmail(props) {
         text,
     };
 }
+export async function renderFeedbackRequestEmail(props) {
+    const html = await render(FeedbackRequestEmail(props));
+    const text = await render(FeedbackRequestEmail(props), { plainText: true });
+    return {
+        subject: "We'd love your feedback on Modelfy",
+        html,
+        text,
+    };
+}

package/dist/modelfy/templates/FeedbackRequestEmail.d.ts

@@ -0,0 +1,8 @@
+export interface FeedbackRequestEmailProps {
+    email: string;
+    planName: string;
+    subscriptionEndDate: string;
+}
+export declare function FeedbackRequestEmail({ email, planName, subscriptionEndDate, }: FeedbackRequestEmailProps): React.ReactElement;
+export default FeedbackRequestEmail;
+//# sourceMappingURL=FeedbackRequestEmail.d.ts.map

package/dist/modelfy/templates/FeedbackRequestEmail.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeedbackRequestEmail.d.ts","sourceRoot":"","sources":["../../../src/modelfy/templates/FeedbackRequestEmail.tsx"],"names":[],"mappings":"AAeA,MAAM,WAAW,yBAAyB;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,mBAAmB,EAAE,MAAM,CAAC;CAC7B;AAoMD,wBAAgB,oBAAoB,CAAC,EACnC,KAA0B,EAC1B,QAAgB,EAChB,mBAAuC,GACxC,EAAE,yBAAyB,GAAG,KAAK,CAAC,YAAY,CAiKhD;AAED,eAAe,oBAAoB,CAAC"}

package/dist/modelfy/templates/FeedbackRequestEmail.js

@@ -0,0 +1,208 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Html, Head, Body, Container, Section, Text, Link, Preview, Font, Img, Button as ReactEmailButton, } from "@react-email/components";
+import { modelfyConfig } from "../config.js";
+// Design System Colors - Matching Modelfy Landing
+const colors = {
+    background: "#0d0d0d",
+    cardBg: "#121212",
+    primary: "#0a8f5a",
+    white: "#f2f2f2",
+    textSecondary: "rgba(242, 242, 242, 0.7)",
+    textMuted: "#8c8c8c",
+    border: "#262626",
+};
+const styles = {
+    body: {
+        margin: 0,
+        padding: 0,
+        backgroundColor: colors.background,
+        fontFamily: "'Inter', 'Segoe UI', Arial, sans-serif",
+    },
+    container: {
+        maxWidth: "600px",
+        margin: "0 auto",
+        backgroundColor: colors.background,
+    },
+    header: {
+        backgroundColor: colors.background,
+        padding: "40px 32px 24px",
+        textAlign: "center",
+    },
+    logo: {
+        display: "block",
+        margin: "0 auto",
+    },
+    heroSection: {
+        padding: "24px 32px 16px",
+        textAlign: "center",
+    },
+    heroTagline: {
+        margin: "0 0 12px",
+        fontSize: "13px",
+        fontWeight: 600,
+        color: colors.primary,
+        letterSpacing: "2px",
+        textTransform: "uppercase",
+    },
+    heroHeading: {
+        margin: "0 0 16px",
+        fontSize: "28px",
+        fontWeight: 700,
+        color: colors.white,
+        lineHeight: "1.3",
+    },
+    heroSubheading: {
+        margin: "0",
+        fontSize: "16px",
+        lineHeight: "1.6",
+        color: colors.textSecondary,
+    },
+    feedbackSection: {
+        backgroundColor: colors.cardBg,
+        padding: "32px",
+        borderTop: `1px solid ${colors.border}`,
+        borderBottom: `1px solid ${colors.border}`,
+    },
+    feedbackText: {
+        margin: "0 0 20px",
+        fontSize: "15px",
+        lineHeight: "1.6",
+        color: colors.textSecondary,
+        textAlign: "center",
+    },
+    feedbackBox: {
+        backgroundColor: "rgba(10, 143, 90, 0.1)",
+        border: `1px solid rgba(10, 143, 90, 0.3)`,
+        borderRadius: "12px",
+        padding: "20px 24px",
+        marginBottom: "24px",
+    },
+    feedbackBoxText: {
+        margin: 0,
+        fontSize: "14px",
+        lineHeight: "1.6",
+        color: colors.textSecondary,
+        textAlign: "center",
+    },
+    questionsSection: {
+        backgroundColor: colors.background,
+        padding: "32px",
+    },
+    questionsSectionTitle: {
+        margin: "0 0 20px",
+        fontSize: "14px",
+        fontWeight: 600,
+        color: colors.white,
+        textAlign: "center",
+    },
+    questionsList: {
+        margin: "0 auto",
+        padding: "0 20px",
+        maxWidth: "400px",
+    },
+    questionItem: {
+        margin: "0 0 12px",
+        fontSize: "14px",
+        lineHeight: "1.5",
+        color: colors.textMuted,
+    },
+    questionBullet: {
+        color: colors.primary,
+        marginRight: "8px",
+    },
+    ctaSection: {
+        backgroundColor: colors.cardBg,
+        padding: "32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    ctaButton: {
+        display: "inline-block",
+        padding: "14px 36px",
+        fontSize: "15px",
+        fontWeight: 600,
+        textDecoration: "none",
+        borderRadius: "10px",
+        backgroundColor: colors.primary,
+        color: "#ffffff",
+        textAlign: "center",
+    },
+    winbackSection: {
+        backgroundColor: colors.background,
+        padding: "32px",
+        textAlign: "center",
+    },
+    winbackText: {
+        margin: "0 0 8px",
+        fontSize: "14px",
+        lineHeight: "1.6",
+        color: colors.textMuted,
+        textAlign: "center",
+    },
+    winbackLink: {
+        color: colors.primary,
+        textDecoration: "none",
+        fontWeight: 600,
+    },
+    downloadSection: {
+        backgroundColor: colors.cardBg,
+        padding: "24px 32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    downloadText: {
+        margin: "0 0 16px",
+        fontSize: "14px",
+        color: colors.white,
+    },
+    badgeContainer: {
+        textAlign: "center",
+    },
+    badge: {
+        display: "inline-block",
+        margin: "0 8px",
+    },
+    footer: {
+        backgroundColor: colors.cardBg,
+        padding: "24px 32px",
+        textAlign: "center",
+        borderTop: `1px solid ${colors.border}`,
+    },
+    footerLogo: {
+        display: "block",
+        margin: "0 auto 12px",
+        opacity: 0.6,
+    },
+    footerText: {
+        margin: "0 0 4px",
+        fontSize: "11px",
+        color: colors.textMuted,
+        lineHeight: "1.6",
+    },
+    footerLink: {
+        color: colors.textMuted,
+        textDecoration: "underline",
+    },
+};
+const feedbackReasons = [
+    "The pricing didn't fit my budget",
+    "I found an alternative solution",
+    "The features didn't meet my needs",
+    "I experienced technical issues",
+    "I didn't use the product enough",
+    "Other reasons",
+];
+export function FeedbackRequestEmail({ email = "user@example.com", planName = "Pro", subscriptionEndDate = "January 1, 2025", }) {
+    const feedbackMailto = `mailto:${modelfyConfig.supportEmail}?subject=Feedback%20on%20my%20Modelfy%20subscription&body=Hi%20Modelfy%20team%2C%0A%0AI%27m%20sharing%20feedback%20about%20my%20${encodeURIComponent(planName)}%20subscription%20that%20ended%20on%20${encodeURIComponent(subscriptionEndDate)}.%0A%0A`;
+    return (_jsxs(Html, { lang: "en", children: [_jsxs(Head, { children: [_jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 400, fontStyle: "normal" }), _jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuI6fAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 600, fontStyle: "normal" }), _jsx(Font, { fontFamily: "Inter", fallbackFontFamily: "Arial", webFont: {
+                            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hjp-Ek-_0.woff2",
+                            format: "woff2",
+                        }, fontWeight: 700, fontStyle: "normal" })] }), _jsx(Preview, { children: "We'd love your feedback on Modelfy - Help us improve" }), _jsx(Body, { style: styles.body, children: _jsxs(Container, { style: styles.container, children: [_jsx(Section, { style: styles.header, children: _jsx(Img, { src: modelfyConfig.logoUrl, width: "130", height: "auto", alt: "Modelfy", style: styles.logo }) }), _jsxs(Section, { style: styles.heroSection, children: [_jsx(Text, { style: styles.heroTagline, children: "We'd Love Your Feedback" }), _jsx(Text, { style: styles.heroHeading, children: "We're Sorry to See You Go" }), _jsxs(Text, { style: styles.heroSubheading, children: ["Hi ", _jsx("span", { style: { color: colors.white, fontWeight: 600 }, children: email }), ", your", " ", _jsx("span", { style: { color: colors.white, fontWeight: 600 }, children: planName }), " subscription ended on", " ", _jsx("span", { style: { color: colors.white, fontWeight: 600 }, children: subscriptionEndDate }), ". Your feedback would help us improve Modelfy for everyone."] })] }), _jsxs(Section, { style: styles.feedbackSection, children: [_jsx(Text, { style: styles.feedbackText, children: "We'd genuinely appreciate hearing about your experience. Just reply to this email or click the button below." }), _jsx("div", { style: styles.feedbackBox, children: _jsxs(Text, { style: styles.feedbackBoxText, children: ["Simply hit reply and let us know what we could do better.", _jsx("br", {}), "All feedback goes directly to our team."] }) })] }), _jsxs(Section, { style: styles.questionsSection, children: [_jsx(Text, { style: styles.questionsSectionTitle, children: "Some things we'd love to know:" }), _jsx("div", { style: styles.questionsList, children: feedbackReasons.map((reason, index) => (_jsxs(Text, { style: styles.questionItem, children: [_jsx("span", { style: styles.questionBullet, children: "\u2022" }), reason] }, index))) })] }), _jsx(Section, { style: styles.ctaSection, children: _jsx(ReactEmailButton, { href: feedbackMailto, style: styles.ctaButton, children: "Share Your Feedback" }) }), _jsxs(Section, { style: styles.winbackSection, children: [_jsx(Text, { style: styles.winbackText, children: "Changed your mind? Your account is still here waiting for you." }), _jsx(Text, { style: styles.winbackText, children: _jsx(Link, { href: modelfyConfig.appUrl, style: styles.winbackLink, children: "Reactivate your subscription" }) })] }), _jsxs(Section, { style: styles.downloadSection, children: [_jsx(Text, { style: styles.downloadText, children: "Get the Modelfy app" }), _jsxs("div", { style: styles.badgeContainer, children: [_jsx(Link, { href: modelfyConfig.appStoreUrl, style: styles.badge, children: _jsx(Img, { src: modelfyConfig.appStoreBadgeUrl, width: "120", height: "40", alt: "Download on the App Store" }) }), _jsx(Link, { href: modelfyConfig.playStoreUrl, style: styles.badge, children: _jsx(Img, { src: modelfyConfig.playStoreBadgeUrl, width: "135", height: "40", alt: "Get it on Google Play" }) })] })] }), _jsxs(Section, { style: styles.footer, children: [_jsx(Img, { src: modelfyConfig.logoUrl, width: "80", height: "auto", alt: "Modelfy", style: styles.footerLogo }), _jsxs(Text, { style: styles.footerText, children: ["\u00A9 ", new Date().getFullYear(), " ", modelfyConfig.companyName, ". All rights reserved."] }), _jsx(Text, { style: styles.footerText, children: "You received this email because your Modelfy subscription has ended." }), _jsx(Text, { style: styles.footerText, children: _jsx(Link, { href: `${modelfyConfig.appUrl}/privacy`, style: styles.footerLink, children: "Privacy Policy" }) })] })] }) })] }));
+}
+export default FeedbackRequestEmail;

package/dist/modelfy/templates/WelcomeEmail.js

@@ -253,7 +253,7 @@ const styles = {
 };
 // Image pools for random selection
 const campaignImages = Array.from({ length: 33 }, (_, i) => `https://bucket.modelfy.ai/app-media/campaign/campaign${i + 1}.jpeg`);
-const campaignProImages = Array.from({ length: 15 }, (_, i) => `https://bucket.modelfy.ai/app-media/campaign-pro/campaign-pro-${i + 1}.jpg`);
+const _campaignProImages = Array.from({ length: 15 }, (_, i) => `https://bucket.modelfy.ai/app-media/campaign-pro/campaign-pro-${i + 1}.jpg`);
 const studioImages = Array.from({ length: 31 }, (_, i) => `https://bucket.modelfy.ai/app-media/studio/studio${i + 1}.jpeg`);
 const colorSwapImages = Array.from({ length: 10 }, (_, i) => `https://modelfy.ai/images/color-swap/studio-color-change${i + 1}.jpg`);
 const modelImages = [

package/eslint.config.js

@@ -0,0 +1,25 @@
+import globals from "globals";
+import tseslint from "typescript-eslint";
+
+export default tseslint.config(
+  { ignores: ["dist/**", "node_modules/**"] },
+  ...tseslint.configs.recommended,
+  {
+    files: ["src/**/*.{ts,tsx}"],
+    languageOptions: {
+      globals: globals.node,
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+    },
+    rules: {
+      "@typescript-eslint/no-explicit-any": "error",
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        { argsIgnorePattern: "^_", varsIgnorePattern: "^_" },
+      ],
+    },
+  }
+);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brookmind-emails",
-  "version": "0.1.12",
+  "version": "0.1.13",
   "description": "Email templates for Brookmind projects",
   "type": "module",
   "main": "./dist/index.js",
@@ -26,7 +26,7 @@
     "dev": "email dev --dir src/modelfy/templates",
     "build": "tsc",
     "prepare": "npm run build",
-    "lint": "eslint src --ext .ts,.tsx",
+    "lint": "eslint src",
     "format": "prettier --write \"src/**/*.{ts,tsx}\""
   },
   "dependencies": {
@@ -40,8 +40,10 @@
     "@typescript-eslint/eslint-plugin": "^8.18.0",
     "@typescript-eslint/parser": "^8.18.0",
     "eslint": "^9.16.0",
+    "globals": "^17.1.0",
     "prettier": "^3.4.2",
     "react-email": "^3.0.4",
-    "typescript": "^5.7.2"
+    "typescript": "^5.7.2",
+    "typescript-eslint": "^8.53.1"
   }
 }

package/src/modelfy/index.ts

@@ -6,12 +6,22 @@ import {
 } from "./templates/PromoSubscriptionEmail.js";
 import { GrantCreditsEmail, type GrantCreditsEmailProps } from "./templates/GrantCreditsEmail.js";
 import { WelcomeEmail, type WelcomeEmailProps } from "./templates/WelcomeEmail.js";
+import {
+  FeedbackRequestEmail,
+  type FeedbackRequestEmailProps,
+} from "./templates/FeedbackRequestEmail.js";
 
 // Re-export types
-export type { OtpEmailProps, PromoSubscriptionEmailProps, GrantCreditsEmailProps, WelcomeEmailProps };
+export type {
+  OtpEmailProps,
+  PromoSubscriptionEmailProps,
+  GrantCreditsEmailProps,
+  WelcomeEmailProps,
+  FeedbackRequestEmailProps,
+};
 
 // Re-export components for preview
-export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail };
+export { OtpEmail, PromoSubscriptionEmail, GrantCreditsEmail, WelcomeEmail, FeedbackRequestEmail };
 
 // Render functions
 export interface RenderResult {
@@ -69,3 +79,16 @@ export async function renderWelcomeEmail(
     text,
   };
 }
+
+export async function renderFeedbackRequestEmail(
+  props: FeedbackRequestEmailProps
+): Promise<RenderResult> {
+  const html = await render(FeedbackRequestEmail(props));
+  const text = await render(FeedbackRequestEmail(props), { plainText: true });
+
+  return {
+    subject: "We'd love your feedback on Modelfy",
+    html,
+    text,
+  };
+}

package/src/modelfy/templates/FeedbackRequestEmail.tsx

@@ -0,0 +1,383 @@
+import {
+  Html,
+  Head,
+  Body,
+  Container,
+  Section,
+  Text,
+  Link,
+  Preview,
+  Font,
+  Img,
+  Button as ReactEmailButton,
+} from "@react-email/components";
+import { modelfyConfig } from "../config.js";
+
+export interface FeedbackRequestEmailProps {
+  email: string;
+  planName: string;
+  subscriptionEndDate: string;
+}
+
+// Design System Colors - Matching Modelfy Landing
+const colors = {
+  background: "#0d0d0d",
+  cardBg: "#121212",
+  primary: "#0a8f5a",
+  white: "#f2f2f2",
+  textSecondary: "rgba(242, 242, 242, 0.7)",
+  textMuted: "#8c8c8c",
+  border: "#262626",
+};
+
+const styles = {
+  body: {
+    margin: 0,
+    padding: 0,
+    backgroundColor: colors.background,
+    fontFamily: "'Inter', 'Segoe UI', Arial, sans-serif",
+  },
+  container: {
+    maxWidth: "600px",
+    margin: "0 auto",
+    backgroundColor: colors.background,
+  },
+  header: {
+    backgroundColor: colors.background,
+    padding: "40px 32px 24px",
+    textAlign: "center" as const,
+  },
+  logo: {
+    display: "block" as const,
+    margin: "0 auto",
+  },
+  heroSection: {
+    padding: "24px 32px 16px",
+    textAlign: "center" as const,
+  },
+  heroTagline: {
+    margin: "0 0 12px",
+    fontSize: "13px",
+    fontWeight: 600,
+    color: colors.primary,
+    letterSpacing: "2px",
+    textTransform: "uppercase" as const,
+  },
+  heroHeading: {
+    margin: "0 0 16px",
+    fontSize: "28px",
+    fontWeight: 700,
+    color: colors.white,
+    lineHeight: "1.3",
+  },
+  heroSubheading: {
+    margin: "0",
+    fontSize: "16px",
+    lineHeight: "1.6",
+    color: colors.textSecondary,
+  },
+  feedbackSection: {
+    backgroundColor: colors.cardBg,
+    padding: "32px",
+    borderTop: `1px solid ${colors.border}`,
+    borderBottom: `1px solid ${colors.border}`,
+  },
+  feedbackText: {
+    margin: "0 0 20px",
+    fontSize: "15px",
+    lineHeight: "1.6",
+    color: colors.textSecondary,
+    textAlign: "center" as const,
+  },
+  feedbackBox: {
+    backgroundColor: "rgba(10, 143, 90, 0.1)",
+    border: `1px solid rgba(10, 143, 90, 0.3)`,
+    borderRadius: "12px",
+    padding: "20px 24px",
+    marginBottom: "24px",
+  },
+  feedbackBoxText: {
+    margin: 0,
+    fontSize: "14px",
+    lineHeight: "1.6",
+    color: colors.textSecondary,
+    textAlign: "center" as const,
+  },
+  questionsSection: {
+    backgroundColor: colors.background,
+    padding: "32px",
+  },
+  questionsSectionTitle: {
+    margin: "0 0 20px",
+    fontSize: "14px",
+    fontWeight: 600,
+    color: colors.white,
+    textAlign: "center" as const,
+  },
+  questionsList: {
+    margin: "0 auto",
+    padding: "0 20px",
+    maxWidth: "400px",
+  },
+  questionItem: {
+    margin: "0 0 12px",
+    fontSize: "14px",
+    lineHeight: "1.5",
+    color: colors.textMuted,
+  },
+  questionBullet: {
+    color: colors.primary,
+    marginRight: "8px",
+  },
+  ctaSection: {
+    backgroundColor: colors.cardBg,
+    padding: "32px",
+    textAlign: "center" as const,
+    borderTop: `1px solid ${colors.border}`,
+  },
+  ctaButton: {
+    display: "inline-block",
+    padding: "14px 36px",
+    fontSize: "15px",
+    fontWeight: 600,
+    textDecoration: "none",
+    borderRadius: "10px",
+    backgroundColor: colors.primary,
+    color: "#ffffff",
+    textAlign: "center" as const,
+  },
+  winbackSection: {
+    backgroundColor: colors.background,
+    padding: "32px",
+    textAlign: "center" as const,
+  },
+  winbackText: {
+    margin: "0 0 8px",
+    fontSize: "14px",
+    lineHeight: "1.6",
+    color: colors.textMuted,
+    textAlign: "center" as const,
+  },
+  winbackLink: {
+    color: colors.primary,
+    textDecoration: "none",
+    fontWeight: 600,
+  },
+  downloadSection: {
+    backgroundColor: colors.cardBg,
+    padding: "24px 32px",
+    textAlign: "center" as const,
+    borderTop: `1px solid ${colors.border}`,
+  },
+  downloadText: {
+    margin: "0 0 16px",
+    fontSize: "14px",
+    color: colors.white,
+  },
+  badgeContainer: {
+    textAlign: "center" as const,
+  },
+  badge: {
+    display: "inline-block",
+    margin: "0 8px",
+  },
+  footer: {
+    backgroundColor: colors.cardBg,
+    padding: "24px 32px",
+    textAlign: "center" as const,
+    borderTop: `1px solid ${colors.border}`,
+  },
+  footerLogo: {
+    display: "block" as const,
+    margin: "0 auto 12px",
+    opacity: 0.6,
+  },
+  footerText: {
+    margin: "0 0 4px",
+    fontSize: "11px",
+    color: colors.textMuted,
+    lineHeight: "1.6",
+  },
+  footerLink: {
+    color: colors.textMuted,
+    textDecoration: "underline",
+  },
+};
+
+const feedbackReasons = [
+  "The pricing didn't fit my budget",
+  "I found an alternative solution",
+  "The features didn't meet my needs",
+  "I experienced technical issues",
+  "I didn't use the product enough",
+  "Other reasons",
+];
+
+export function FeedbackRequestEmail({
+  email = "user@example.com",
+  planName = "Pro",
+  subscriptionEndDate = "January 1, 2025",
+}: FeedbackRequestEmailProps): React.ReactElement {
+  const feedbackMailto = `mailto:${modelfyConfig.supportEmail}?subject=Feedback%20on%20my%20Modelfy%20subscription&body=Hi%20Modelfy%20team%2C%0A%0AI%27m%20sharing%20feedback%20about%20my%20${encodeURIComponent(planName)}%20subscription%20that%20ended%20on%20${encodeURIComponent(subscriptionEndDate)}.%0A%0A`;
+
+  return (
+    <Html lang="en">
+      <Head>
+        <Font
+          fontFamily="Inter"
+          fallbackFontFamily="Arial"
+          webFont={{
+            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hjp-Ek-_0.woff2",
+            format: "woff2",
+          }}
+          fontWeight={400}
+          fontStyle="normal"
+        />
+        <Font
+          fontFamily="Inter"
+          fallbackFontFamily="Arial"
+          webFont={{
+            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuI6fAZ9hjp-Ek-_0.woff2",
+            format: "woff2",
+          }}
+          fontWeight={600}
+          fontStyle="normal"
+        />
+        <Font
+          fontFamily="Inter"
+          fallbackFontFamily="Arial"
+          webFont={{
+            url: "https://fonts.gstatic.com/s/inter/v13/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuFuYAZ9hjp-Ek-_0.woff2",
+            format: "woff2",
+          }}
+          fontWeight={700}
+          fontStyle="normal"
+        />
+      </Head>
+      <Preview>We'd love your feedback on Modelfy - Help us improve</Preview>
+      <Body style={styles.body}>
+        <Container style={styles.container}>
+          {/* Header */}
+          <Section style={styles.header}>
+            <Img
+              src={modelfyConfig.logoUrl}
+              width="130"
+              height="auto"
+              alt="Modelfy"
+              style={styles.logo}
+            />
+          </Section>
+
+          {/* Hero Section */}
+          <Section style={styles.heroSection}>
+            <Text style={styles.heroTagline}>We'd Love Your Feedback</Text>
+            <Text style={styles.heroHeading}>We're Sorry to See You Go</Text>
+            <Text style={styles.heroSubheading}>
+              Hi <span style={{ color: colors.white, fontWeight: 600 }}>{email}</span>, your{" "}
+              <span style={{ color: colors.white, fontWeight: 600 }}>{planName}</span> subscription
+              ended on{" "}
+              <span style={{ color: colors.white, fontWeight: 600 }}>{subscriptionEndDate}</span>.
+              Your feedback would help us improve Modelfy for everyone.
+            </Text>
+          </Section>
+
+          {/* Feedback Explanation */}
+          <Section style={styles.feedbackSection}>
+            <Text style={styles.feedbackText}>
+              We'd genuinely appreciate hearing about your experience.
+              Just reply to this email or click the button below.
+            </Text>
+            <div style={styles.feedbackBox}>
+              <Text style={styles.feedbackBoxText}>
+                Simply hit reply and let us know what we could do better.
+                <br />
+                All feedback goes directly to our team.
+              </Text>
+            </div>
+          </Section>
+
+          {/* Quick Questions */}
+          <Section style={styles.questionsSection}>
+            <Text style={styles.questionsSectionTitle}>
+              Some things we'd love to know:
+            </Text>
+            <div style={styles.questionsList}>
+              {feedbackReasons.map((reason, index) => (
+                <Text key={index} style={styles.questionItem}>
+                  <span style={styles.questionBullet}>•</span>
+                  {reason}
+                </Text>
+              ))}
+            </div>
+          </Section>
+
+          {/* CTA Section */}
+          <Section style={styles.ctaSection}>
+            <ReactEmailButton href={feedbackMailto} style={styles.ctaButton}>
+              Share Your Feedback
+            </ReactEmailButton>
+          </Section>
+
+          {/* Win-back Section */}
+          <Section style={styles.winbackSection}>
+            <Text style={styles.winbackText}>
+              Changed your mind? Your account is still here waiting for you.
+            </Text>
+            <Text style={styles.winbackText}>
+              <Link href={modelfyConfig.appUrl} style={styles.winbackLink}>
+                Reactivate your subscription
+              </Link>
+            </Text>
+          </Section>
+
+          {/* Download App Section */}
+          <Section style={styles.downloadSection}>
+            <Text style={styles.downloadText}>Get the Modelfy app</Text>
+            <div style={styles.badgeContainer}>
+              <Link href={modelfyConfig.appStoreUrl} style={styles.badge}>
+                <Img
+                  src={modelfyConfig.appStoreBadgeUrl}
+                  width="120"
+                  height="40"
+                  alt="Download on the App Store"
+                />
+              </Link>
+              <Link href={modelfyConfig.playStoreUrl} style={styles.badge}>
+                <Img
+                  src={modelfyConfig.playStoreBadgeUrl}
+                  width="135"
+                  height="40"
+                  alt="Get it on Google Play"
+                />
+              </Link>
+            </div>
+          </Section>
+
+          {/* Footer */}
+          <Section style={styles.footer}>
+            <Img
+              src={modelfyConfig.logoUrl}
+              width="80"
+              height="auto"
+              alt="Modelfy"
+              style={styles.footerLogo}
+            />
+            <Text style={styles.footerText}>
+              © {new Date().getFullYear()} {modelfyConfig.companyName}. All rights reserved.
+            </Text>
+            <Text style={styles.footerText}>
+              You received this email because your Modelfy subscription has ended.
+            </Text>
+            <Text style={styles.footerText}>
+              <Link href={`${modelfyConfig.appUrl}/privacy`} style={styles.footerLink}>
+                Privacy Policy
+              </Link>
+            </Text>
+          </Section>
+        </Container>
+      </Body>
+    </Html>
+  );
+}
+
+export default FeedbackRequestEmail;

package/src/modelfy/templates/WelcomeEmail.tsx

@@ -274,7 +274,7 @@ const campaignImages = Array.from(
   { length: 33 },
   (_, i) => `https://bucket.modelfy.ai/app-media/campaign/campaign${i + 1}.jpeg`
 );
-const campaignProImages = Array.from(
+const _campaignProImages = Array.from(
   { length: 15 },
   (_, i) => `https://bucket.modelfy.ai/app-media/campaign-pro/campaign-pro-${i + 1}.jpg`
 );

package/.context/attachments/Review request.md

@@ -1,61 +0,0 @@
-You are performing a code review on the changes in the current branch.
-
-The current branch is **davidcastillog/foodstudio-templates**, and the target branch is **origin/master**.
-
-## Code Review Instructions
-
-The entire git diff for this branch has been provided below, as well as a list of all commits made to this branch.
-
-**CRITICAL: EVERYTHING YOU NEED IS ALREADY PROVIDED BELOW.** The complete git diff and full commit history are included in this message.
-
-**DO NOT run git diff, git log, git status, or ANY other git commands.** All the information you need to perform this review is already here.
-
-When reviewing the diff:
-1. **Focus on logic and correctness** - Check for bugs, edge cases, and potential issues.
-2. **Consider readability** - Is the code clear and maintainable? Does it follow best practices in this repository?
-3. **Evaluate performance** - Are there obvious performance concerns or optimizations that could be made?
-4. **Assess test coverage** - Does the repository have testing patterns? If so, are there adequate tests for these changes?
-5. **Ask clarifying questions** - Ask the user for clarification if you are unsure about the changes or need more context.
-6. **Don't be overly pedantic** - Nitpicks are fine, but only if they are relevant issues within reason.
-
-In your output:
-- Provide a summary overview of the general code quality.
-- Present the identified issues in a table with the columns: index (1, 2, etc.), line number(s), code, issue, and potential solution(s).
-- If no issues are found, briefly state that the code meets best practices.
-
-## Full Diff
-
-**REMINDER: DO NOT use any tools to fetch git information.** Simply read the diff and commit history that follow.
-
-```
-> cd "/Users/davidcastillo/conductor/workspaces/brookmind-emails/hartford" && git diff 0f26955a0c71bc110156d37bac8834a5125a155d
-diff --git a/package-lock.json b/package-lock.json
-index 7d8e5ff..e0ba651 100644
---- a/package-lock.json
-+++ b/package-lock.json
-@@ -1,12 +1,12 @@
- {
--  "name": "@brookmind/emails",
--  "version": "0.1.6",
-+  "name": "brookmind-emails",
-+  "version": "0.1.11",
-   "lockfileVersion": 3,
-   "requires": true,
-   "packages": {
-     "": {
--      "name": "@brookmind/emails",
--      "version": "0.1.3",
-+      "name": "brookmind-emails",
-+      "version": "0.1.11",
-       "dependencies": {
-         "@react-email/components": "^0.0.31",
-         "@react-email/render": "^1.0.3",
-
-```
-
-## Commit History
-
-```
-> cd "/Users/davidcastillo/conductor/workspaces/brookmind-emails/hartford" && git log origin/master..HEAD
-No commits found
-```