From 15ed6e7d47507457d0c711454a40d86cd42d4472 Mon Sep 17 00:00:00 2001
From: abcdmku <63693423+abcdmku@users.noreply.github.com>
Date: Sun, 23 Aug 2026 15:49:08 -0500
Subject: [PATCH 1/2] feat(web): show notice instead of app in Tesla in-car
 browsers

Detects the Tesla/<version> UA token (QtCarBrowser on older models)
and renders only "T3 Code does not endorse this behavior".

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 apps/web/src/main.tsx | 45 +++++++++++++++++++++++++------------------
 1 file changed, 26 insertions(+), 19 deletions(-)

diff --git a/apps/web/src/main.tsx b/apps/web/src/main.tsx
index 6eaaca6f57de..90a871542464 100644
--- a/apps/web/src/main.tsx
+++ b/apps/web/src/main.tsx
@@ -37,25 +37,32 @@ const electronClerkUI = {
 
 const app = <AppRoot router={router} />;
 
+// Tesla in-car browsers send a "Tesla/<version>" UA token (older models: QtCarBrowser).
+const isTeslaCarBrowser = /Tesla\/|QtCarBrowser/.test(navigator.userAgent);
+
 ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
-  <React.StrictMode>
-    {clerkPublishableKey && hasCloudPublicConfig() ? (
-      isElectron ? (
-        <ElectronClerkProvider
-          {...electronClerkUI}
-          appearance={clerkAppearance}
-          publishableKey={clerkPublishableKey}
-          passkeys={passkeys}
-        >
-          <ManagedRelayAuthProvider>{app}</ManagedRelayAuthProvider>
-        </ElectronClerkProvider>
+  isTeslaCarBrowser ? (
+    "T3 Code does not endorse this behavior"
+  ) : (
+    <React.StrictMode>
+      {clerkPublishableKey && hasCloudPublicConfig() ? (
+        isElectron ? (
+          <ElectronClerkProvider
+            {...electronClerkUI}
+            appearance={clerkAppearance}
+            publishableKey={clerkPublishableKey}
+            passkeys={passkeys}
+          >
+            <ManagedRelayAuthProvider>{app}</ManagedRelayAuthProvider>
+          </ElectronClerkProvider>
+        ) : (
+          <ClerkProvider appearance={clerkAppearance} publishableKey={clerkPublishableKey}>
+            <ManagedRelayAuthProvider>{app}</ManagedRelayAuthProvider>
+          </ClerkProvider>
+        )
       ) : (
-        <ClerkProvider appearance={clerkAppearance} publishableKey={clerkPublishableKey}>
-          <ManagedRelayAuthProvider>{app}</ManagedRelayAuthProvider>
-        </ClerkProvider>
-      )
-    ) : (
-      app
-    )}
-  </React.StrictMode>,
+        app
+      )}
+    </React.StrictMode>
+  ),
 );

From a231dfbd31000da0c2486381e6cac8870c4c4e7c Mon Sep 17 00:00:00 2001
From: abcdmku <63693423+abcdmku@users.noreply.github.com>
Date: Sun, 23 Aug 2026 15:57:38 -0500
Subject: [PATCH 2/2] fix(web): render Tesla notice on the app's themed
 centered surface

Review feedback: the bare text node bypassed the boot surface and theme
tokens. Wrap the notice in the standard full-screen centered container
using bg-background/text-foreground.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 apps/web/src/main.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/apps/web/src/main.tsx b/apps/web/src/main.tsx
index 90a871542464..7f1eac36b44b 100644
--- a/apps/web/src/main.tsx
+++ b/apps/web/src/main.tsx
@@ -42,7 +42,9 @@ const isTeslaCarBrowser = /Tesla\/|QtCarBrowser/.test(navigator.userAgent);
 
 ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
   isTeslaCarBrowser ? (
-    "T3 Code does not endorse this behavior"
+    <div className="flex min-h-screen items-center justify-center bg-background px-4 py-10 text-center text-foreground">
+      <p className="max-w-md text-lg font-medium">T3 Code does not endorse this behavior</p>
+    </div>
   ) : (
     <React.StrictMode>
       {clerkPublishableKey && hasCloudPublicConfig() ? (