# DashboardDesignPreview - Real Data Status

## Overview

The DashboardDesignPreview component is **NOT just mock data** - it uses **real live APIs** to fetch actual data from the backend!

## Live API Integration

When DashboardDesignPreview renders (for custom/unknown sidebar items or preview mode), it fetches real data from:

### 1. **Credits/Wallet**

- **API:** `GET /api/{prefix}/wallet/balance`
- **Data:** Real Tracecoin balance
- **Refresh:** Real-time

### 2. **Marketplace (Professionals)**

- **API:** `GET /api/{prefix}/marketplace?limit=50`
- **Data:** Real customer requirements/leads
- **Refresh:** On load + manual refresh

### 3. **Lead Requests (Professionals)**

- **API:** `GET /api/{prefix}/leads/requests/me?limit=50`
- **Data:** Real sent proposals
- **Refresh:** After actions (create/update/delete)

### 4. **Customer Requirements**

- **API:** `GET /api/customers/requirements?limit=50`
- **Data:** Real service requests
- **Refresh:** On load + manual refresh

### 5. **Jobs**

- **API:** `GET /api/jobs?limit=50`
- **Data:** Real job postings
- **Refresh:** On load

### 6. **User Profile**

- **API:** `GET /api/{prefix}/profile/me`
- **Data:** Real profile data
- **Refresh:** On load

### 7. **Professional Services**

- **API:** `GET /api/{prefix}/services/me`
- **Data:** Real service packages
- **Refresh:** After CRUD operations

### 8. **Professional Portfolio**

- **API:** `GET /api/{prefix}/portfolio/me`
- **Data:** Real portfolio items
- **Refresh:** After CRUD operations

### 9. **User Roles**

- **API:** `GET /api/users/roles`
- **Data:** Real registered roles
- **Refresh:** After role switch/register

### 10. **Pricing Packages**

- **API:** `GET /api/packages`
- **Data:** Real pricing from admin
- **Refresh:** On load

### 11. **Knowledge Base**

- **API:** `GET /api/runtime-config/knowledge_base/GLOBAL_KB`
- **Data:** Real help articles
- **Refresh:** On load

### 12. **Notifications**

- **API:** `GET /api/me/notifications/unread-count`
- **Data:** Real unread notification count
- **Refresh:** Every 30 seconds (polling)

## When is DashboardDesignPreview Used?

1. **Unknown sidebar items** - If backend returns sidebar items not in REAL_PAGES list
2. **Custom runtime config** - Dynamic sidebar from admin dashboard config
3. **Development mode** - Testing new features
4. **Preview mode** - Admin previewing role dashboards

## Key Point

**Even in "preview" mode, you're seeing REAL DATA from the backend!**

The difference between real components and DashboardDesignPreview:

| Aspect          | Real Components  | DashboardDesignPreview |
| --------------- | ---------------- | ---------------------- |
| **Data Source** | Real APIs        | Real APIs (same!)      |
| **UI Design**   | Custom per page  | Generic/standardized   |
| **Features**    | Full feature set | Basic CRUD operations  |
| **Performance** | Optimized        | General purpose        |
| **Maintenance** | Per-component    | Single component       |

## Summary

✅ **Real Components** = Custom UI + Real Data
✅ **DashboardDesignPreview** = Generic UI + Real Data
❌ **No Mock Data Anywhere** = Everything is connected to backend

**You ALWAYS see real data, whether using dedicated pages or the preview component!**