npm package: @ingestro/pipelines-angular
Description: <!-- markdownlint-disable --> <p align="center">   <a href="https://ingestro.com/" rel="noopener" target="_blank"><img width="150" src="https://s3.eu-central-1.amazonaws.com/general-upload.ingestro.com/ingestro_logo_darkblue.svg" alt="Ingestro logo"></a> 
Latest version: 1.5.1

<!-- markdownlint-disable -->
<p align="center">
  <a href="https://ingestro.com/" rel="noopener" target="_blank"><img width="150" src="https://s3.eu-central-1.amazonaws.com/general-upload.ingestro.com/ingestro_logo_darkblue.svg" alt="Ingestro logo"></a>
</p>
<h1 align="center">@ingestro/pipelines-angular</h1>

<div align="center">
Embeddable Angular Components for Ingestro Data Pipelines

[![API status](https://img.shields.io/uptimerobot/ratio/m792354517-acd98c6100961072cc093759?color=2fa659&label=uptime)](https://status.ingestro.com/)
[![npm latest package](https://img.shields.io/npm/v/@ingestro%2Fpipelines-angular?color=5c8ef2&label=npm@latest)](https://badge.fury.io/js/@ingestro%2Fpipelines-angular)

An Angular component library that lets your users embed UI workflows for creating and managing Ingestro Data Pipelines directly into your applications.

</div>

## Table of Contents

- [What is Ingestro Data Pipelines](#what-is-ingestro-data-pipelines)
- [Features & Components](#features--components)
- [Authentication](#authentication)
- [Getting Started](#getting-started)
- [Embeddables Usage](#embeddables-usage)
- [Using the API Directly](#using-the-api-directly)
- [Configuration & Props](#configuration--props-general)
- [Further Resources](#further-resources)

## What is Ingestro Data Pipelines

Ingestro Data Pipelines is a full pipeline product that enables you to build, deploy, monitor and manage automated data ingestion workflows. Key capabilities include:

- Defining **connectors** (inputs/outputs) for various sources/destinations
- Specifying **target data models** (TDMs) to shape output schema
- Building & running **pipelines**, including scheduling, execution history, error tracking
- Embeddable Angular UI components ("embeddables") so you can embed parts of the workflow in your own app
- A REST API for full programmatic control

## Features & Components

Here are the main components/ embeddables available in this package. Use them to provide UI workflows for your users inside your application. For full docs, see the [Embeddables Guide](https://docs.ingestro.com/dp/embeddables/).

| Embeddable               | Purpose                                                       |
| ------------------------ | ------------------------------------------------------------- |
| `CreatePipeline`         | UI to create a new pipeline workflow within your app          |
| `PipelineDetails`        | View / edit a specific pipeline                               |
| `PipelineList`           | Show a list of all pipelines                                  |
| `ExecutionDetails`       | View, inspect and optionally rerun a particular execution run |
| `ExecutionList`          | List of executions for one pipeline                           |
| `CreateConnector`        | UI to add a new connector (input/output) for your pipelines   |
| `ConnectorDetails`       | Inspect/ modify a connector                                   |
| `ConnectorList`          | List available connectors                                     |
| `CreateTargetDataModel`  | UI to create a target data model (TDM)                        |
| `TargetDataModelDetails` | View or edit one TDM                                          |
| `TargetDataModelList`    | Listing of TDMs                                               |

## Authentication

To use the embeddables or call the API directly, you’ll need an **access token**. The flow is:

1. Get your **license key** (from dashboard.ingestro.com)
2. You authenticate using the license key + an identifier (either a user email or a sub-organization identifier). ([Authentication API guide](https://docs.ingestro.com/dp/authentication-api/))
3. You receive an `access_token` which you include in subsequent requests

**Example: Get an access token**

```bash
curl -X POST "https://api-gateway.ingestro.com/dp/api/v1/auth/access-token"
  -H "Accept: application/json"
  -H "Content-Type: application/json"
  -d '{
    "license_key": "YOUR_LICENSE_KEY",
    "auth": {
      "identifier": "user@example.com",  // or sub-org identifier
      "type": "USER"                     // or "SUB_ORG"
    }
  }'
```

Response:

```json
{
  "access_token": "YOUR_ACCESS_TOKEN"
}
```

## Getting Started

Install the package:

```bash
npm install @ingestro/pipelines-angular
# or
yarn add @ingestro/pipelines-angular
```

## Embeddables Usage

Here’s how to embed a component in your Angular app. All embeddables accept props such as `accessToken`, `settings`, and callbacks (e.g. `onClose`, `onCreate`, etc.). Always consult the specific guide for the embeddable you're using in the [Embeddables docs](https://docs.ingestro.com/dp/embeddables/).

**Example for `CreatePipeline`:**

```jsx
import { CreatePipelineModule, ... } from '@ingestro/pipelines-angular';

@NgModule({
  declarations: [CreatePipelineComponent],
  imports: [CreatePipelineModule],
  providers: [],
  bootstrap: [CreatePipelineComponent],
})
export class AppModule {}
```

```jsx
<create-pipeline
  [accessToken]="accessToken"
  [templateId]="templateId"
  [configuration]="configuration"
  [settings]="settings"
  (onPipelineCreate)="onPipelineCreate($event)"
  (onClose)="onClose()"
  (onConnectorCreate)="onConnectorCreate($event)"
  (onTdmCreate)="onTdmCreate($event)"
  (onExecutionView)="onExecutionView($event)"
/>
```

```jsx
export class CreatePipelineComponent implements OnInit {
  accessToken!: string;
  templateId!: string;
  configuration!: Configuration;
  settings!: Settings;

  ngOnInit(): void {
    this.accessToken = "ACCESS_TOKEN";
    this.templateId = "TEMPLATE_ID";
    this.configuration = {
      developerMode: false,
      name: "string",
      tdmId: "string",
      outputConnectorId: "string",
      inputConnectorId: "string",
      errorConfig: {
        errorThreshold: 0,
      },
      scheduleConfig: {
        frequency: "HOURLY",
        interval: 0,
        startsOn: new Date(),
        endsOn: new Date(),
      }
    };
    this.settings = {
      i18nOverrides: {},
      language: "en",
      modal: true,
      allowTdmCreation: false,
      allowInputConnectorCreation: false,
      allowOutputConnectorCreation: false,
      runPipelineOnCreation: false
    };
  }

  onPipelineCreate({}): void {
    // Handle pipeline creation
  }

  onClose(): void {
    // Handle close
  }

  onConnectorCreate({}): void {
    // Handle connector creation
  }

  onTdmCreate({}): void {
    // Handle TDM creation
  }

  onExecutionView({}): void {
    // Handle execution view
  }
}
```

## Using the API Directly

If you want full control (e.g. automated processes, server-side integrations, or custom UI), you can use the REST API. See the [REST API guide](https://docs.ingestro.com/dp/guide-api/) and relevant sub-APIs.

**Example: Get all pipelines**

```bash
curl -X GET "https://api-gateway.ingestro.com/dp/api/v1/pipeline/"
  -H "Accept: application/json"
  -H "Authorization: Bearer YOUR_ACCESS_TOKEN"

```

**Example: Update a pipeline**

```bash
curl -X PUT "https://api-gateway.ingestro.com/dp/api/v1/pipeline/{pipelineId}"
  -H "Accept: application/json"
  -H "Authorization: Bearer YOUR_ACCESS_TOKEN"
  -H "Content-Type: application/json"
  -d '{
    "name": "New pipeline name",
    "configuration": {},
    "input_connectors": [],
    "output_connectors": [],
    "mapping_config": {}
  }'

```

## Configuration & Props (General)

Some common props/settings across embeddables:

| Prop / Setting  | Description                                                               |
| --------------- | ------------------------------------------------------------------------- |
| `accessToken`   | Token obtained via authentication API (must be passed to all embeddables) |
| `settings`      | UI settings like language, modal behavior, translations etc.              |
| `configuration` | Embeddable-specific configuration options (defaults, initial values)      |
| Callbacks       | Events such as `onClose`, `onCreate`, `onUpdate`, `onError` etc.          |

## Further Resources

- [Authentication API guide](https://docs.ingestro.com/dp/authentication-api/)
- [Embeddables documentation](https://docs.ingestro.com/dp/embeddables/)
- [REST API guide](https://docs.ingestro.com/dp/guide-api/)
- [Connector API docs](https://docs.ingestro.com/dp/connector-api/)
- [Target Data Model API docs](https://docs.ingestro.com/dp/tdm-api/)