# Myop Cloud APIs

## Overview

Myop Cloud provides APIs to retrieve the latest component configurations for your applications in real time. These configurations are essential for rendering and managing components dynamically.

## Consume API

The Consume API is the primary way to fetch component configurations for rendering in your application.

### API Endpoint

```http
GET https://cloud.myop.dev/consume?id={COMPONENT_ID}
```

### Parameters

| Parameter | Type | Required | Description |
|-----------|------|----------|-------------|
| `id` | string | Yes | The unique identifier for your component. You can find this in the [Myop Dashboard](https://dashboard.myop.dev/) when viewing the component. |
| `env` | string | No | The environment to load from (e.g., `prod`, `staging`). If not specified, defaults to preview mode. |
| `preview` | boolean | No | Set to `true` to load the unpublished preview version. Defaults to `true` when `env` is not specified. |

### Examples

**Load published component from production:**
```http
GET https://cloud.myop.dev/consume?id=abc123&env=prod
```

**Load published component from staging:**
```http
GET https://cloud.myop.dev/consume?id=abc123&env=staging
```

**Load preview (unpublished) version:**
```http
GET https://cloud.myop.dev/consume?id=abc123&preview=true
```

### Response

The API returns a JSON object containing the component configuration:

```json
{
  "item": {
    "id": "abc123",
    "name": "my-component",
    "consume_variant": [
      {
        "id": "variant-id",
        "name": "default",
        "loader": {
          // Component loader configuration (HTML, styles, scripts)
        }
      }
    ]
  }
}
```

### Error Responses

| Status Code | Description |
|-------------|-------------|
| 400 | Bad Request - Missing required `id` parameter |
| 404 | Not Found - Component or variant not found |

---

## Flow API (Legacy)

:::warning Deprecation Notice
The Flow API is deprecated and will be removed in a future version. Please migrate to the [Consume API](#consume-api) for fetching component configurations.
:::

The legacy Flow API fetches component configurations based on User Flows.

### API Endpoint

```http
GET https://cloud.myop.dev/flow?id={FLOW_ID}&resolve=components
```

### Parameters

- `FLOW_ID` – The unique identifier for your User Flow. You can find this in the browser's URL when viewing the flow in the Myop Dashboard.
- `resolve=components` – Ensures that the response includes the full component configuration.

### Response

The API returns an object of type [`IUserFlow`](https://docs.myop.dev/docs/sdk/common/interfaces/IUserFlow), which contains details about the user flow and its associated components.

### Migration Guide

To migrate from the Flow API to the Consume API:

1. Get your component ID from the Myop Dashboard (instead of the Flow ID)
2. Replace your API call:
   ```diff
   - GET https://cloud.myop.dev/flow?id={FLOW_ID}&resolve=components
   + GET https://cloud.myop.dev/consume?id={COMPONENT_ID}&env=prod
   ```
3. Update your response handling to use the new response structure

---

## Purpose of Myop Cloud

**Myop Cloud** is designed to provide a centralized and scalable way to manage UI components dynamically. It enables:

- **Real-time updates**: Ensure that your application always uses the latest published component configurations.
- **Environment support**: Test components in staging before deploying to production.
- **Preview mode**: Test unpublished changes before making them live.
- **Decoupled component management**: Define components in the Myop Dashboard and retrieve them as needed without hardcoding configurations in your frontend.
- **Micro frontend integration**: Myop Cloud makes it easier to load and manage remote UI components across different applications, improving flexibility in micro frontend architectures.