Fix: 404 page loader stuck, navbar loading spinners, bulletproof NR import

backend/app/core/logger.py

@@ -40,32 +40,39 @@ logger.add(
     enqueue=True
 )
 
-# 6. New Relic Cloud Sink
+# 6. New Relic Cloud Sink (fully optional — never crashes the app)
 #    Set NEW_RELIC_LICENSE_KEY and NEW_RELIC_APP_NAME in your environment.
 _NR_KEY = os.environ.get("NEW_RELIC_LICENSE_KEY", "")
 if _NR_KEY:
-    import newrelic.agent
     try:
-        newrelic.agent.initialize()
-    except Exception:
-        pass
-
-    def _newrelic_sink(message):
-        record = message.record
+        import newrelic.agent
         try:
-            # Send to New Relic Logs APM
-            newrelic.agent.record_log_event(
-                message=record["message"],
-                level=record["level"].name,
-                timestamp=int(record["time"].timestamp() * 1000),
-                attributes={
-                    "request_id": record["extra"].get("request_id", "SYSTEM"),
-                    "logger": record["name"],
-                    "function": record["function"],
-                    "line": record["line"],
-                }
-            )
+            newrelic.agent.initialize()
         except Exception:
-            pass  # Never let cloud logging failure affect the app
+            pass
+
+        def _newrelic_sink(message):
+            record = message.record
+            try:
+                # Send to New Relic Logs APM
+                newrelic.agent.record_log_event(
+                    message=record["message"],
+                    level=record["level"].name,
+                    timestamp=int(record["time"].timestamp() * 1000),
+                    attributes={
+                        "request_id": record["extra"].get("request_id", "SYSTEM"),
+                        "logger": record["name"],
+                        "function": record["function"],
+                        "line": record["line"],
+                    }
+                )
+            except Exception:
+                pass  # Never let cloud logging failure affect the app
 
-    logger.add(_newrelic_sink, level="INFO", enqueue=True)
+        logger.add(_newrelic_sink, level="INFO", enqueue=True)
+    except ImportError:
+        # newrelic package not installed — skip silently
+        pass
+    except Exception:
+        # Any other error during setup — skip silently
+        pass

frontend/components/shared/Navbar.tsx

@@ -17,6 +17,7 @@ export default function Navbar({ onAnalyzeClick }: NavbarProps) {
     const [dropdownOpen, setDropdownOpen] = useState(false);
     const [dropdownPinned, setDropdownPinned] = useState(false);
     const [soundEnabled, setSoundEnabled] = useState(true);
+    const [navLoading, setNavLoading] = useState(false);
     const closeTimeoutRef = useRef<NodeJS.Timeout | null>(null);
 
     const handleMouseEnter = () => {
@@ -153,10 +154,30 @@ export default function Navbar({ onAnalyzeClick }: NavbarProps) {
                     <div className="flex items-center gap-3">
                         {!isAuthenticated ? (
                             <>
-                                <button onClick={() => router.push('/login')} className="hidden sm:block bg-transparent text-[var(--theme-text)] border border-[var(--theme-text)]/30 px-6 py-2 rounded-full text-[11px] font-bold tracking-tight hover:bg-[var(--theme-text)]/5 hover-scale">
+                                <button 
+                                    onClick={() => { setNavLoading(true); router.push('/login'); }} 
+                                    disabled={navLoading}
+                                    className="hidden sm:flex items-center gap-2 bg-transparent text-[var(--theme-text)] border border-[var(--theme-text)]/30 px-6 py-2 rounded-full text-[11px] font-bold tracking-tight hover:bg-[var(--theme-text)]/5 hover-scale disabled:opacity-60 transition-opacity"
+                                >
+                                    {navLoading ? (
+                                        <svg className="animate-spin w-3 h-3" viewBox="0 0 24 24" fill="none">
+                                            <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"/>
+                                            <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v8H4z"/>
+                                        </svg>
+                                    ) : null}
                                     Register
                                 </button>
-                                <button onClick={() => router.push('/login')} className="hidden sm:block bg-[var(--theme-text)] text-[var(--theme-bg)] px-6 py-2 rounded-full text-[11px] font-bold tracking-tight hover:shadow-[0_0_20px_rgba(253,232,214,0.3)] hover-scale">
+                                <button 
+                                    onClick={() => { setNavLoading(true); router.push('/login'); }} 
+                                    disabled={navLoading}
+                                    className="hidden sm:flex items-center gap-2 bg-[var(--theme-text)] text-[var(--theme-bg)] px-6 py-2 rounded-full text-[11px] font-bold tracking-tight hover:shadow-[0_0_20px_rgba(253,232,214,0.3)] hover-scale disabled:opacity-60 transition-opacity"
+                                >
+                                    {navLoading ? (
+                                        <svg className="animate-spin w-3 h-3" viewBox="0 0 24 24" fill="none">
+                                            <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"/>
+                                            <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v8H4z"/>
+                                        </svg>
+                                    ) : null}
                                     Login
                                 </button>
                             </>

frontend/components/shared/PageLoader.tsx

@@ -22,6 +22,12 @@ export default function PageLoader({ children }: { children: React.ReactNode })
 
         let progress = 0;
         
+        // Safety net: force complete after 2500ms even if __PAGE_LOADED never fires
+        // (e.g. the 404 page, or any page that doesn't set the flag)
+        const safetyTimeout = setTimeout(() => {
+            (window as any).__PAGE_LOADED = true;
+        }, 2500);
+
         const interval = setInterval(() => {
             if (progress < 90) {
                 progress += Math.random() * 15 + 5;
@@ -40,6 +46,9 @@ export default function PageLoader({ children }: { children: React.ReactNode })
 
         return () => {
             clearInterval(interval);
+            clearTimeout(safetyTimeout);
+            // Always reset the flag on cleanup so next page starts fresh
+            (window as any).__PAGE_LOADED = false;
         };
     }, [pathname]);