# Hopenity App Control Panel Guide

## Overview
The App Control Panel is a comprehensive admin interface that allows you to manage every aspect of the Hopenity social media app from a single dashboard. Changes made here are synced with the mobile app in real-time.

## Features

### 1. Basic App Information
- **App Name**: Set the display name of your application
- **Version**: Track app versions
- **Description**: App store description
- **Support Contact**: Email and phone for user support
- **Website**: Official website URL

### 2. Theme Customization
Control the entire visual appearance of the app:
- **Primary Color**: Main brand color (#FF3377 by default)
- **Secondary Color**: Supporting color (#1877F2 by default)
- **Accent Color**: Highlight and call-to-action color
- **Text Color**: Default text color throughout the app
- **Background Color**: App background
- **Font Size**: Default font size (pixels)

### 3. Feature Toggles
Enable/disable features without code changes:
- ✓ Stories
- ✓ Reels (short videos)
- ✓ Shopping
- ✓ Messaging
- ✓ Push Notifications
- ✓ Live Streaming
- ✓ Groups
- ✓ Hashtags
- ✓ Trending
- ✓ Comments

### 4. Notification Settings
Configure how users receive notifications:
- **Push Notifications**: Real-time mobile notifications
- **Email Notifications**: Digest emails
- **SMS Notifications**: Text message alerts
- **FCM Key**: Firebase Cloud Messaging configuration

### 5. Content Limits & Restrictions
Set boundaries for user-generated content:
- **Max Post Size**: File size limit in MB (default: 100MB)
- **Max Video Duration**: Maximum video length in seconds (default: 600s)
- **Max Posts Per Day**: Prevent spam (default: 50)
- **Posts Per Page**: Pagination size (default: 20)
- **Minimum Account Age**: Days before posting allowed (default: 0)

### 6. Security Settings
Manage account security requirements:
- **Email Verification**: Require verified email on signup
- **Phone Verification**: Require verified phone number
- **Two-Factor Authentication**: Optional 2FA for users
- **Account Lockout**: Attempts before account lock (default: 5)
- **Password Length**: Minimum password characters (default: 8)

---

## API Endpoints

All app configuration is exposed via REST API for mobile app consumption:

### Get Full Configuration
```bash
GET /api/config
Response: {
  "success": true,
  "config": { /* full config */ },
  "features": ["stories", "reels", "messaging", ...]
}
```

### Get Theme Colors
```bash
GET /api/config/theme
Response: {
  "primary_color": "#FF3377",
  "secondary_color": "#1877F2",
  "accent_color": "#FF3377",
  "text_color": "#000000",
  "bg_color": "#FFFFFF",
  "font_size": 14
}
```

### Check Feature Status
```bash
GET /api/config/feature/{featureName}
Response: {
  "feature": "stories",
  "enabled": true
}
```

### Get All Enabled Features
```bash
GET /api/config/features
Response: {
  "features": [
    {"name": "stories", "enabled": true},
    {"name": "reels", "enabled": true},
    ...
  ]
}
```

### Get Content Limits
```bash
GET /api/config/limits
Response: {
  "max_post_size": 100,
  "max_video_duration": 600,
  "max_daily_posts": 50,
  "posts_per_page": 20,
  "min_account_age": 0
}
```

### Get Notification Settings
```bash
GET /api/config/notifications
Response: {
  "push_enabled": true,
  "email_enabled": true,
  "sms_enabled": false
}
```

### Get Security Settings
```bash
GET /api/config/security
Response: {
  "require_email_verification": true,
  "require_phone_verification": false,
  "enable_two_factor": false,
  "account_lockout_attempts": 5,
  "password_min_length": 8
}
```

---

## Mobile App Integration

### Kotlin - Fetching Configuration

```kotlin
// In your Activity/Fragment
val appConfigViewModel: AppConfigViewModel = hiltViewModel()

// Observe config changes
LaunchedEffect(Unit) {
    when (val state = appConfigViewModel.appConfigState.value) {
        is AppConfigState.Success -> {
            val config = state.config
            applyTheme(config)
            setupFeatures(config)
        }
        is AppConfigState.Error -> {
            Toast.makeText(context, state.message, Toast.LENGTH_SHORT).show()
        }
        else -> {} // Loading
    }
}

// Check if feature is enabled
if (appConfigViewModel.isFeatureEnabled("stories")) {
    // Show stories feature
}

// Apply theme colors
val primaryColor = appConfigViewModel.getThemeColor("primary")
val accentColor = appConfigViewModel.getThemeColor("accent")
```

### Using Configuration in Compose

```kotlin
@Composable
fun HomeScreen(appConfigViewModel: AppConfigViewModel = hiltViewModel()) {
    val config = appConfigViewModel.appConfig.value
    val isLoading = appConfigViewModel.isLoading.value

    if (isLoading) {
        CircularProgressIndicator()
    } else if (config != null) {
        // Apply theme
        val primaryColor = Color(android.graphics.Color.parseColor(config.primary_color))
        
        // Show features conditionally
        if (appConfigViewModel.isFeatureEnabled("stories")) {
            StoryRing()
        }
        
        if (appConfigViewModel.isFeatureEnabled("reels")) {
            ReelsSection()
        }
    }
}
```

---

## Workflow: Managing App Changes

### Step 1: Access App Control
1. Log in to admin panel
2. Navigate to "App Control" from sidebar
3. Choose the tab for what you want to manage

### Step 2: Make Changes
- Update app name/version
- Toggle features on/off
- Adjust limits and restrictions
- Update colors and theme

### Step 3: Save
- Click "Save Changes" button
- Confirmation message appears
- Changes are instantly stored in database

### Step 4: Mobile App Syncs
- Next time user opens app
- AppConfigViewModel fetches fresh config
- Theme and features update automatically
- No need to push new app versions!

---

## Real-World Examples

### Disable a Feature Temporarily
**Scenario**: Stories feature has a bug, need to disable immediately
1. Go to App Control → Features tab
2. Uncheck "Stories"
3. Click "Save Changes"
4. All users see stories disabled within minutes

### Emergency Maintenance Mode
**Scenario**: Upgrading servers, need to put app in maintenance
1. Go to Basic Info tab
2. (Future: Add maintenance mode toggle)
3. Save - users see "Under Maintenance" message

### A/B Testing UI Colors
**Scenario**: Testing new brand colors
1. Go to Theme tab
2. Change primary_color to test color (e.g., #FF6B9D)
3. Save
4. Small percentage of users see new color
5. Compare engagement metrics
6. Revert or keep based on results

### Enforce Security During Crisis
**Scenario**: Hacking attempts detected
1. Go to Security tab
2. Lower "Account Lockout Attempts" from 5 to 3
3. Increase "Password Min Length" from 8 to 12
4. Enable "Email Verification" requirement
5. Users immediately subject to stricter requirements

---

## Database Schema

### app_config Table
```sql
id (PRIMARY KEY)
app_name VARCHAR(255)
app_version VARCHAR(50)
description TEXT
support_email VARCHAR(255)
support_phone VARCHAR(20)
website VARCHAR(255)
primary_color VARCHAR(7)
secondary_color VARCHAR(7)
accent_color VARCHAR(7)
text_color VARCHAR(7)
bg_color VARCHAR(7)
font_size INT
push_notifications BOOLEAN
email_notifications BOOLEAN
sms_notifications BOOLEAN
fcm_key VARCHAR(255)
max_post_size INT
max_video_duration INT
max_daily_posts INT
posts_per_page INT
min_account_age INT
require_email_verification BOOLEAN
require_phone_verification BOOLEAN
enable_two_factor BOOLEAN
account_lockout_attempts INT
password_min_length INT
created_at TIMESTAMP
updated_at TIMESTAMP
```

### app_features Table
```sql
id (PRIMARY KEY)
feature_name VARCHAR(100) UNIQUE
is_enabled BOOLEAN
description TEXT
created_at TIMESTAMP
updated_at TIMESTAMP
```

---

## Best Practices

✓ **Test Changes**: Always test theme changes on a test device first
✓ **Gradual Rollouts**: Disable experimental features for all but beta users
✓ **Monitor Impact**: Check user engagement after major feature toggles
✓ **Keep Backups**: Note previous settings before major changes
✓ **Communication**: Notify users before disabling major features
✓ **Update Support**: Brief support team on new settings/limits
✓ **Security First**: Conservative defaults on security settings

---

## Troubleshooting

### Changes Not Reflecting in App
1. Force close the mobile app
2. Clear cache (Settings → Apps → Hopenity → Storage → Clear Cache)
3. Restart the app
4. Changes should sync

### Color Changes Appear Wrong
1. Check hex color format (must be #RRGGBB)
2. Ensure theme endpoint returns updated values
3. Verify frontend is reading from API, not hardcoded colors

### Feature Disabled But Still Visible
1. Check if feature check is implemented in code
2. Backend may still serve content if not checking config
3. Verify AppConfigViewModel.isFeatureEnabled() is being called

---

## Future Enhancements

- [ ] Version-based feature rollout (deploy to 10%, then 50%, then 100%)
- [ ] Scheduled maintenance windows
- [ ] AB testing framework
- [ ] Rollback previous configurations
- [ ] Feature flag analytics
- [ ] User segment-based settings
- [ ] Real-time log viewer
- [ ] API rate limit controls
- [ ] Cache invalidation tools
- [ ] Configuration versioning

---

## Support

For issues or questions about App Control:
- Email: admin@hopenity.com
- Check logs at: `/admin-panel/logs/`
- Review API response at: `GET /api/config`