Drop @react-email/preview-server from dependencies#153
Conversation
Which shipped with a lot of transitive dependencies and it's own next version (16.1.x) Add a very lightweight development only email preview using `@react-email/components`
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Rate limit exceeded
You’ve run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (7)
WalkthroughThis PR migrates email preview infrastructure from an external ChangesEmail Preview System Migration
Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
src/app/dev/emails/page.tsx (1)
5-8: ⚡ Quick winAdd explicit return type.
Per coding guidelines, always define explicit return types for functions.
♻️ Proposed fix
-export default function EmailPreviewIndex() { +export default function EmailPreviewIndex(): JSX.Element { if (process.env.NODE_ENV === "production") { notFound(); }As per coding guidelines: "Use strict TypeScript type checking. Always define explicit return types for functions."
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/app/dev/emails/page.tsx` around lines 5 - 8, Add an explicit return type to the EmailPreviewIndex function signature (e.g., : React.JSX.Element) to satisfy strict TypeScript rules; update the declaration of EmailPreviewIndex to include this return type while keeping the existing notFound() guard and JSX body intact so the function still returns the page element.src/app/dev/emails/[template]/page.tsx (1)
11-13: ⚡ Quick winAdd explicit return types.
Per coding guidelines, always define explicit return types for functions.
♻️ Proposed fix
-export async function generateStaticParams() { +export async function generateStaticParams(): Promise<Array<{ template: string }>> { return emailFixtures.map((f) => ({ template: f.slug })); } -export default async function EmailPreviewPage({ +export default async function EmailPreviewPage({ params, searchParams, -}: PreviewPageProps) { +}: PreviewPageProps): Promise<JSX.Element> {As per coding guidelines: "Use strict TypeScript type checking. Always define explicit return types for functions."
Also applies to: 15-18
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/app/dev/emails/`[template]/page.tsx around lines 11 - 13, generateStaticParams currently lacks an explicit return type; change its signature to declare the precise Promise return type, e.g. export async function generateStaticParams(): Promise<{ template: string }[]> { ... }, and likewise add explicit return types to the other async functions in this module so every function has an explicit TypeScript return annotation.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/app/dev/emails/`[template]/page.tsx:
- Around line 34-50: The view logic in page.tsx is inverted: when format ===
"html" the code calls render(element, { plainText: true }) and returns the
plain-text <pre>, while the UI link reads "View plain text"; change the
condition so the branch that renders the plain-text output runs when format
indicates plain/text (e.g., format === "plain" or format === "text") or rename
the parameter to format === "plain"; update the conditional around
render(element, { plainText: true }) and the associated link label (the "View
plain text"/"View HTML" toggle) so the format value always represents what to
display rather than what to convert from.
---
Nitpick comments:
In `@src/app/dev/emails/`[template]/page.tsx:
- Around line 11-13: generateStaticParams currently lacks an explicit return
type; change its signature to declare the precise Promise return type, e.g.
export async function generateStaticParams(): Promise<{ template: string }[]> {
... }, and likewise add explicit return types to the other async functions in
this module so every function has an explicit TypeScript return annotation.
In `@src/app/dev/emails/page.tsx`:
- Around line 5-8: Add an explicit return type to the EmailPreviewIndex function
signature (e.g., : React.JSX.Element) to satisfy strict TypeScript rules; update
the declaration of EmailPreviewIndex to include this return type while keeping
the existing notFound() guard and JSX body intact so the function still returns
the page element.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 4a95738c-c96b-43c9-b5a8-6d98b8a1f8b7
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (11)
README.mdemails/order-canceled.tsxemails/order-confirmation.tsxemails/password-reset.tsxemails/shipment-shipped.tsxnext.config.tspackage.jsonsrc/app/dev/emails/[template]/page.tsxsrc/app/dev/emails/fixtures.tsxsrc/app/dev/emails/page.tsxsrc/lib/spree/middleware.ts
💤 Files with no reviewable changes (4)
- emails/order-canceled.tsx
- emails/shipment-shipped.tsx
- emails/password-reset.tsx
- emails/order-confirmation.tsx
Which shipped with a lot of transitive dependencies and it's own next version (16.1.x)
Add a very lightweight development only email preview using
@react-email/componentsSummary by CodeRabbit
New Features
/dev/emailspage, displaying a catalog of all available email templates with sample data.Documentation
Chores