Add [DEV] prefix to page title on dev environment

os-league-tools-master/src/App.js

@@ -41,6 +41,12 @@ history.listen(() => {
   }
 });
 
+const isDevEnvironment = () => {
+  return window.location.hostname.startsWith('dev.') ||
+         window.location.hostname === 'localhost' ||
+         window.location.port === '3001';
+};
+
 export default function App() {
   useEffect(() => {
     if (trackingId) {
@@ -52,6 +58,28 @@ export default function App() {
     }
   }, []);
 
+  // Prefix title with [DEV] on dev environment
+  useEffect(() => {
+    if (!isDevEnvironment()) return;
+
+    const prefixTitle = () => {
+      if (!document.title.startsWith('[DEV] ')) {
+        document.title = '[DEV] ' + document.title;
+      }
+    };
+
+    prefixTitle();
+
+    // Watch for title changes and re-prefix
+    const observer = new MutationObserver(prefixTitle);
+    const titleElement = document.querySelector('title');
+    if (titleElement) {
+      observer.observe(titleElement, { childList: true, characterData: true, subtree: true });
+    }
+
+    return () => observer.disconnect();
+  }, []);
+
   return (
     <Provider store={store}>
       <SidebarProvider>