feat(homepage): grouping apps by role#408
Conversation
📝 WalkthroughWalkthroughReplaces a flat APPS array with grouped APP_GROUPS (title, description, apps). HomePage now renders one section per group and maps each group's apps to AppCard; AppCard computes resolvedHref from production href, optional localHref, and NEXT_PUBLIC_LOCAL_DEV, and card titles are changed to h3. ChangesHomepage app list reorganization
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
@CodeRabbit review |
✅ Action performedReview finished.
|
There was a problem hiding this comment.
Pull request overview
This PR updates the homepage “apps” section to present the F3 Nation ecosystem as role-based groups (instead of a single flat list), improving scanability and helping users find the right tools faster.
Changes:
- Introduced an
AppGroupmodel and replaced the flatAPPSlist with groupedAPP_GROUPS. - Updated the homepage UI to render grouped sections (title + description) and then each group’s apps in a grid.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/homepage/src/app/page.tsx`:
- Around line 19-117: The README still documents the old flat APPS shape; update
the README to describe the new APP_GROUPS structure (symbol: APP_GROUPS) showing
top-level keys title and description and an apps array, and update the example
app entry shape to include app fields name, description, href (optional),
localHref (optional), and linkLabel (optional) instead of the old APPS entries;
remove or note that APPS is deprecated and provide a small example of one group
with an apps array to match the code.
- Around line 208-217: The grouped sections render group titles as <h2> in
page.tsx (APP_GROUPS map), but individual app entries inside AppCard also use
<h2>, breaking heading hierarchy; update the AppCard component to render app
names at one level deeper (use <h3> instead of <h2>) or add a configurable prop
(e.g., headingLevel) so callers in page.tsx can render group titles as h2 and
AppCard titles as h3, ensuring semantic heading order and accessibility.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: 69fc244a-3992-458f-9302-e5ce996b9b1e
📒 Files selected for processing (1)
apps/homepage/src/app/page.tsx
taterhead247
requested review from
BigGillyStyle,
dnishiyama,
evanpetzoldt and
pstaylor-patrick
as code owners
|
Pulled down the branch locally and really like the new grouping. Claude Code had some nitpicky code suggestions that you are free to implement or not. |
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/homepage/README.md (1)
51-51: 🧹 Nitpick | 🔵 Trivial | 💤 Low valueConsider documenting the optional
NEXT_PUBLIC_LOCAL_DEVenvironment variable.The statement "No environment variables are required" is technically correct—the app runs without any env vars. However, setting
NEXT_PUBLIC_LOCAL_DEV=true(seeapps/homepage/.env.local.example) enables local dev mode, redirecting app card links tolocalhostports for in-monorepo navigation. Mentioning this optional enhancement would help developers discover the feature.Suggested addition
Add after line 51:
To enable local development links (redirect app cards to localhost ports instead of production URLs), copy `.env.local.example` to `.env.local`: ```bash cp .env.local.example .env.localSet
NEXT_PUBLIC_LOCAL_DEV=trueto activate local hrefs.</details> <details> <summary>🤖 Prompt for AI Agents</summary>Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.In
@apps/homepage/README.mdat line 51, Update the README statement in the
homepage docs to mention the optional local dev switch alongside the existing
“no environment variables are required” note. In the README section around the
app setup guidance, add a brief note that copying.env.local.exampleto
.env.localand settingNEXT_PUBLIC_LOCAL_DEV=trueenables local links for
app cards. Keep the explanation tied to the homepage app’s local navigation
behavior and reference theNEXT_PUBLIC_LOCAL_DEVsetting so developers can
find the feature easily.</details> <!-- cr-comment:v1:70a7dfcb4b19c3e19a77342d --> </blockquote></details> </blockquote></details>🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. Inline comments: In `@apps/homepage/src/app/page.tsx`: - Around line 27-28: The JSDoc above the apps property contradicts its type: change the comment to reflect that apps: [App, ...App[]] enforces at least one app (so an empty group is impossible). Update the JSDoc for the apps field (the comment referencing an empty group rendering a heading with no cards) to state that at least one app is required or remove the empty-group wording so it matches the apps: [App, ...App[]] declaration. --- Outside diff comments: In `@apps/homepage/README.md`: - Line 51: Update the README statement in the homepage docs to mention the optional local dev switch alongside the existing “no environment variables are required” note. In the README section around the app setup guidance, add a brief note that copying `.env.local.example` to `.env.local` and setting `NEXT_PUBLIC_LOCAL_DEV=true` enables local links for app cards. Keep the explanation tied to the homepage app’s local navigation behavior and reference the `NEXT_PUBLIC_LOCAL_DEV` setting so developers can find the feature easily.🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID:
8e67b200-dc27-4f7f-9117-626ae777ecac📒 Files selected for processing (2)
apps/homepage/README.mdapps/homepage/src/app/page.tsx
github-project-automation
Bot
moved this from Draft
to Merged
in F3 Nation Tech (Pull Requests)
This pull request restructures how apps are displayed on the homepage by grouping them into themed categories for improved organization and clarity. Instead of a single flat list, apps are now organized into groups such as "Everyday Use," "Region Admins," and "Developers," each with its own title and description. The rendering logic is updated to display these groups and their respective apps.
Homepage App Organization:
AppGroupinterface and replaced the flatAPPSarray with a groupedAPP_GROUPSarray, categorizing apps into themed sections.APP_GROUPS, displaying each group with its title, description, and the corresponding apps in a grid layout.App Reassignment and Grouping:
Summary by CodeRabbit