Skip to content

🌱 refactor: adopt PageShell across ladder/leaderboard/partners + fix shell DOM - #7108

Merged
hivecommons-hive[bot] merged 1 commit into
mainfrom
arch/page-shell-port-7106
Sep 27, 2026
Merged

hivecommons-hive[bot] merged 1 commit into
mainfrom
arch/page-shell-port-7106

Conversation

@hivecommons-hive

Copy link
Copy Markdown
Contributor

Refactor

Two things in one PR because they must land together:

  1. Fix PageShell DOM shape. The shell shipped in refactor: introduce PageShell for the shared page scaffold (#7106) [architect] #7107 used
    absolute -z-10 with no opaque base — subtly different from the
    canonical scaffold every existing page uses:

    <div className="bg-[#0a0a0a] text-white overflow-x-hidden min-h-screen">
      <Navbar />
      <div className="fixed inset-0 z-0">
        <div className="absolute inset-0 bg-[#0a0a0a]" />
        <StarField density="medium" showComets cometCount={3} />
        <GridLines horizontalLines={21} verticalLines={18} />
      </div>
      <div className="relative z-10 pt-7">{children}</div>
      <Footer />
    </div>

    Since nothing had adopted the shell yet, this PR corrects it before
    the first callers land. New knobs: baseLayerClassName (pass false
    to omit), contentClassName (pass null to omit — for pages with
    their own content wrappers).

  2. Adopt PageShell in the 4 pages that share the exact default
    scaffold + content wrapper (relative z-10 pt-7):

    • src/app/[locale]/ladder/page.tsx
    • src/app/[locale]/leaderboard/page.tsx
    • src/app/[locale]/leaderboard/[username]/page.tsx
    • src/app/[locale]/partners/page.tsx

    Net: −127 / +187 (of which +115 is the shell interface fix +
    expanded tests).

Validation

  • npx tsc --noEmit clean on all four ported pages
  • npx vitest run src/__tests__/PageShell.test.tsx → 13/13 pass
  • Two pre-existing ESLint jsx-a11y warnings inside the ported pages
    are unrelated (untouched interactive elements)

Not in this PR

3 canonical pages have custom content wrappers and get a follow-up:

  • src/app/[locale]/products/page.tsx — "relative z-10 text-center px-2 sm:px-4 pt-16 sm:pt-20 pb-2"
  • src/app/[locale]/programs/page.tsx — "relative z-10 text-center px-4 pt-20 pb-2"
  • src/app/[locale]/programs/[slug]/ProgramPageClient.tsx — variant outer + custom wrapper

Plus the coming-soon-*-page.tsx files listed in #7106.

Refs #7106 (partial: 3 variant-wrapper pages + coming-soon-* remain)


Filed by architect agent (ACMM L6 — full mode)

— hive: agent=architect backend=copilot model=claude-opus-4.7 copilot=1.0.88

…ers + fix shell DOM

The PageShell shipped in #7107 had a subtly wrong background layer
(absolute -z-10 with no opaque base) that did not match the canonical
DOM used by every page in src/app/[locale]/*/page.tsx. Since no page
had adopted it yet, this commit fixes the interface before any callers
depend on it, and then ports the four pages that use the exact default
content wrapper ("relative z-10 pt-7") to it:

  - src/app/[locale]/ladder/page.tsx
  - src/app/[locale]/leaderboard/page.tsx
  - src/app/[locale]/leaderboard/[username]/page.tsx
  - src/app/[locale]/partners/page.tsx

PageShell now renders exactly:
  <div outer>
    <Navbar/>
    <div className="fixed inset-0 z-0">
      <div className="absolute inset-0 bg-[#0a0a0a]"/>
      <StarField/>
      <GridLines/>
    </div>
    <div className="relative z-10 pt-7">{children}</div>
    <Footer/>
  </div>

New knobs: baseLayerClassName (pass false to omit); contentClassName
(pass null to omit wrapper — for pages with custom content wrappers).

Vitest: 13/13 pass. tsc --noEmit clean on all four ported pages.

Refs #7106 (partial: 3 canonical pages [products, programs,
programs/[slug]/ProgramPageClient] with custom content wrappers +
coming-soon-*-page.tsx variants remain)

Signed-off-by: kubestellar-hive[bot] <223556219+Copilot@users.noreply.github.com>
@kubestellar-prow kubestellar-prow Bot added the dco-signoff: yes Indicates the PR's author has signed the DCO. label Sep 27, 2026
@kubestellar-prow

Copy link
Copy Markdown

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:
Once this PR has been reviewed and has the lgtm label, please assign clubanderson for approval. For more information see the Code Review Process.

The full list of commands accepted by this bot can be found here.

Details Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@kubestellar-prow kubestellar-prow Bot added the size/L Denotes a PR that changes 100-499 lines, ignoring generated files. label Sep 27, 2026
@netlify

netlify Bot commented Sep 27, 2026 •

Copy link
Copy Markdown

✅ Deploy Preview for kubestellar-docs ready!

Name Link
🔨 Latest commit 5267322
🔍 Latest deploy log https://app.netlify.com/projects/kubestellar-docs/deploys/6ab913cdb81e210008d78aeb
😎 Deploy Preview https://deploy-preview-7108--kubestellar-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@kubestellar-prow kubestellar-prow Bot added the needs-ok-to-test Indicates a PR that requires an org member to verify it is safe to test. label Sep 27, 2026
@kubestellar-prow

Copy link
Copy Markdown

Hi @hivecommons-hive[bot]. Thanks for your PR.

I'm waiting for a kubestellar member to verify that this patch is reasonable to test. If it is, they should reply with /ok-to-test on its own line. Until that is done, I will not automatically test new commits in this PR, but the usual testing commands by org members will still work. Regular contributors should join the org to skip this step.

Once the patch is verified, the new status will be reflected by the ok-to-test label.

I understand the commands that are listed here.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository.

@hivecommons-hive
hivecommons-hive Bot merged commit d13ae18 into main Sep 27, 2026
16 of 18 checks passed
@kubestellar-prow
kubestellar-prow Bot deleted the arch/page-shell-port-7106 branch September 27, 2026 13:02
@github-actions

Copy link
Copy Markdown
Contributor

Thank you for your contribution! Your PR has been merged.

Check out what's new:

Stay connected: Slack #kubestellar-dev | Multi-Cluster Survey

hivecommons-hive Bot added a commit that referenced this pull request Sep 27, 2026
Ports src/app/[locale]/products/page.tsx and src/app/[locale]/programs/page.tsx
to the shared PageShell component (introduced in #7107, extended in #7108).
Both pages restated the exact canonical scaffold — outer div with
bg-[#0a0a0a] text-white overflow-x-hidden min-h-screen, Navbar, fixed
background wrapper with opaque base + StarField density=medium
showComets={true} cometCount={3} + GridLines 21/18, then Footer — so this
is a pure DOM-preserving swap.

Both pages own their hero <section className="relative … z-10">, so the
port uses <PageShell contentClassName={null}> and lets the page's existing
inner content sit directly under the background layer, matching the pattern
docstring for products/programs called out in PageShell.tsx.

Refs #7106 (14 page.tsx files remain; each subsequent port lands as its
own PR — acmm-leaderboard is deferred because it uses non-canonical
GridLines 20/20 with strokeColor override and bg-[#0a0a0f], which the
issue calls out as drift that a mechanical port would silently normalise)

---
Filed by architect agent (ACMM L6 — full mode)

Signed-off-by: kubestellar-hive[bot] <223556219+Copilot@users.noreply.github.com>
Co-authored-by: kubestellar-hive[bot] <223556219+Copilot@users.noreply.github.com>
hivecommons-hive Bot added a commit that referenced this pull request Sep 28, 2026
…s/[slug] (#7113)

Continues the #7106 port sequence started by #7107 (PageShell interface)
and continued by #7108 and #7110 (five canonical pages). This slice ports
the two remaining scaffold-owning pages in the drift matrix.

- `acmm-leaderboard/page.tsx` — the "20/20 medium + strokeColor variant"
  row of the drift matrix. Ported via `<PageShell>` with a typed
  `background` prop that carries the four variant values (grid 20/20,
  strokeColor "rgba(255,255,255,0.03)", stars density "medium", plus
  the `pointer-events-none` wrapper class and `baseLayerClassName: false`
  to match the current DOM). The one-off `strokeColor` override that
  #7106 flagged as pre-#7107 tech debt now lives in the shell props
  where the drift matrix can grep it, not buried in JSX.
- `programs/[slug]/ProgramPageClient.tsx` — the "21/18 + medium + comets 3"
  canonical row. Ported to `<PageShell>` with the default background;
  the `<main className="relative min-h-screen">` wrapper stays inside
  `children` under `contentClassName={null}`, mirroring how PR #7110
  handled `programs/page.tsx` and `products/page.tsx`.

No visual/behaviour change intended: outer div classes, background
wrapper classes, and widget prop values are preserved exactly per the
#7106 drift matrix.

Verification
- `npx tsc --noEmit` — clean
- `npx eslint <changed>` — clean
- `npx vitest run` — 140 files / 1588 tests pass (PageShell suite: 13/13,
  acmmLeaderboardComponents: 16/16 unchanged)

Refs #7106 (three variant pages remain: marketplace, quick-installation,
contribute-handbook, plus the bare coming-soon* pair — each is a distinct
variant class per the drift matrix and will land as its own slice)

Signed-off-by: kubestellar-hive[bot] <223556219+Copilot@users.noreply.github.com>
Co-authored-by: kubestellar-hive[bot] <223556219+Copilot@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

copilot dco-signoff: yes Indicates the PR's author has signed the DCO. frontend needs-ok-to-test Indicates a PR that requires an org member to verify it is safe to test. pages size/L Denotes a PR that changes 100-499 lines, ignoring generated files. typescript

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant