fix: Remove duplicate header in SettingsLayout
Fixed double header issue in Settings pages. Issue: - SettingsLayout showed inline header when action prop exists - This caused duplicate headers: 1. Contextual header (sticky, correct) ✅ 2. Inline header (scrollable, duplicate) ❌ Root Cause: - Logic was: !onSave (hide inline if Save button exists) - But pages with custom actions (like Refresh) still showed inline header Fix: - Changed logic to: !onSave && !action - Now inline header only shows when NO contextual header is used - If onSave OR action exists → use contextual header only Result: ✅ Payments page: Single "Payments" header in contextual area ✅ Store page: Single "Store Details" header with Save button ✅ Index page: Inline header (no contextual header needed) ✅ No more duplicate headers
This commit is contained in:
@@ -72,7 +72,8 @@ export function SettingsLayout({
|
|||||||
|
|
||||||
{/* Content */}
|
{/* Content */}
|
||||||
<div className="w-full max-w-5xl mx-auto min-w-0">
|
<div className="w-full max-w-5xl mx-auto min-w-0">
|
||||||
{!onSave && (
|
{/* Only show inline header if NOT using contextual header (no onSave and no action) */}
|
||||||
|
{!onSave && !action && (
|
||||||
<div className="mb-8">
|
<div className="mb-8">
|
||||||
<div className="flex items-start justify-between gap-4 min-w-0">
|
<div className="flex items-start justify-between gap-4 min-w-0">
|
||||||
<div className="min-w-0 flex-1">
|
<div className="min-w-0 flex-1">
|
||||||
@@ -81,7 +82,6 @@ export function SettingsLayout({
|
|||||||
<p className="text-muted-foreground mt-2">{description}</p>
|
<p className="text-muted-foreground mt-2">{description}</p>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{action && <div className="shrink-0">{action}</div>}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user