Skip to content

Commit 7846e43

Browse files
authored
Update devl-toolbar setup.mdx (#12179)
* Update devl-toolbar setup.mdx * Update docs/product/dev-toolbar/setup.mdx
1 parent dceb512 commit 7846e43

File tree

1 file changed

+8
-11
lines changed

1 file changed

+8
-11
lines changed

docs/product/dev-toolbar/setup.mdx

Lines changed: 8 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -114,30 +114,27 @@ interface FeatureFlagAdapter {
114114
[MockFeatureFlagAdapter.tsx](https://github.com/getsentry/sentry-toolbar/blob/main/src/env/demo/MockFeatureFlagAdapter.tsx) is an example adapter to use as a reference.
115115

116116

117-
## Deploying To Dev, Staging, and Production Environments
117+
## Deploying To Dev and Staging Environments
118118
Since the Dev Toolbar is deployed onto specific pages, it's strongly recommended that you consider which environments the toolbar should apply to.
119119

120120
In dev and staging environments, you might want to *unconditionally* include the toolbar so that all developers and testers can use it and quickly go from the page they're looking at back to Sentry for further debugging.
121121

122-
In production however, it's strongly recommended to *conditionally* include the Dev Toolbar `<script>` tag so that only members of your Sentry organization can see it. The specific implementation for conditionally including the Dev Toolbar is something you'll need to write based on how your app works and how your dev team is set up.
123-
124-
For example, if your web application requires authentication to access, you could add a conditional where the Dev Toolbar is shown always when deployed to development **and** staging, but in production only show the toolbar **if** an employee is logged in.
125-
126-
127122
The code might look like this:
128123
```javascript
129-
// example conditions to render the toolbar in different environments.
130-
131124
const env = process.env.SENTRY_ENVIRONMENT || 'development';
132-
const isEmployee = user.email.endsWith('@joshys-pizza.com')
133125

134126
const isDev = env === 'development' || env === 'staging';
135-
const isEmployeeInProd = env === 'production' && isEmployee;
136-
if (isDev || isEmployeeInProd) {
127+
if (isDev ) {
137128
SentryToolbar.init({ ... });
138129
}
139130
```
140131

132+
## Deploying to Production Environments
133+
134+
In production, it's strongly recommended to *conditionally* include the Dev Toolbar `<script>` tag so that only members of your Sentry organization can see it. The specific implementation for conditionally including the Dev Toolbar is something you'll need to write based on how your app works and how your dev team is set up.
135+
136+
For example, if your web application requires authentication to access, you could add a conditional where the Dev Toolbar is shown always when deployed to development **and** staging, but in production only show the toolbar **if** an employee is logged in.
137+
141138
If the toolbar `<script>` is accidentally included on your site, and `SentryToolbar.init()` is called, then a "Login to Sentry" button will be visible to the public. This is not ideal, but your data in Sentry will still be safe as users outside of your Sentry organization will not be able to authenticate themselves.
142139

143140
## Conditionally Inserting Script Tag

0 commit comments

Comments
 (0)