Integrate Beag API to sync subscription data for this SaaS application:
**Beag API Key:** [YOUR_API_KEY] (store in .env as BEAG_API_KEY)
## Beag API Reference
- Base URL: <https://my-saas-basic-api-d5e3hpgdf0gnh2em.eastus-01.azurewebsites.net/api/v1/saas>
- Endpoint: GET /clients/by-email/{email}
- Header: X-API-KEY: BEAG_API_KEY
Response format:
{
"email": "[email protected]",
"status": "PAID",
"plan_id": 123,
"start_date": "2023-10-26T10:00:00Z",
"end_date": "2024-10-26T10:00:00Z",
"my_saas_app_id": "bgapp_xx_x.xxxxx",
"client_id": 456
}
Possible status values: PAID, FAILED, CANCELLED, REFUNDED, PAUSED, RESUMED
## Implementation Requirements
### 1. Database Setup
- Check if a database already exists in the project (PostgreSQL, MySQL, SQLite, etc.)
- If exists, check if a users table exists:
- If users table exists: use it, add any missing fields listed below
- If no users table: ASK ME before creating one
- If no database exists: ASK ME before setting up SQLite
User table fields:
- id (auto-increment primary key)
- email (unique)
- status
- plan_id
- start_date
- end_date
- client_id
- my_saas_app_id
- access_token
- last_synced
- created_at
### 2. Create API Endpoint to Add/Update User
Create an endpoint (e.g., POST /api/user/sync) that:
- Receives user data from client-side after successful login
- Expected payload from localStorage:
{
"access_token": "x_access_token value",
"email": "x_email value",
"plan_id": "x_plan_id value",
"start_date": "x_start_date value",
"end_date": "x_end_date value",
"status": "x_status value"
}
- If user email doesn't exist in database: create new user
- If user email exists: update the existing record
- Update last_synced timestamp
### 3. Client-Side: Call Sync Endpoint Once Per Session
Add code that runs when user accesses the main app after login:
- Only sync once per browser session (use sessionStorage flag)
- Get data from localStorage
- Call the sync endpoint to add/update user in database
Framework-specific implementation:
- Static HTML: Call on page load in main app pages
- React/Next.js: Call in useEffect on main app/dashboard component
- Vue/Nuxt: Call in onMounted on main app/dashboard component
- Svelte: Call in onMount on main layout/page
```javascript
// Reference implementation
async function syncUserToDatabase() {
const accessToken = localStorage.getItem("x_access_token");
if (!accessToken) return; // Not logged in
// Only sync once per session
if (sessionStorage.getItem("beag_synced")) return;
const userData = {
access_token: accessToken,
email: localStorage.getItem("x_email"),
plan_id: localStorage.getItem("x_plan_id"),
start_date: localStorage.getItem("x_start_date"),
end_date: localStorage.getItem("x_end_date"),
status: localStorage.getItem("x_status")
};
try {
await fetch("/api/user/sync", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(userData)
});
// Mark as synced for this session
sessionStorage.setItem("beag_synced", "true");
} catch (error) {
console.error("Failed to sync user:", error);
}
}
// Call this function when main app loads
syncUserToDatabase();
Create a function to fetch latest data from Beag API and update database:
async function syncUserFromBeag(email) {
// 1. Call Beag API: GET /clients/by-email/{email}
// 2. If user exists in database: update their record with Beag data
// 3. If user doesn't exist: create new record
// 4. Update last_synced timestamp
// 5. Return the user data
}
Detect the backend framework and implement accordingly:
The worker should: