refactor(shell): channel page is a PageShell config, not a 2nd scroller

The channel page rendered its own PageScroller as a separate App branch —
the source of the app's two <main>s. Make it a headerless/rail-less
PageShell config (its banner scrolls from the top) so there is exactly
ONE page scroller. Verified: single <main>, banner scrolls, in-page and
browser Back both return to the feed; E2E 11/11.
This commit is contained in:
2026-07-18 03:19:34 +02:00
parent dc6e62e822
commit d81f10b1cf
2 changed files with 6 additions and 3 deletions
+2
View File
@@ -689,6 +689,7 @@ export default function App() {
)}
<div className="relative flex-1 min-w-0 flex flex-col">
{channelView ? (
<PageShell>
<Suspense fallback={pageFallback}>
<ChannelPage
key={channelView.id}
@@ -714,6 +715,7 @@ export default function App() {
}}
/>
</Suspense>
</PageShell>
) : (
<PageShell
header={
+4 -3
View File
@@ -5,7 +5,6 @@ import { useNavigationActions } from "./NavigationProvider";
import { ArrowLeft, Ban, Check, ExternalLink, Loader2, Plus, RefreshCw, SlidersHorizontal } from "lucide-react";
import Avatar from "./Avatar";
import Feed from "./Feed";
import PageScroller from "./PageScroller";
import { useConfirm } from "./ConfirmProvider";
import { notify } from "../lib/notifications";
import { notifyYouTubeActionError } from "../lib/youtubeErrors";
@@ -206,8 +205,10 @@ export default function ChannelPage({
? "pb-2 text-sm font-medium border-b-2 border-fg text-fg"
: "pb-2 text-sm text-muted hover:text-fg border-b-2 border-transparent";
// The channel page owns no scroller of its own: it's a PageShell config (no shared header, no
// rail, its banner scrolls from the top) so there's ONE page scroller in the app, not two.
return (
<PageScroller>
<>
{/* Banner + back — OPTION C: inset, rounded card (not full-bleed) */}
<div className="relative px-4 sm:px-6 pt-3">
{ch?.banner_url && bannerAttempt <= MAX_BANNER_RETRIES ? (
@@ -466,6 +467,6 @@ export default function ChannelPage({
)}
</div>
)}
</PageScroller>
</>
);
}