From 2f07841c21561c5d7996d3e9ca0ad175cecbe82c Mon Sep 17 00:00:00 2001
From: Sebastian Sebbie Silbermann <sebastian.silbermann@vercel.com>
Date: Mon, 24 Feb 2025 10:28:04 +0100
Subject: [PATCH] Disable error feedback in UI if `NEXT_TELEMETRY_DISABLED` is
 set

---
 .../webpack/plugins/define-env-plugin.ts      |  3 +++
 .../error-feedback/error-feedback.tsx         | 21 ++++++++++++++-----
 2 files changed, 19 insertions(+), 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
index 7ea3261fe4f8c..38386cdb475e2 100644
--- 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/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx b/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx
index f1b8b28ca9c3d..6038d99721120 100644
--- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx
+++ b/packages/next/src/client/components/react-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;
   }