Implement Sign-Up Prompt for Anonymous Users to Drive Registration

[Copilot]

Implements a comprehensive sign-up prompt system to encourage anonymous users to register after 3-5 interactions, addressing the need to convert Reddit users into a monetizable base with email capture and personalized upsell opportunities.

Key Features Implemented

🎯 Smart Triggering System

• Shows prompt only for anonymous users after 4 interactions (within 3-5 range)
• Tracks both dose calculations and log save attempts as interactions
• Respects 24-hour dismissal timeout to avoid user annoyance
• Uses AsyncStorage for persistent tracking across sessions

🎨 Clean, Non-Intrusive Design

• Bottom sheet overlay with smooth slide-in/out animations
• "Sign Up Free" button with email icon in pill-shaped design
• "Maybe Later" dismissal option
• Follows SafeDose's clean aesthetic (muted gray, 13px text)

🔐 Complete Sign-Up Flow

• New dedicated signup page at app/(auth)/signup.tsx
• Email/password registration with validation
• Google OAuth integration
• Seamless anonymous account linking

📊 Comprehensive Analytics

• Tracks prompt impressions, clicks, and dismissals
• Source attribution for conversion tracking
• Integration with existing analytics infrastructure

Technical Implementation

// Interaction tracking happens automatically
const signUpPrompt = useSignUpPrompt();
const doseCalculator = useDoseCalculator({ 
  trackInteraction: signUpPrompt.trackInteraction 
});

// Prompt appears when conditions are met
<SignUpPrompt
  visible={signUpPrompt.shouldShowPrompt}
  onSignUp={signUpPrompt.handlePromptClick}
  onDismiss={signUpPrompt.dismissPrompt}
  onShow={signUpPrompt.markPromptShown}
/>

Changes Made

New Files

• app/(auth)/signup.tsx - Dedicated sign-up page with email and Google OAuth
• components/SignUpPromptIntegration.test.tsx - Integration tests
• components/SignUpPromptE2E.test.ts - End-to-end flow validation

Modified Files

• components/SignUpPrompt.tsx - Updated navigation to use new signup page (1 line change)

Existing Infrastructure Leveraged

• lib/hooks/useSignUpPrompt.ts - Already implemented interaction tracking
• components/SignUpPrompt.tsx - Already implemented UI component
• lib/analytics.ts - Already defined required events
• Integration in app/(tabs)/new-dose.tsx - Already connected

Test Coverage

• ✅ 16 tests passing across 4 test suites
• ✅ Full interaction tracking validation
• ✅ Analytics event verification
• ✅ 24-hour dismissal timeout testing
• ✅ Anonymous vs authenticated user handling
• ✅ Edge case and boundary validation

User Experience Flow

1. Anonymous user performs dose calculations/log attempts
2. After 4th interaction, elegant bottom sheet appears
3. User can sign up immediately or dismiss for 24 hours
4. Sign-up redirects to dedicated page with multiple options
5. Seamless account linking preserves existing data

This implementation provides a conversion-optimized path for Reddit users while maintaining SafeDose's excellent user experience.

Fixes #305.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
safe-dose	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 11, 2025 3:24am

[vercel]

Deployment failed with the following error:

Resource is limited - try again in 2 hours (more than 100, code: "api-deployments-free-per-day").