Conversation
adds sentry
enables source maps for sentry errors
Fix to Bin Counter. Previously only counted unread mails in bin, now fixed.
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThis update integrates Sentry error monitoring and performance tracing throughout the mail application. It adds new client, server, and edge Sentry configuration files, enhances Next.js configuration for Sentry, introduces instrumentation modules, and updates dependencies and scripts. Additional improvements include refined error handling, export renaming, asynchronous state refetching, and label count logic adjustment. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant NextApp
participant Sentry
User->>NextApp: Triggers error or route transition
NextApp->>Sentry: Initializes Sentry (client/server/edge)
NextApp->>Sentry: Reports error or performance data
Sentry-->>NextApp: Acknowledges data
Poem
Note ⚡️ AI Code Reviews for VS Code, Cursor, WindsurfCodeRabbit now has a plugin for VS Code, Cursor and Windsurf. This brings AI code reviews directly in the code editor. Each commit is reviewed immediately, finding bugs before the PR is raised. Seamless context handoff to your AI code agent ensures that you can easily incorporate review feedback. Note ⚡️ Faster reviews with cachingCodeRabbit now supports caching for code and dependencies, helping speed up reviews. This means quicker feedback, reduced wait times, and a smoother review experience overall. Cached data is encrypted and stored securely. This feature will be automatically enabled for all accounts on May 16th. To opt out, configure 📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 7
🧹 Nitpick comments (7)
apps/mail/app/error.tsx (1)
7-7: Remove unused importThe
Errorimport from 'next/error' appears to be unused in this component.-import Error from 'next/error';🧰 Tools
🪛 Biome (1.9.4)
[error] 7-7: Do not shadow the global "Error" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
apps/mail/app/api/sentry-example-api/route.ts (1)
11-14: Remove unreachable codeThe return statement on line 13 is unreachable because of the throw statement that precedes it. While this is intentional for testing, it's best practice to remove unreachable code.
export function GET() { throw new SentryExampleAPIError("This error is raised on the backend called by the example page."); - return NextResponse.json({ data: "Testing Sentry Error..." }); }🧰 Tools
🪛 Biome (1.9.4)
[error] 13-13: This code is unreachable
... because this statement will throw an exception beforehand
(lint/correctness/noUnreachable)
apps/mail/sentry.edge.config.ts (1)
11-12: Consider adjusting trace sampling rate for productionA tracesSampleRate of 1.0 means 100% of transactions will be captured, which might generate significant data and increase costs in production. Consider reducing this value in production environments.
// Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control. - tracesSampleRate: 1, + tracesSampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,apps/mail/instrumentation-client.ts (1)
15-21: Consider conditionally adjusting sampling rates for productionWhile the current sampling rates are well-documented, consider dynamically adjusting them based on the environment. For production, you might want to lower the tracesSampleRate to reduce data volume and costs.
// Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control. - tracesSampleRate: 1, + tracesSampleRate: process.env.NODE_ENV === 'production' ? 0.1 : 1,apps/mail/instrumentation.ts (1)
3-11: Consider adding error handling for dynamic imports.While the dynamic imports work correctly, adding error handling would make the code more robust, especially in production environments.
export async function register() { if (process.env.NEXT_RUNTIME === 'nodejs') { - await import('./sentry.server.config'); + try { + await import('./sentry.server.config'); + } catch (error) { + console.error('Failed to load Sentry server config:', error); + } } if (process.env.NEXT_RUNTIME === 'edge') { - await import('./sentry.edge.config'); + try { + await import('./sentry.edge.config'); + } catch (error) { + console.error('Failed to load Sentry edge config:', error); + } } }apps/mail/app/sentry-example-page/page.tsx (2)
86-197: Consider moving styles to a separate CSS file.While the inline styles work, they make the component file quite lengthy. Consider moving these styles to a separate CSS module for better maintainability.
You could create a
styles.module.cssfile in the same directory and import it:import styles from './styles.module.css'; // Then in your JSX: <main className={styles.main}> {/* ... */} </main>
186-186: Add responsive width for connectivity error display.The connectivity error div has a fixed width of 500px, which might cause layout issues on smaller screens.
- width: 500px; + max-width: 500px; + width: 100%;
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
⛔ Files ignored due to path filters (1)
bun.lockis excluded by!**/*.lock
📒 Files selected for processing (12)
apps/mail/.gitignore(1 hunks)apps/mail/app/api/sentry-example-api/route.ts(1 hunks)apps/mail/app/error.tsx(1 hunks)apps/mail/app/sentry-example-page/page.tsx(1 hunks)apps/mail/components/mail/mail.tsx(2 hunks)apps/mail/instrumentation-client.ts(1 hunks)apps/mail/instrumentation.ts(1 hunks)apps/mail/next.config.ts(3 hunks)apps/mail/package.json(3 hunks)apps/mail/sentry.edge.config.ts(1 hunks)apps/mail/sentry.server.config.ts(1 hunks)apps/server/src/lib/driver/google.ts(1 hunks)
🧰 Additional context used
🪛 Biome (1.9.4)
apps/mail/app/api/sentry-example-api/route.ts
[error] 13-13: This code is unreachable
... because this statement will throw an exception beforehand
(lint/correctness/noUnreachable)
apps/mail/app/error.tsx
[error] 7-7: Do not shadow the global "Error" property.
Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.
(lint/suspicious/noShadowRestrictedNames)
🔇 Additional comments (19)
apps/server/src/lib/driver/google.ts (2)
164-166: Changed thread counting logic for TRASH labelThe counting behavior has been modified to show total threads for the TRASH label rather than only unread threads. This provides users with a better overview of all items in the trash folder.
169-169: Improved handling of null/undefined valuesGood use of the nullish coalescing operator to properly handle cases where count might be null or undefined.
apps/mail/.gitignore (1)
45-50: Properly excluded Sentry config files from version controlGood practice to exclude sensitive Sentry configuration files from version control.
apps/mail/components/mail/mail.tsx (2)
234-236: Properly awaiting async operations in toast callbacksGood improvement to properly await the completion of
refetchBrainState()in thefinallyblock, ensuring the brain state is refreshed before the promise settles.
245-247: Properly awaiting async operations in toast callbacksSimilarly good improvement to properly await the completion of
refetchBrainState()in thefinallyblock for the disable brain operation.apps/mail/app/error.tsx (2)
9-9: LGTM: Component renamed to avoid shadowing global ErrorRenaming the component from
ErrortoErrorPageis a good practice to avoid shadowing the global Error object.
14-16: LGTM: Sentry integration properly implementedGood implementation of Sentry error capturing. The useEffect hook correctly captures exceptions whenever the error prop changes.
apps/mail/app/api/sentry-example-api/route.ts (1)
4-9: LGTM: Well-structured custom error classGood implementation of a custom error class with a descriptive name property, which will help with error identification in Sentry.
apps/mail/instrumentation-client.ts (1)
30-30: LGTM: Good router transition tracking implementationExcellent addition of the router transition tracking function. This will help monitor navigation performance and errors in the client application.
apps/mail/instrumentation.ts (2)
1-13: Well-structured Sentry instrumentation setup.The instrumentation file correctly handles different runtime environments by conditionally importing the appropriate Sentry configuration. This approach is efficient and follows best practices for Next.js applications with server and edge components.
13-13: Good use of Sentry's request error capture.Exporting
onRequestErroras an alias forSentry.captureRequestErroris a clean approach that will make it easier to integrate error handling in request contexts.apps/mail/package.json (1)
11-12: Sentry source maps script correctly configured.The source maps script is properly set up with organization and project parameters for Sentry CLI.
apps/mail/next.config.ts (3)
1-2: Sentry NextJS integration properly imported.The import of
withSentryConfigfrom@sentry/nextjsis correct for integrating Sentry with Next.js.
23-23: Source maps enabled for production, good for error tracking.Enabling
productionBrowserSourceMapswill improve error stack traces in production, which is essential for effective Sentry monitoring.
83-83:Details
✅ Verification successful
Security consideration: Verify that tunnelRoute doesn't conflict with existing routes.
The
tunnelRoute: '/monitoring'setting could potentially conflict with existing routes in your application.
🏁 Script executed:
#!/bin/bash # Check if there are any existing routes or middlewares that use the '/monitoring' path echo "Checking for existing '/monitoring' routes..." grep -r "'/monitoring'" --include="*.ts" --include="*.tsx" apps/mail grep -r '"/monitoring"' --include="*.ts" --include="*.tsx" apps/mailLength of output: 309
No conflicting ‘/monitoring’ routes detected
A search across apps/mail found only thetunnelRoute: '/monitoring'definition in next.config.ts and no other references to that path. No further changes are needed.apps/mail/app/sentry-example-page/page.tsx (4)
1-13: Custom error class properly implemented.The
SentryExampleFrontendErrorclass is well-structured and follows good practices for custom error types.
14-25: Good use of Sentry SDK connectivity diagnosis.The component properly checks for Sentry connectivity on mount, which is essential for diagnosing issues with ad blockers or network connectivity.
47-65: Well-implemented error generation with Sentry span.The error generation mechanism correctly:
- Creates a Sentry span for performance monitoring
- Makes a request to the example API
- Throws a custom error if the response is not OK
This provides a good demonstration of Sentry's error tracking capabilities.
67-77: Good user feedback for error states and connectivity issues.The component provides appropriate feedback to users about error sending status and potential connectivity problems with Sentry, including helpful links to documentation.
| // This file configures the initialization of Sentry on the server. | ||
| // The config you add here will be used whenever the server handles a request. | ||
| // https://docs.sentry.io/platforms/javascript/guides/nextjs/ | ||
|
|
||
| import * as Sentry from "@sentry/nextjs"; | ||
|
|
||
| Sentry.init({ | ||
| dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936", | ||
|
|
||
| // Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control. | ||
| tracesSampleRate: 1, | ||
|
|
||
| // Setting this option to true will print useful information to the console while you're setting up Sentry. | ||
| debug: false, | ||
| }); |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Consider using environment variables for Sentry DSN
While the server-side Sentry configuration looks good overall, it's better to store the DSN in an environment variable rather than hardcoding it in the source code.
- dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936",
+ dsn: process.env.SENTRY_DSN,Also, consider adjusting tracesSampleRate to a lower value in production to reduce the volume of data sent to Sentry.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| // This file configures the initialization of Sentry on the server. | |
| // The config you add here will be used whenever the server handles a request. | |
| // https://docs.sentry.io/platforms/javascript/guides/nextjs/ | |
| import * as Sentry from "@sentry/nextjs"; | |
| Sentry.init({ | |
| dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936", | |
| // Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control. | |
| tracesSampleRate: 1, | |
| // Setting this option to true will print useful information to the console while you're setting up Sentry. | |
| debug: false, | |
| }); | |
| // This file configures the initialization of Sentry on the server. | |
| // The config you add here will be used whenever the server handles a request. | |
| // https://docs.sentry.io/platforms/javascript/guides/nextjs/ | |
| import * as Sentry from "@sentry/nextjs"; | |
| Sentry.init({ | |
| dsn: process.env.SENTRY_DSN, | |
| // Define how likely traces are sampled. Adjust this value in production, or use tracesSampler for greater control. | |
| tracesSampleRate: 1, | |
| // Setting this option to true will print useful information to the console while you're setting up Sentry. | |
| debug: false, | |
| }); |
🤖 Prompt for AI Agents
In apps/mail/sentry.server.config.ts lines 1 to 15, the Sentry DSN is hardcoded,
which is insecure and inflexible. Replace the hardcoded DSN string with a
reference to an environment variable, such as process.env.SENTRY_DSN, and ensure
this variable is set in your deployment environment. Additionally, adjust the
tracesSampleRate to a lower value for production environments to limit data
volume, possibly by using a conditional check on the environment.
| Sentry.init({ | ||
| dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936", |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Move DSN to environment variables
The Sentry DSN should be stored in an environment variable rather than hardcoded in the source code. This improves security and allows for different DSNs in different environments.
Sentry.init({
- dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936",
+ dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
🤖 Prompt for AI Agents
In apps/mail/sentry.edge.config.ts around lines 8 to 9, the Sentry DSN is
hardcoded in the source code, which is insecure. Replace the hardcoded DSN
string with a reference to an environment variable, such as
process.env.SENTRY_DSN, and ensure the environment variable is properly set in
your deployment environments.
| Sentry.init({ | ||
| dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936", | ||
|
|
There was a problem hiding this comment.
🛠️ Refactor suggestion
Move DSN to environment variables
The Sentry DSN should be stored in an environment variable rather than hardcoded in the source code, consistent with the recommendation for the edge configuration.
Sentry.init({
- dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936",
+ dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| Sentry.init({ | |
| dsn: "https://03f6397c0eb458bf1e37c4776a31797c@o4509328786915328.ingest.us.sentry.io/4509328795303936", | |
| Sentry.init({ | |
| dsn: process.env.NEXT_PUBLIC_SENTRY_DSN, |
🤖 Prompt for AI Agents
In apps/mail/instrumentation-client.ts around lines 7 to 9, the Sentry DSN is
hardcoded in the source code. To fix this, remove the hardcoded DSN string and
instead read the DSN value from an environment variable, such as
process.env.SENTRY_DSN, ensuring the DSN is not exposed in the codebase and can
be configured securely.
| // See the following for more information: | ||
| // https://docs.sentry.io/product/crons/ | ||
| // https://vercel.com/docs/cron-jobs | ||
| automaticVercelMonitors: true, |
There was a problem hiding this comment.
💡 Verification agent
🧩 Analysis chain
Ensure Vercel Cron integration is properly configured.
The automaticVercelMonitors: true setting enables Sentry monitoring for Vercel Cron jobs. Ensure that your Vercel project has cron jobs that need monitoring.
🏁 Script executed:
#!/bin/bash
# Check if there are Vercel cron jobs configured in the project
echo "Checking for Vercel cron job configurations..."
grep -r "cron" --include="vercel.json" --include="*.ts" --include="*.tsx" apps/mailLength of output: 316
Configure or Disable Vercel Cron Monitoring
It looks like there are no Vercel Cron jobs defined in your project (no cron entries found in vercel.json or any .ts/.tsx files). Since you’ve enabled automaticVercelMonitors: true in apps/mail/next.config.ts:92, you should:
- Add one or more Vercel Cron job definitions to
vercel.json(see https://vercel.com/docs/cron-jobs) or implement scheduled serverless functions. - Or, if you don’t have any cron schedules, set
automaticVercelMonitors: falseto avoid unused Sentry monitors.
This ensures your Sentry integration aligns with actual cron workflows.
🤖 Prompt for AI Agents
In apps/mail/next.config.ts at line 92, the setting automaticVercelMonitors is
enabled but no Vercel cron jobs are defined in the project. To fix this, either
add valid Vercel cron job definitions in vercel.json or implement scheduled
serverless functions that require monitoring, or disable this setting by setting
automaticVercelMonitors to false to prevent unnecessary Sentry monitoring.
…ation in home route for improved error handling and SVG fetching.
4 participants
Summary by CodeRabbit