From a407105bb86c9418ce15b8cb9b1aae0d644eeb38 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Tue, 11 Nov 2025 12:22:40 +0530
Subject: [PATCH] [WEB-5389] chore: enable progress bar for production builds
 and add logo spinner for hydration fallback (#8093)

* [WEB-5389] chore: enable progress bar for production builds

* feat: add LogoSpinner to HydrateFallback in admin, space, and web apps
---
 apps/admin/app/root.tsx                           | 7 ++++++-
 apps/admin/core/lib/b-progress/AppProgressBar.tsx | 1 -
 apps/space/app/root.tsx                           | 7 ++++++-
 apps/space/core/lib/b-progress/AppProgressBar.tsx | 1 -
 apps/web/app/root.tsx                             | 7 ++++++-
 apps/web/core/lib/b-progress/AppProgressBar.tsx   | 1 -
 6 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/apps/admin/app/root.tsx b/apps/admin/app/root.tsx
index 746c2099e..657b96094 100644
--- a/apps/admin/app/root.tsx
+++ b/apps/admin/app/root.tsx
@@ -5,6 +5,7 @@ import appleTouchIcon from "@/app/assets/favicon/apple-touch-icon.png?url";
 import favicon16 from "@/app/assets/favicon/favicon-16x16.png?url";
 import favicon32 from "@/app/assets/favicon/favicon-32x32.png?url";
 import faviconIco from "@/app/assets/favicon/favicon.ico?url";
+import { LogoSpinner } from "@/components/common/logo-spinner";
 import globalStyles from "@/styles/globals.css?url";
 import type { Route } from "./+types/root";
 import { AppProviders } from "./providers";
@@ -58,7 +59,11 @@ export default function Root() {
 }
 
 export function HydrateFallback() {
-  return null;
+  return (
+    <div className="relative flex h-screen w-full items-center justify-center">
+      <LogoSpinner />
+    </div>
+  );
 }
 
 export function ErrorBoundary() {
diff --git a/apps/admin/core/lib/b-progress/AppProgressBar.tsx b/apps/admin/core/lib/b-progress/AppProgressBar.tsx
index 1bd9362c0..915b19ff9 100644
--- a/apps/admin/core/lib/b-progress/AppProgressBar.tsx
+++ b/apps/admin/core/lib/b-progress/AppProgressBar.tsx
@@ -38,7 +38,6 @@ const PROGRESS_CONFIG: Readonly<ProgressConfig> = {
   easing: "ease",
   trickle: true,
   delay: 0,
-  isDisabled: import.meta.env.PROD, // Disable progress bar in production builds
 } as const;
 
 /**
diff --git a/apps/space/app/root.tsx b/apps/space/app/root.tsx
index 680ce0b55..f36031fbd 100644
--- a/apps/space/app/root.tsx
+++ b/apps/space/app/root.tsx
@@ -5,6 +5,7 @@ import appleTouchIcon from "@/app/assets/favicon/apple-touch-icon.png?url";
 import favicon16 from "@/app/assets/favicon/favicon-16x16.png?url";
 import favicon32 from "@/app/assets/favicon/favicon-32x32.png?url";
 import faviconIco from "@/app/assets/favicon/favicon.ico?url";
+import { LogoSpinner } from "@/components/common/logo-spinner";
 import globalStyles from "@/styles/globals.css?url";
 // types
 import type { Route } from "./+types/root";
@@ -62,7 +63,11 @@ export default function Root() {
 }
 
 export function HydrateFallback() {
-  return null;
+  return (
+    <div className="relative flex h-screen w-full items-center justify-center">
+      <LogoSpinner />
+    </div>
+  );
 }
 
 export function ErrorBoundary() {
diff --git a/apps/space/core/lib/b-progress/AppProgressBar.tsx b/apps/space/core/lib/b-progress/AppProgressBar.tsx
index 1bd9362c0..915b19ff9 100644
--- a/apps/space/core/lib/b-progress/AppProgressBar.tsx
+++ b/apps/space/core/lib/b-progress/AppProgressBar.tsx
@@ -38,7 +38,6 @@ const PROGRESS_CONFIG: Readonly<ProgressConfig> = {
   easing: "ease",
   trickle: true,
   delay: 0,
-  isDisabled: import.meta.env.PROD, // Disable progress bar in production builds
 } as const;
 
 /**
diff --git a/apps/web/app/root.tsx b/apps/web/app/root.tsx
index c37fe6f60..2c4edebd5 100644
--- a/apps/web/app/root.tsx
+++ b/apps/web/app/root.tsx
@@ -13,6 +13,7 @@ import faviconIco from "@/app/assets/favicon/favicon.ico?url";
 import icon180 from "@/app/assets/icons/icon-180x180.png?url";
 import icon512 from "@/app/assets/icons/icon-512x512.png?url";
 import ogImage from "@/app/assets/og-image.png?url";
+import { LogoSpinner } from "@/components/common/logo-spinner";
 import globalStyles from "@/styles/globals.css?url";
 import type { Route } from "./+types/root";
 // local
@@ -118,7 +119,11 @@ export default function Root() {
 }
 
 export function HydrateFallback() {
-  return null;
+  return (
+    <div className="relative flex h-screen w-full items-center justify-center">
+      <LogoSpinner />
+    </div>
+  );
 }
 
 export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
diff --git a/apps/web/core/lib/b-progress/AppProgressBar.tsx b/apps/web/core/lib/b-progress/AppProgressBar.tsx
index 1bd9362c0..915b19ff9 100644
--- a/apps/web/core/lib/b-progress/AppProgressBar.tsx
+++ b/apps/web/core/lib/b-progress/AppProgressBar.tsx
@@ -38,7 +38,6 @@ const PROGRESS_CONFIG: Readonly<ProgressConfig> = {
   easing: "ease",
   trickle: true,
   delay: 0,
-  isDisabled: import.meta.env.PROD, // Disable progress bar in production builds
 } as const;
 
 /**