Contacts

Overview

The Contacts page facilitates friend connections and displays competitive leaderboards comparing performance with connected players.

Core Features

Friends Leaderboard

Four Leaderboard Cards:

1. Most Makes: All-time total makes leaderboard

2. Best Streak: Longest consecutive make streak

3. Makes/Min: Makes Per Minute leader board

4. Fastest 21: Fastest time to 21 consecutive makes

Display:

• Rank positioning

• Player names

• Metric values

• Your position highlighted (if ranked)

Your Friends Section

Friends List:

• Current connections

• Friend status display

• Profile links

• Activity indicators

Empty State:

• 👥 Icon

• "No friends added yet" message

• Call-to-action to use search feature

• Import contacts button

Friend Requests:

• Pending incoming requests

• Accept/Decline actions

• Request timestamp

• Requester profile preview

Find Friends

Search Functionality:

• Privacy-Focused Search:

  • Search by email (complete email required)

  • Search by phone number

  • Search by username/display name

• Privacy Protection:

  • Only usernames shown publicly

  • Email/phone results hidden unless exact match

  • 🔒 Privacy icon with explanation

Search Interface:

• Text input field

• Search button

• Enter key support

• Real-time validation

Import Contacts

Multi-Platform Support:

1. iPhone/iPad Contacts:

• iCloud integration guide

• vCard export instructions

• Focus on 5 close friends recommendation

• Step-by-step instructions

• Quality over quantity messaging

2. Android Contacts:

• Google Contacts integration

• CSV export process

• 5-friend maximum guidance

• Platform-specific steps

3. Gmail Contacts:

• Direct link to contacts.google.com

• Manual lookup workflow

• Friend selection tips

• One-by-one search process

4. Outlook Contacts:

• Outlook.live.com integration

• People/contacts section guide

• Friend identification process

• Manual email/phone notation

Import Modal Features:

• Platform selection

• Detailed step-by-step guides

• External links to contact platforms

• Copy app link button

• Responsible usage messaging

Key Insights

Leaderboard API Integration

apiGetLeaderboard({
  metric: 'total_makes' | 'best_streak' | 'makes_per_minute' | 'fastest_21_makes_seconds',
  context_type: 'friends',
  player_id: currentPlayerId
});

Promise.allSettled Pattern

• Parallel leaderboard fetches

• Graceful partial failure handling

• Default empty arrays

• No blocking on single failures

Privacy Philosophy

• 5-Contact Recommendation: Quality over quantity

• Existing Player Focus: Find players already on platform

• No Mass Invitations: Prevents spam

• Selective Sharing: Manual app link sharing

• Targeted Connections: Encourages meaningful connections

Import Contact Workflow

1. User clicks "Find Friends on Platform"

2. Modal displays platform options

3. User selects their platform (iOS, Android, Gmail, Outlook)

4. Follows platform-specific export steps

5. Obtains up to 5 email addresses

6. Manually searches in Find Friends section

7. Connects with existing players

8. Optionally invites non-players

State Management

• searchTerm: Search input state

• friendsLeaderboardData: Four leaderboard datasets

• useEffect for data fetching on mount

• Context-based notifications

User Experience

• Empty states with clear guidance

• Educational modals

• External link warnings

• Step-by-step instructions

• Responsible usage messaging

• Icon-based visual communication

Future Enhancements

• Friend search is marked as "coming soon"

• Import contacts is informational only

• Prepared for future friend system features

• Educational foundation for future functionality

---