# Quick Fix Guide - Get Your Data Working

## Current Situation

- ✅ Backend server is running at `http://localhost:5000`
- ✅ Frontend is running
- ❌ Backend has no data yet (it's empty)
- ✅ Your songs and profiles are in localStorage (local device only)

## Fix Steps (2 Minutes)

### Step 1: Go to Settings Page

Open the app and click **⚙️ Settings** in the navigation

### Step 2: Choose Your Mode

#### Option A: Keep Everything Local (Single Device)

- Keep "Local Mode" selected (the top option)
- Click **💾 Save DNS Settings**
- Your data stays on this device only
- ✅ Works offline
- ❌ Not synced to other devices

#### Option B: Enable Multi-Device Sync (Recommended)

- Click "Online Mode (No-IP DNS)" (the bottom option)
- Leave hostname as `localhost` and port as `5000`
- Click **💾 Save DNS Settings**
- Page will reload automatically
- You'll see a migration dialog pop up
- Click **"Yes, Migrate Now"**
- Wait 5-10 seconds for migration to complete
- ✅ Data now synced across all devices on your network
- ✅ Real-time updates via WebSocket

### Step 3: Verify Your Data

**If you chose Local Mode:**

- Go to Database → you should see all your songs
- Go to Profile → you should see all your profiles

**If you chose Online Mode:**

- After migration completes, go to Database
- All your songs should appear
- Go to Profile → all profiles should be there
- Open another browser tab or device on same network
- Go to `http://YOUR_COMPUTER_IP:3000`
- You should see the same data!

## Troubleshooting

### "I don't see my songs after switching to Online Mode"

1. Did you click the migration button?
2. Check Settings → Data Management section
3. Click **🔄 Migrate Local Data to Backend** button manually
4. Wait for success message
5. Refresh page

### "Migration dialog didn't appear"

1. Go to Settings page
2. Scroll to **Data Management** section
3. Click **🔄 Migrate Local Data to Backend** button
4. Confirm the dialog
5. Wait for success message

### "Backend not responding error"

1. Check if backend is running:

   ```powershell
   # In PowerShell, test the backend
   Invoke-RestMethod -Uri "http://localhost:5000/api/songs"
   ```

2. If not running, start it:

   ```powershell
   cd "E:\Documents\Website Projects\Church_SongLyric\backend"
   npm run dev
   ```

### "I want to access from other devices"

1. Find your computer's IP address:

   ```powershell
   ipconfig
   ```

   Look for IPv4 Address (e.g., `192.168.1.50`)

2. On other device, open browser to:

   ```text
   http://192.168.1.50:3000
   ```

3. Make sure both devices are on same Wi-Fi network

## Current Settings Summary

**Default Settings (already configured):**

- Protocol: `http`
- Hostname: `localhost`
- Port: `5000`
- Mode: `Local` (you need to switch to Online for sync)

**To Sync Across Devices:**

1. Settings → Choose "Online Mode"
2. Save Settings
3. Click Migrate button when prompted (or manually in Settings)
4. Done! ✅

## What Happens When You Migrate

The migration copies:

- ✅ All your songs (title, lyrics, chords, artist, band)
- ✅ All profiles (names, default keys, settings)
- ✅ All worship plans (dates, songs, notes)
- ✅ Profile-song associations
- ✅ Custom keys per profile per song

**Your local data is NOT deleted** - it's copied, so you always have a backup.

## Need Help?

1. Check browser console (F12) for error messages
2. Check backend console for logs
3. Make sure both frontend and backend are running
4. Try the manual migration button in Settings

---

**Quick Start Commands:**

```powershell
# Start Backend
cd "E:\Documents\Website Projects\Church_SongLyric\backend"
npm run dev

# Start Frontend (in another terminal)
cd "E:\Documents\Website Projects\Church_SongLyric\frontend"
npm start
```
