Skip to content

feat: add interactive contributor wall to onboarding and settings#218

Open
RONAK-AI647 wants to merge 5 commits into
Whisper-AI-App:mainfrom
RONAK-AI647:RONAK-AI647/Feature---Show-our-Contributors-during-on-boarding-and-in-settings-#127
Open

feat: add interactive contributor wall to onboarding and settings#218
RONAK-AI647 wants to merge 5 commits into
Whisper-AI-App:mainfrom
RONAK-AI647:RONAK-AI647/Feature---Show-our-Contributors-during-on-boarding-and-in-settings-#127

Conversation

@RONAK-AI647

Copy link
Copy Markdown
Contributor

Description

Closes #127.

This PR introduces a native, interactive "Meet the Contributors" wall to both the Onboarding flow and the Settings screen, highlighting the community behind the app. It dynamically fetches live contributor data from the GitHub API while allowing for manual overrides (e.g., for marketing or design contributors).

Changes Made

  • UI Components: Created <ContributorsList /> with two display variants (onboarding for a 4-column grid, and settings for a compact horizontal/vertical view).
  • Settings Integration: Injected the component into app/settings.tsx, matching the existing design system and typography (<Text variant="label">).
  • Onboarding Integration: Added a new step to onboarding-steps.tsx to display the contributor grid during initial app setup.
  • Build Scripts: Added scripts/generate-contributors.js to fetch GitHub API data and merge/deduplicate it against a new manual-contributors.json file.
  • Package.json Hooks: Added prestart and generate-contributors scripts to ensure the JSON asset is strictly generated before the Metro bundler starts.

Notes for Reviewers

Due to severe WSL 2 / Hyper-V network isolation issues on my local machine, I was unable to tunnel the Metro bundler to my physical mobile device to preview the final rendered UI. I have strictly verified the TypeScript types, component structure, and Biome linter locally, but please let me know if any padding, margin, or layout tweaks are needed once you pull it down and run it natively!

Checklist

  • Code follows project formatting and linter guidelines.
  • Component gracefully handles missing data/network states.
  • Build scripts execute without breaking existing commands.

@RONAK-AI647 RONAK-AI647 marked this pull request as draft June 26, 2026 04:31
@RONAK-AI647 RONAK-AI647 force-pushed the RONAK-AI647/Feature---Show-our-Contributors-during-on-boarding-and-in-settings-#127 branch from 23587d3 to cb67f81 Compare June 26, 2026 04:33
@RONAK-AI647 RONAK-AI647 marked this pull request as ready for review June 26, 2026 04:33
Comment thread package.json Outdated
"scripts": {
"start": "expo start",
"reset-project": "node ./scripts/reset-project.js",
"prestart": "node scripts/generate-contributors.js",

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Keep as just one script entry (remove prestart)

@mrspence mrspence left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@RONAK-AI647 it's looking good - when I'm in the office shortly I'll test run it on an emulator, for now just one simple edit needed:

  • Have one package script only (remove prestart)

@RONAK-AI647

Copy link
Copy Markdown
Contributor Author

@mrspence thank you for review, let me know if everything works well !!!

@mrspence

mrspence commented Jun 29, 2026

Copy link
Copy Markdown
Member

@RONAK-AI647 just checked for you! We're close;

  • Must add yourself to the list
  • overlap/overflow issues with the top of text:
image

Notice you're unable to tunnel to your physical phone... how about using either the android or iOS emulator?

Happy to help if you need a hand setting up!

@RONAK-AI647

RONAK-AI647 commented Jun 30, 2026

Copy link
Copy Markdown
Contributor Author

Hey @mrspence! Thanks for pointing it out !!

Sorry for the delayed response, this week was absolutely chaotic on my end .

I tried most of the development steps ,the Android emulator was genuinely the last thing on my list, thankfully it worked .
Screenshot 2026-07-01 024510

Now coming to the actual updates based on your review comments:

image
  1. Fixed the padding/overflow - the contributor avatars no longer overlap with the text above them
  2. Added myself to the contributor list
  3. Avatars are tappable -each one opens the contributor's GitHub profile
  4. Ordering is now meaningful - code contributors appear first, sorted by commit count (GitHub API handles this naturally), followed by manual contributors at the end

Let me know if there's anything else you'd like changed !!!

@mrspence

Copy link
Copy Markdown
Member

@RONAK-AI647 Fantastic and well done - know the difficulty of balancing across remits so appreciate you putting this together so fast really!

I'll test this for you tomorrow asap - expecting an open window primed for reviewing this; imagine we're good to be fair 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Feature - Show our Contributors during on-boarding and in settings

2 participants