From 79e274190feb050350fa4d1431dbd7c314ad3524 Mon Sep 17 00:00:00 2001
From: Arik Chakma <arikchangma@gmail.com>
Date: Wed, 25 Jun 2025 00:38:10 +0600
Subject: [PATCH] fix: hydration error

---
 .../GenerateCourse/AICourseContent.tsx        | 30 +++++++++++--------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/src/components/GenerateCourse/AICourseContent.tsx b/src/components/GenerateCourse/AICourseContent.tsx
index 78e8570cc..9a71d89cc 100644
--- a/src/components/GenerateCourse/AICourseContent.tsx
+++ b/src/components/GenerateCourse/AICourseContent.tsx
@@ -256,12 +256,14 @@ export function AICourseContent(props: AICourseContentProps) {
             </span>
           </a>
           <div className="flex items-center gap-2">
-            <div className="flex flex-row lg:hidden">
-              <AICourseLimit
-                onUpgrade={() => setShowUpgradeModal(true)}
-                onShowLimits={() => setShowAILimitsPopup(true)}
-              />
-            </div>
+            {!isLoading && (
+              <div className="flex flex-row lg:hidden">
+                <AICourseLimit
+                  onUpgrade={() => setShowUpgradeModal(true)}
+                  onShowLimits={() => setShowAILimitsPopup(true)}
+                />
+              </div>
+            )}
 
             {viewMode === 'module' && (
               <button
@@ -326,14 +328,16 @@ export function AICourseContent(props: AICourseContentProps) {
             </div>
           </div>
         </div>
-        <div className="flex gap-2">
-          <div className="hidden gap-2 lg:flex">
-            <AICourseLimit
-              onUpgrade={() => setShowUpgradeModal(true)}
-              onShowLimits={() => setShowAILimitsPopup(true)}
-            />
+        {!isLoading && (
+          <div className="flex gap-2">
+            <div className="hidden gap-2 lg:flex">
+              <AICourseLimit
+                onUpgrade={() => setShowUpgradeModal(true)}
+                onShowLimits={() => setShowAILimitsPopup(true)}
+              />
+            </div>
           </div>
-        </div>
+        )}
       </header>
 
       <div className="flex flex-1 overflow-hidden">