DS-031: Build AppShell and PageHeader primitives

[IbrahimIjai]

Complexity: High
Primary files: packages/ui/src/components/app-shell.tsx, packages/ui/src/components/page-header.tsx

Create reusable global chrome and page header slots for title, breadcrumbs,
tabs, metadata, and actions with stable alignment across product routes.

Acceptance criteria

• Supports full-width trading and constrained content layouts.
• Header actions remain reachable on mobile.
• Slots do not impose route-specific content.
• Demo/tests cover both layout modes.

[egwujiohaifesinachiperpetual-max]

@egwujiohaifesinachiperpetual-max has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hello boss, Please assign this issue to me. i checked it out and im confident i will solve it
my eta is 4 hours

ℹ️ Repo Maintainers: To accept this application, review their application or assign @egwujiohaifesinachiperpetual-max to this issue.

[JSE19]

@JSE19 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hi Maintainer, I would love to resolve this issue, kindly assign

ℹ️ Repo Maintainers: To accept this application, review their application or assign @JSE19 to this issue.

[drips-wave]

Congratulations, @JSE19! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on July 30, 2026.

🧑‍💻 @JSE19: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊