improvement(emails): extract shared plain email styles and proFeatures constant, fix double email on 100% usage

waleedlatif1 · waleedlatif1 · commit ffcc373c3b41 · 2026-04-02T18:43:27.000-07:00
diff --git a/apps/sim/components/emails/_styles/base.ts b/apps/sim/components/emails/_styles/base.ts
@@ -267,3 +267,24 @@ export const baseStyles = {
     margin: '8px 0',
   },
 }
+
+/** Styles for plain personal emails (no branding, no EmailLayout) */
+export const plainEmailStyles = {
+  body: {
+    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
+    backgroundColor: '#ffffff',
+    margin: '0',
+    padding: '0',
+  },
+  container: {
+    maxWidth: '560px',
+    margin: '40px auto',
+    padding: '0 24px',
+  },
+  p: {
+    fontSize: '15px',
+    lineHeight: '1.6',
+    color: '#1a1a1a',
+    margin: '0 0 16px',
+  },
+} as const
diff --git a/apps/sim/components/emails/_styles/index.ts b/apps/sim/components/emails/_styles/index.ts
@@ -1 +1 @@
-export { baseStyles, colors, spacing, typography } from './base'
+export { baseStyles, colors, plainEmailStyles, spacing, typography } from './base'
diff --git a/apps/sim/components/emails/auth/onboarding-followup-email.tsx b/apps/sim/components/emails/auth/onboarding-followup-email.tsx
@@ -1,29 +1,10 @@
 import { Body, Head, Html, Preview, Text } from '@react-email/components'
+import { plainEmailStyles as styles } from '@/components/emails/_styles'
 
 interface OnboardingFollowupEmailProps {
   userName?: string
 }
 
-const styles = {
-  body: {
-    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
-    backgroundColor: '#ffffff',
-    margin: '0',
-    padding: '0',
-  },
-  container: {
-    maxWidth: '560px',
-    margin: '40px auto',
-    padding: '0 24px',
-  },
-  p: {
-    fontSize: '15px',
-    lineHeight: '1.6',
-    color: '#1a1a1a',
-    margin: '0 0 16px',
-  },
-} as const
-
 export function OnboardingFollowupEmail({ userName }: OnboardingFollowupEmailProps) {
   return (
     <Html>
diff --git a/apps/sim/components/emails/billing/_constants.ts b/apps/sim/components/emails/billing/_constants.ts
@@ -0,0 +1,7 @@
+/** Pro plan features shown in billing upgrade emails */
+export const proFeatures = [
+  { label: '6,000 credits/month', desc: 'included' },
+  { label: '+50 daily refresh', desc: 'credits per day' },
+  { label: '150 runs/min', desc: 'sync executions' },
+  { label: '50GB storage', desc: 'for files & assets' },
+] as const
diff --git a/apps/sim/components/emails/billing/abandoned-checkout-email.tsx b/apps/sim/components/emails/billing/abandoned-checkout-email.tsx
@@ -1,29 +1,10 @@
 import { Body, Head, Html, Preview, Text } from '@react-email/components'
+import { plainEmailStyles as styles } from '@/components/emails/_styles'
 
 interface AbandonedCheckoutEmailProps {
   userName?: string
 }
 
-const styles = {
-  body: {
-    fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
-    backgroundColor: '#ffffff',
-    margin: '0',
-    padding: '0',
-  },
-  container: {
-    maxWidth: '560px',
-    margin: '40px auto',
-    padding: '0 24px',
-  },
-  p: {
-    fontSize: '15px',
-    lineHeight: '1.6',
-    color: '#1a1a1a',
-    margin: '0 0 16px',
-  },
-} as const
-
 export function AbandonedCheckoutEmail({ userName }: AbandonedCheckoutEmailProps) {
   return (
     <Html>
diff --git a/apps/sim/components/emails/billing/credits-exhausted-email.tsx b/apps/sim/components/emails/billing/credits-exhausted-email.tsx
@@ -1,5 +1,6 @@
 import { Link, Section, Text } from '@react-email/components'
 import { baseStyles, colors, typography } from '@/components/emails/_styles'
+import { proFeatures } from '@/components/emails/billing/_constants'
 import { EmailLayout } from '@/components/emails/components'
 import { dollarsToCredits } from '@/lib/billing/credits/conversion'
 import { getBrandConfig } from '@/ee/whitelabeling'
@@ -11,13 +12,6 @@ interface CreditsExhaustedEmailProps {
   upgradeLink: string
 }
 
-const proFeatures = [
-  { label: '6,000 credits/month', desc: 'included' },
-  { label: '+50 daily refresh', desc: 'credits per day' },
-  { label: '150 runs/min', desc: 'sync executions' },
-  { label: '50GB storage', desc: 'for files & assets' },
-]
-
 export function CreditsExhaustedEmail({
   userName,
   currentUsage,
diff --git a/apps/sim/components/emails/billing/free-tier-upgrade-email.tsx b/apps/sim/components/emails/billing/free-tier-upgrade-email.tsx
@@ -1,5 +1,6 @@
 import { Link, Section, Text } from '@react-email/components'
 import { baseStyles, colors, typography } from '@/components/emails/_styles'
+import { proFeatures } from '@/components/emails/billing/_constants'
 import { EmailLayout } from '@/components/emails/components'
 import { dollarsToCredits } from '@/lib/billing/credits/conversion'
 import { getBrandConfig } from '@/ee/whitelabeling'
@@ -12,13 +13,6 @@ interface FreeTierUpgradeEmailProps {
   upgradeLink: string
 }
 
-const proFeatures = [
-  { label: '6,000 credits/month', desc: 'included' },
-  { label: '+50 daily refresh', desc: 'credits per day' },
-  { label: '150 runs/min', desc: 'sync executions' },
-  { label: '50GB storage', desc: 'for files & assets' },
-]
-
 export function FreeTierUpgradeEmail({
   userName,
   percentUsed,
diff --git a/apps/sim/lib/billing/core/usage.ts b/apps/sim/lib/billing/core/usage.ts
@@ -778,8 +778,8 @@ export async function maybeSendUsageThresholdEmail(params: {
       }
     }
 
-    // For 80% threshold email (free users only)
-    if (crosses80 && isFreeUser) {
+    // For 80% threshold email (free users only — skip if they also crossed 100% in same call)
+    if (crosses80 && isFreeUser && !crosses100) {
       const upgradeLink = `${baseUrl}/workspace?billing=upgrade`
       const sendFreeTierEmail = async (email: string, name?: string) => {
         const prefs = await getEmailPreferences(email)

Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-export { baseStyles, colors, spacing, typography } from './base'`
	`1`	`+export { baseStyles, colors, plainEmailStyles, spacing, typography } from './base'`
Original file line number	Diff line number	Diff line change
`@@ -778,8 +778,8 @@ export async function maybeSendUsageThresholdEmail(params: {`
`778`	`778`	`}`
`779`	`779`	`}`
`780`	`780`
`781`		`- // For 80% threshold email (free users only)`
`782`		`- if (crosses80 && isFreeUser) {`
	`781`	`+ // For 80% threshold email (free users only — skip if they also crossed 100% in same call)`
	`782`	`+ if (crosses80 && isFreeUser && !crosses100) {`
`783`	`783`	const upgradeLink = `${baseUrl}/workspace?billing=upgrade`
`784`	`784`	`const sendFreeTierEmail = async (email: string, name?: string) => {`
`785`	`785`	`const prefs = await getEmailPreferences(email)`