Disable error feedback in UI if NEXT_TELEMETRY_DISABLED is set

vercel · Feb 24, 2025 · 2f07841 · 2f07841
1 parent 814da01
commit 2f07841
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 5 deletions.
diff --git a/packages/next/src/build/webpack/plugins/define-env-plugin.ts b/packages/next/src/build/webpack/plugins/define-env-plugin.ts
@@ -275,6 +275,9 @@ export function getDefineEnv({
     'process.env.__NEXT_ASSET_PREFIX': config.assetPrefix,
     'process.env.__NEXT_EXPERIMENTAL_AUTH_INTERRUPTS':
       !!config.experimental.authInterrupts,
+    'process.env.__NEXT_TELEMETRY_DISABLED': Boolean(
+      process.env.NEXT_TELEMETRY_DISABLED
+    ),
     ...(isNodeOrEdgeCompilation
       ? {
           // Fix bad-actors in the npm ecosystem (e.g. `node-formidable`)

diff --git a/...t-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx b/...t-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx
@@ -11,6 +11,7 @@ export function ErrorFeedback({ errorCode, className }: ErrorFeedbackProps) {
   const [votedMap, setVotedMap] = useState<Record<string, boolean>>({})
   const voted = votedMap[errorCode]
   const hasVoted = voted !== undefined
+  const disabled = process.env.__NEXT_TELEMETRY_DISABLED
 
   const handleFeedback = useCallback(
     async (wasHelpful: boolean) => {
@@ -63,16 +64,26 @@ export function ErrorFeedback({ errorCode, className }: ErrorFeedbackProps) {
             </a>
           </p>
           <button
-            aria-label="Mark as helpful"
-            onClick={() => handleFeedback(true)}
+            aria-disabled={disabled ? 'true' : undefined}
+            aria-label={
+              disabled
+                ? 'Feedback disabled due to setting NEXT_TELEMETRY_DISABLED'
+                : 'Mark as helpful'
+            }
+            onClick={disabled ? undefined : () => handleFeedback(true)}
             className={cx('feedback-button', voted === true && 'voted')}
             type="button"
           >
             <ThumbsUp aria-hidden="true" />
           </button>
           <button
-            aria-label="Mark as not helpful"
-            onClick={() => handleFeedback(false)}
+            aria-disabled={disabled ? 'true' : undefined}
+            aria-label={
+              disabled
+                ? 'Feedback disabled due to setting NEXT_TELEMETRY_DISABLED'
+                : 'Mark as not helpful'
+            }
+            onClick={disabled ? undefined : () => handleFeedback(false)}
             className={cx('feedback-button', voted === false && 'voted')}
             type="button"
           >
@@ -130,7 +141,7 @@ export const styles = `
     }
   }
 
-  .feedback-button:disabled {
+  .feedback-button[aria-disabled='true'] {
     opacity: 0.7;
     cursor: not-allowed;
   }