Skip to content

[Task]: Feature strong troop pull requests on project pages and the homepage #1431

Open

Description

@jeromehardaway

🛠 Description

The projects catalog shipped (#1327, #1420). /projects and /projects/[slug] render 7 records from src/data/projects/*.json: api-list, prework, vets-ai, vets-who-code-app, vscode-extension-pack, vscode-theme and windows-dev-setup-guide. Each record has:

  • contributors from builtBy: a login plus an optional profile or story path
  • shippedAt and status
  • GitHub stats fetched at build, which fall back to null (src/utils/types.ts:188-219, src/lib/project.ts:25-40)

The homepage WorkBelt says “First commit to production. Built by veterans.” and links SEE THE WORK to /projects (src/components/ui/work-belt/index.tsx:20-24, rendered at src/pages/index.tsx:107).

What's missing is the work itself, at the level a hiring manager reads it: the pull request. builtBy lists logins with no per-PR data, so a visitor sees who contributed but not what they shipped or how it was reviewed. Only 3 of the 7 records have a live_url (vets-who-code-app, vscode-extension-pack and vscode-theme).

Lead with troop code. Let each project name a few strong troop PRs, show them on the project page, and put one on the homepage.

✅ Acceptance Criteria

  • VWCProjectDetails gains an optional field for featured PRs: URL, title, author login and a one-line summary of what shipped. There is no parallel data file.
  • /projects/[slug] renders a “Featured pull requests” section when the field is set and nothing when it isn't. This is covered in __tests__/pages/projects-slug.tests.tsx.
  • Each featured PR's author appears in that project's builtBy. A test in __tests__/lib/project.test.ts enforces it.
  • Each featured PR is merged, lives in a public repo, and has at least one review from someone other than its author.
  • The homepage WorkBelt shows one featured PR (title, repo, author) linked to GitHub, and keeps SEE THE WORK → /projects. It fits the belt at phone width with no horizontal scroll.
  • External PR links that open a new tab carry rel="noopener noreferrer", as Biome's noBlankTarget requires.
  • Every project that has a live deployment has live_url set.
  • npm run typecheck, npm run lint, npm test and npm run build pass.
  • The homepage and one project page are rendered and checked in Chrome at desktop and phone widths.

📋 Implementation Notes

  • Extend VWCProjectDetails in src/utils/types.ts:199-219. The loader in src/lib/project.ts passes JSON fields through.
  • Store PR data statically in each project's JSON. Don't fetch PR details at build: the repo stats fetch already falls back to null, and a featured PR shouldn't disappear when GitHub rate-limits.
  • WorkBelt is a one-row .dark-section (headline and link) that stacks into a column below the sm breakpoint (src/components/ui/work-belt/index.tsx:9). Choose the homepage PR in getStaticProps in src/pages/index.tsx:171, for example the most recent featured PR across projects, and pass it to WorkBelt as a prop.
  • When a featured PR has a before/after write-up from show-the-review, link the write-up from the PR entry.
  • A suggested bar for “strong”, taken from the curriculum:
    • “Opens a PR merged without a round of confusion”
    • “Merges a PR after addressing review comments”
    • tests included (portfolio checklist 6-6)
  • The header nav has no spare room. Keep the entry point on the WorkBelt and the footer's existing “Open Source Projects” link.

🙋 Needs from the owner

  • Which PRs to feature for each project, and which one leads the homepage
  • Confirmation that each featured author is a troop or alumnus. builtBy lists GitHub logins and doesn't record who is a troop, so the builtBy test alone can't prove it.
  • Confirmation that each featured troop agrees to be named on the homepage
  • Live URLs for any project that is deployed but has no live_url. api-list, prework, vets-ai and windows-dev-setup-guide have none today.
  • Whether more troop-built repos should join the catalog, which holds 7 records today, before PRs are featured

🔗 Related Issues or PRs

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementepic:marketingPublic marketing and brand surfaceintermediateRequires moderate codebase familiarity; multi-file or design judgment

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions