vibefast-cli 1.2.1 → 1.3.1

package/docs/archive/SIMPLIFIED-PLAN.md

@@ -1,578 +0,0 @@
-# 🎯 Simplified Implementation Plan
-
-## The Two Questions
-
-### Question 1: Auto-install vs Manual Install?
-
-**Auto-install is the HARD part. Finding packages is EASY.**
-
-#### Easy Part: Show Required Packages ✅
-```typescript
-// recipe.json (created by YOU when making the feature)
-{
-  "name": "charts",
-  "dependencies": {
-    "npm": {
-      "react-native-chart-kit": "^6.12.0",
-      "react-native-svg": "^13.9.0"
-    }
-  }
-}
-
-// CLI just reads this and shows it:
-log.info('📦 This feature requires:');
-log.plain('  • react-native-chart-kit@^6.12.0');
-log.plain('  • react-native-svg@^13.9.0');
-log.plain('');
-log.info('Install with:');
-log.plain('  pnpm add react-native-chart-kit@^6.12.0 react-native-svg@^13.9.0');
-```
-
-**Difficulty: TRIVIAL** - Just read JSON and display it
-
-#### Hard Part: Auto-install 🔴
-```typescript
-// CLI tries to install automatically:
-await executeBash('pnpm add react-native-chart-kit@^6.12.0');
-
-// Problems:
-// 1. Which package manager? (pnpm/yarn/npm/bun)
-// 2. Monorepo workspace? (need --filter flag)
-// 3. Which directory to run in? (root vs workspace)
-// 4. What if it fails? (network, permissions, conflicts)
-// 5. Version conflicts? (breaks existing code)
-```
-
-**Difficulty: HARD** - Many edge cases
-
----
-
-## Recommendation: Start Simple
-
-### Phase 1: Manual Install (Ship This First) ✅
-
-```bash
-$ vf add charts
-
-✓ charts installed successfully!
-ℹ Files added: 17
-
-📦 This feature requires the following packages:
-  • react-native-chart-kit@^6.12.0
-  • react-native-svg@^13.9.0
-
-📋 Install them with:
-  pnpm add react-native-chart-kit@^6.12.0 react-native-svg@^13.9.0
-
-⚠️ Don't forget to install these packages before running your app!
-```
-
-**Advantages:**
-- ✅ Simple to implement (1 day)
-- ✅ No edge cases
-- ✅ Works for everyone
-- ✅ User has control
-- ✅ No risk of breaking things
-
-**Disadvantages:**
-- ❌ User has to run extra command
-- ❌ Less convenient
-
-### Phase 2: Auto-install (Add Later) 🔄
-
-```bash
-$ vf add charts
-
-✓ charts installed successfully!
-ℹ Files added: 17
-
-📦 This feature requires the following packages:
-  • react-native-chart-kit@^6.12.0
-  • react-native-svg@^13.9.0
-
-Install packages now? (Y/n): y
-
-📦 Installing packages...
-✓ Packages installed successfully!
-```
-
-**Add this AFTER you've tested with real users and know the edge cases.**
-
----
-
-## Question 2: What Else Can Be Added/Removed with CLI?
-
-### Things That Work Well with CLI ✅
-
-#### 1. UI Components (Perfect for CLI)
-```bash
-$ vf add charts
-$ vf add forms
-$ vf add cards
-$ vf add modals
-$ vf add bottom-sheets
-$ vf add image-gallery
-$ vf add calendar
-$ vf add data-tables
-```
-
-**Why it works:**
-- Self-contained code
-- No external services
-- No API keys needed
-- Just copy files + install packages
-
-#### 2. Utility Features (Good for CLI)
-```bash
-$ vf add qr-scanner
-$ vf add image-picker
-$ vf add pdf-viewer
-$ vf add audio-player
-$ vf add video-player
-$ vf add maps
-$ vf add camera
-```
-
-**Why it works:**
-- Mostly self-contained
-- Minimal configuration
-- Standard packages
-
-#### 3. Standalone Screens (Good for CLI)
-```bash
-$ vf add profile-screen
-$ vf add settings-screen
-$ vf add about-screen
-$ vf add help-screen
-$ vf add onboarding
-$ vf add splash-screen
-```
-
-**Why it works:**
-- Complete screens
-- Drop-in ready
-- Minimal customization needed
-
----
-
-### Things That Need Manual Steps ⚠️
-
-#### 4. Service Integrations (CLI + Manual)
-
-**Sentry (Error Tracking)**
-```bash
-$ vf add sentry
-
-✓ sentry installed successfully!
-ℹ Files added: 5
-
-📦 Packages installed:
-  ✓ @sentry/react-native@^5.15.0
-
-⚠️ MANUAL STEPS REQUIRED:
-
-┌─────────────────────────────────────────────────────────────┐
-│ Step 1: Create Sentry Project                               │
-│                                                             │
-│ 1. Go to https://sentry.io/signup/                         │
-│ 2. Create a new React Native project                       │
-│ 3. Copy your DSN                                            │
-└─────────────────────────────────────────────────────────────┘
-
-┌─────────────────────────────────────────────────────────────┐
-│ Step 2: Add DSN to .env                                     │
-│                                                             │
-│ Add this line to your .env file:                           │
-│ SENTRY_DSN=your-dsn-here                                    │
-└─────────────────────────────────────────────────────────────┘
-
-💡 Run 'vf checklist sentry' to see these steps again
-```
-
-**PostHog (Analytics)**
-```bash
-$ vf add posthog
-
-✓ posthog installed successfully!
-
-⚠️ MANUAL STEPS:
-  1. Sign up at posthog.com
-  2. Get your API key
-  3. Add to .env: POSTHOG_API_KEY=your-key
-```
-
-**RevenueCat (In-App Purchases)**
-```bash
-$ vf add revenuecat
-
-✓ revenuecat installed successfully!
-
-⚠️ MANUAL STEPS:
-  1. Create RevenueCat account
-  2. Configure products
-  3. Add API keys to .env
-  4. Configure app.json
-```
-
-**Supabase (Backend)**
-```bash
-$ vf add supabase
-
-✓ supabase installed successfully!
-
-⚠️ MANUAL STEPS:
-  1. Create Supabase project
-  2. Get URL and anon key
-  3. Add to .env:
-     SUPABASE_URL=your-url
-     SUPABASE_ANON_KEY=your-key
-```
-
-**Firebase**
-```bash
-$ vf add firebase
-
-✓ firebase installed successfully!
-
-⚠️ MANUAL STEPS:
-  1. Create Firebase project
-  2. Download google-services.json
-  3. Place in android/app/
-  4. Download GoogleService-Info.plist
-  5. Place in ios/
-```
-
----
-
-### Things That Should NOT Be CLI-Managed ❌
-
-#### 5. Complex Systems (Too Complex)
-
-**Authentication System**
-- Too many variations (email, social, phone, magic link)
-- Requires backend setup
-- User-specific flows
-- Security considerations
-
-**Better approach:** Provide documentation/guide
-
-**Payment Processing**
-- Requires merchant accounts
-- Legal compliance varies by country
-- Too many providers (Stripe, PayPal, etc.)
-- Complex integration
-
-**Better approach:** Provide integration guides
-
-**Custom Business Logic**
-- Every app is different
-- Can't be templated
-- Requires understanding of business rules
-
-**Better approach:** Provide examples/patterns
-
----
-
-## Complete Feature List for CLI
-
-### Tier 1: Fully Automated (No Manual Steps) ✅
-
-```bash
-# UI Components
-vf add charts
-vf add forms
-vf add cards
-vf add modals
-vf add bottom-sheets
-vf add tabs
-vf add accordions
-vf add carousels
-vf add progress-bars
-vf add skeletons
-vf add badges
-vf add avatars
-
-# Utilities
-vf add qr-scanner
-vf add barcode-scanner
-vf add image-picker
-vf add camera
-vf add pdf-viewer
-vf add audio-player
-vf add video-player
-vf add file-picker
-vf add share
-vf add clipboard
-
-# Screens
-vf add profile-screen
-vf add settings-screen
-vf add about-screen
-vf add help-screen
-vf add faq-screen
-vf add contact-screen
-vf add feedback-screen
-
-# Navigation
-vf add drawer-navigation
-vf add tab-navigation
-vf add stack-navigation
-
-# Animations
-vf add loading-animations
-vf add page-transitions
-vf add micro-interactions
-```
-
-### Tier 2: Partial Automation (Manual Steps Required) ⚠️
-
-```bash
-# Analytics & Monitoring
-vf add sentry          # Need: DSN
-vf add posthog         # Need: API key
-vf add mixpanel        # Need: Token
-vf add amplitude       # Need: API key
-vf add firebase-analytics  # Need: config files
-
-# Backend Services
-vf add supabase        # Need: URL + anon key
-vf add firebase        # Need: config files
-vf add appwrite        # Need: endpoint + project ID
-
-# Payments
-vf add revenuecat      # Need: API keys + product config
-vf add stripe          # Need: publishable key
-
-# Push Notifications
-vf add expo-notifications  # Need: credentials
-vf add firebase-messaging  # Need: config
-
-# Maps
-vf add google-maps     # Need: API key
-vf add mapbox          # Need: access token
-
-# Social
-vf add facebook-login  # Need: app ID
-vf add google-login    # Need: client ID
-vf add apple-login     # Need: service ID
-```
-
-### Tier 3: Documentation Only (Too Complex) ❌
-
-```
-# These get guides/docs, not CLI commands
-- Authentication system
-- Payment processing
-- Custom backend
-- State management setup
-- Testing setup
-- CI/CD pipeline
-```
-
----
-
-## Implementation Priority
-
-### Week 1: Core Improvements (Must Have) 🔴
-
-1. **Interactive confirmation for overwrites**
-   ```bash
-   $ vf add charts --force
-   ⚠️ 3 files will be overwritten. Continue? (y/N):
-   ```
-
-2. **Show required packages (manual install)**
-   ```bash
-   📦 This feature requires:
-     • package-name@version
-   
-   Install with:
-     pnpm add package-name@version
-   ```
-
-3. **Modification detection**
-   ```bash
-   $ vf remove charts
-   ⚠️ 2 files were modified by you. Continue? (y/N):
-   ```
-
-### Week 2: Enhanced UX (Should Have) 🟡
-
-4. **Manual steps display**
-   ```bash
-   ⚠️ MANUAL STEPS REQUIRED:
-   Step 1: Get API key from service.com
-   Step 2: Add to .env file
-   ```
-
-5. **Status command**
-   ```bash
-   $ vf status
-   Installed features:
-   ✓ charts (v1.0.0)
-   ⚠️ sentry (v1.2.0) - Manual steps pending
-   ```
-
-6. **Checklist command**
-   ```bash
-   $ vf checklist sentry
-   Manual setup steps for sentry:
-   [ ] Step 1: Create account
-   [ ] Step 2: Add DSN to .env
-   ```
-
-### Week 3: Advanced Features (Nice to Have) 🟢
-
-7. **Auto-install packages** (with good error handling)
-8. **Type checking** (with timeout)
-9. **Update command**
-   ```bash
-   $ vf update charts
-   ```
-
----
-
-## Recipe.json Format (Final)
-
-```json
-{
-  "name": "charts",
-  "version": "1.0.0",
-  "description": "Beautiful data visualization",
-  "target": "native",
-  
-  "copy": [
-    {
-      "from": "apps/native/src/app/charts",
-      "to": "apps/native/src/app/(root)/(protected)/charts"
-    },
-    {
-      "from": "apps/native/src/features/charts",
-      "to": "apps/native/src/features/charts"
-    }
-  ],
-  
-  "nav": {
-    "href": "/(root)/(protected)/charts",
-    "label": "Charts",
-    "icon": "📊",
-    "color": "#6366F1"
-  },
-  
-  "dependencies": {
-    "npm": {
-      "react-native-chart-kit": "^6.12.0",
-      "react-native-svg": "^13.9.0"
-    }
-  },
-  
-  "postInstall": {
-    "message": "Charts installed! Check the /charts route to see it in action."
-  }
-}
-```
-
-**For services with manual steps:**
-
-```json
-{
-  "name": "sentry",
-  "version": "1.0.0",
-  "description": "Error tracking with Sentry",
-  "target": "native",
-  
-  "copy": [...],
-  
-  "dependencies": {
-    "npm": {
-      "@sentry/react-native": "^5.15.0"
-    }
-  },
-  
-  "env": {
-    "required": [
-      {
-        "key": "SENTRY_DSN",
-        "description": "Your Sentry DSN from sentry.io",
-        "example": "https://xxx@xxx.ingest.sentry.io/xxx",
-        "link": "https://sentry.io/settings/projects/"
-      }
-    ]
-  },
-  
-  "manualSteps": [
-    {
-      "step": 1,
-      "title": "Create Sentry Project",
-      "description": "Go to sentry.io and create a new React Native project",
-      "link": "https://sentry.io/signup/"
-    },
-    {
-      "step": 2,
-      "title": "Add DSN to .env",
-      "description": "Copy your DSN and add it to .env file",
-      "file": ".env",
-      "content": "SENTRY_DSN=your-dsn-here"
-    }
-  ],
-  
-  "postInstall": {
-    "message": "Sentry installed! Complete the manual steps above to finish setup.",
-    "commands": [
-      "npm run test:sentry"
-    ]
-  }
-}
-```
-
----
-
-## Summary
-
-### Answer to Question 1: Auto-install vs Manual?
-
-**Start with MANUAL install:**
-- ✅ Easy to implement (1 day)
-- ✅ No edge cases
-- ✅ Works for everyone
-- Just show the command, user runs it
-
-**Add AUTO-install later:**
-- After testing with real users
-- After understanding monorepo patterns
-- With good error handling
-
-### Answer to Question 2: What else can be added/removed?
-
-**Tier 1 (Fully automated):**
-- UI components (charts, forms, modals, etc.)
-- Utilities (QR scanner, image picker, etc.)
-- Screens (profile, settings, etc.)
-
-**Tier 2 (Partial automation):**
-- Services (Sentry, PostHog, Supabase, etc.)
-- CLI installs code + shows manual steps
-- User adds API keys/config
-
-**Tier 3 (Documentation only):**
-- Auth systems (too complex)
-- Payment processing (too complex)
-- Custom business logic (too specific)
-
----
-
-## Final Recommendation
-
-**Ship v1 with:**
-1. Interactive confirmation ✅
-2. Manual package install (show command) ✅
-3. Modification detection ✅
-4. Manual steps display ✅
-5. Status/checklist commands ✅
-
-**Add v2 later:**
-6. Auto-install packages
-7. Type checking
-8. Update command
-
-This gets you to production in **1-2 weeks** instead of 3-4 weeks, with less risk.