From fd9a57b96c5d74a9ec548f87a5c2977bd97e3cc3 Mon Sep 17 00:00:00 2001
From: DrMesta103 <ceo@sepand.company>
Date: Fri, 12 Jun 2026 22:16:23 +0330
Subject: [PATCH] feat: unified sticky header and removed redundant titles

---
 src/app/admin/locations/page.js  |  8 ---
 src/app/admin/page.js            |  6 +--
 src/app/admin/settings/page.js   |  5 --
 src/app/admin/warehouses/page.js | 10 ----
 src/components/Header.js         | 88 +++++++++++---------------------
 5 files changed, 33 insertions(+), 84 deletions(-)

diff --git a/src/app/admin/locations/page.js b/src/app/admin/locations/page.js
index 3b4f633..3e0688f 100644
--- a/src/app/admin/locations/page.js
+++ b/src/app/admin/locations/page.js
@@ -142,14 +142,6 @@ export default function AdminLocations() {
       
       <div className="flex-1 p-5 flex flex-col gap-6 max-w-md mx-auto w-full mt-2">
         
-        {/* Header Title */}
-        <div className="flex flex-col">
-          <h2 className="text-xl font-black text-gray-800 tracking-tight">تنظیمات قفسه‌ها</h2>
-          <p className="text-xs text-gray-400 font-medium mt-1">
-            ثبت، ویرایش و مدیریت قفسه‌های انبار
-          </p>
-        </div>
-
         {/* Action Box */}
         <div className="w-full bg-white rounded-[24px] p-5 shadow-sm border border-gray-100 flex flex-col gap-4">
           
diff --git a/src/app/admin/page.js b/src/app/admin/page.js
index 3ce8869..59d172b 100644
--- a/src/app/admin/page.js
+++ b/src/app/admin/page.js
@@ -44,7 +44,7 @@ export default function AdminDashboard() {
               <div className="w-12 h-12 bg-indigo-50 text-indigo-500 rounded-2xl flex items-center justify-center mb-1">
                 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg>
               </div>
-              <span className="font-extrabold text-xs text-center text-gray-700">تنظیمات و انبارها</span>
+              <span className="font-extrabold text-xs text-center text-gray-700">تنظیمات مدیریت</span>
             </Link>
           </motion.div>
 
@@ -53,7 +53,7 @@ export default function AdminDashboard() {
               <div className="w-12 h-12 bg-purple-50 text-purple-600 rounded-2xl flex items-center justify-center mb-1">
                 <Layers strokeWidth={1.5} size={24} />
               </div>
-              <span className="font-extrabold text-xs text-center text-gray-700">وضعیت قفسه‌ها</span>
+              <span className="font-extrabold text-xs text-center text-gray-700">مدیریت قفسه‌ها</span>
             </Link>
           </motion.div>
           
@@ -91,7 +91,7 @@ export default function AdminDashboard() {
               <div className="w-10 h-10 bg-indigo-50 text-indigo-500 rounded-xl flex items-center justify-center">
                 <Users strokeWidth={1.5} size={20} />
               </div>
-              <span className="font-extrabold text-sm text-gray-800">مدیریت کاربران و گزارشات</span>
+              <span className="font-extrabold text-sm text-gray-800">کاربران</span>
             </div>
             <div className="w-8 h-8 bg-gray-50 rounded-full flex items-center justify-center">
               <svg className="w-4 h-4 text-gray-400 rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 5l7 7-7 7" /></svg>
diff --git a/src/app/admin/settings/page.js b/src/app/admin/settings/page.js
index e5fec67..1709436 100644
--- a/src/app/admin/settings/page.js
+++ b/src/app/admin/settings/page.js
@@ -92,11 +92,6 @@ export default function SettingsPage() {
       <Header title="تنظیمات سیستم" showBack={true} />
 
       <div className="flex-1 p-5 flex flex-col gap-6 max-w-lg mx-auto w-full mt-2">
-        <div className="flex flex-col">
-          <h2 className="text-xl font-black text-gray-800 tracking-tight">تنظیمات اصلی</h2>
-          <p className="text-xs text-gray-400 font-medium mt-1">مدیریت قوانین انبارگردانی و دسترسی‌ها</p>
-        </div>
-
         <div className="w-full bg-white rounded-[24px] p-6 shadow-sm border border-gray-100 flex flex-col gap-8">
           
           {/* Blind Counting Setting */}
diff --git a/src/app/admin/warehouses/page.js b/src/app/admin/warehouses/page.js
index 72b32dd..18fcfe7 100644
--- a/src/app/admin/warehouses/page.js
+++ b/src/app/admin/warehouses/page.js
@@ -96,16 +96,6 @@ export default function WarehousesPage() {
 
       <div className="flex-1 p-4 md:p-6 flex flex-col gap-6 max-w-lg mx-auto w-full mt-2">
         
-        <div className="flex flex-col mb-2">
-          <h2 className="text-xl font-black text-gray-800 tracking-tight flex items-center gap-2">
-            <Server className="text-indigo-600" size={24} strokeWidth={2.5} />
-            مدیریت انبارهای حسابفا
-          </h2>
-          <p className="text-xs text-gray-500 font-medium mt-2 leading-relaxed">
-            کد انبار باید دقیقاً منطبق با کد انبار در سیستم حسابفا باشد. با افزودن انبار در اینجا، دسترسی کاربران به آن در اپلیکیشن فعال می‌شود.
-          </p>
-        </div>
-
         {/* Add New Warehouse */}
         <div className="bg-white rounded-[24px] p-5 shadow-sm border border-gray-100 flex flex-col gap-4 relative overflow-hidden">
           <div className="absolute top-0 right-0 w-16 h-16 bg-indigo-50/50 rounded-bl-full -z-0"></div>
diff --git a/src/components/Header.js b/src/components/Header.js
index 8fccb5b..22506f6 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -29,74 +29,46 @@ export default function Header({ title = 'داشبورد', showBack = false }) {
     return name.charAt(0);
   };
 
-  if (!showBack) {
-    // Style 4: Modern Floating Island (Pill) Design
-    return (
-      <motion.header 
-        initial={{ y: -50, opacity: 0 }}
-        animate={{ y: 0, opacity: 1 }}
-        transition={{ type: 'spring', stiffness: 300, damping: 24 }}
-        className="mx-4 mt-6 mb-4 p-2 bg-white/70 backdrop-blur-xl border border-white rounded-[28px] flex items-center justify-between shadow-[0_8px_30px_rgb(0,0,0,0.04)]"
-      >
-        <Link href="/settings" className="flex items-center gap-3 hover:opacity-80 transition-opacity">
-          <div className="w-12 h-12 bg-gradient-to-tr from-purple-600 to-indigo-500 rounded-[20px] flex items-center justify-center text-white text-lg font-bold shadow-md shadow-purple-500/20 overflow-hidden">
-            {user?.avatarUrl ? (
-              <img src={user.avatarUrl} alt={user.name} className="w-full h-full object-cover" />
-            ) : (
-              getInitial(user?.name)
-            )}
-          </div>
-          <div className="flex flex-col pr-1">
-            <span className="text-[10px] text-gray-400 font-extrabold tracking-wider mb-0.5">پردیس رایانه</span>
-            <span className="text-sm font-black text-gray-800 tracking-tight">
-              {user?.name || 'کاربر'}
-            </span>
-          </div>
-        </Link>
-
-        <div className="flex items-center gap-2 pl-1">
-          {user?.roles?.includes('ADMIN') && (
-            <Link 
-              href="/admin" 
-              className="w-10 h-10 bg-gray-50 text-gray-600 rounded-[18px] hover:bg-gray-100 transition-colors flex items-center justify-center"
-              title="پنل مدیریت"
-            >
-              <Settings size={18} strokeWidth={2.5} />
-            </Link>
-          )}
-          <button 
-            onClick={handleLogout} 
-            className="w-10 h-10 bg-red-50 text-red-500 rounded-[18px] hover:bg-red-100 transition-colors flex items-center justify-center"
-            title="خروج"
-          >
-            <LogOut size={18} strokeWidth={2.5} />
-          </button>
-        </div>
-      </motion.header>
-    );
-  }
-
-  // Inner pages (showBack = true)
   return (
     <motion.header 
       initial={{ y: -20, opacity: 0 }}
       animate={{ y: 0, opacity: 1 }}
       className="sticky top-4 z-50 mx-4 mb-6 p-2 bg-white/80 backdrop-blur-xl border border-white rounded-[24px] flex items-center justify-between shadow-[0_8px_30px_rgb(0,0,0,0.06)]"
     >
-      <button 
-        onClick={() => router.back()} 
-        className="w-10 h-10 bg-gray-50 text-gray-700 rounded-[18px] hover:bg-gray-100 transition-all flex items-center justify-center"
-      >
-        <ChevronRight size={20} strokeWidth={2.5} />
-      </button>
+      <div className="flex items-center gap-2">
+        {showBack ? (
+          <button 
+            onClick={() => router.back()} 
+            className="w-10 h-10 bg-gray-50 text-gray-700 rounded-[18px] hover:bg-gray-100 transition-all flex items-center justify-center"
+          >
+            <ChevronRight size={20} strokeWidth={2.5} />
+          </button>
+        ) : (
+          <div className="w-10 h-10 bg-indigo-50 text-indigo-600 rounded-[18px] flex items-center justify-center font-black text-sm">
+            {getInitial(user?.name)}
+          </div>
+        )}
+      </div>
       
-      <div className="font-extrabold text-sm text-gray-800 absolute left-1/2 -translate-x-1/2">
+      <div className="font-extrabold text-sm text-gray-800 absolute left-1/2 -translate-x-1/2 whitespace-nowrap">
         {title}
       </div>
       
-      <div className="w-10 h-10 flex items-center justify-center">
-        {/* Decorative dot for symmetry */}
-        <div className="w-1.5 h-1.5 rounded-full bg-gray-300"></div>
+      <div className="flex items-center gap-1.5">
+        {!showBack && user?.roles?.includes('ADMIN') && (
+          <Link 
+            href="/admin" 
+            className="w-10 h-10 bg-gray-50 text-gray-600 rounded-[18px] hover:bg-gray-100 transition-colors flex items-center justify-center"
+          >
+            <Settings size={18} strokeWidth={2.5} />
+          </Link>
+        )}
+        <button 
+          onClick={handleLogout} 
+          className="w-10 h-10 bg-red-50 text-red-500 rounded-[18px] hover:bg-red-100 transition-colors flex items-center justify-center"
+        >
+          <LogOut size={16} strokeWidth={2.5} />
+        </button>
       </div>
     </motion.header>
   );