# Adding OGC Processes

The `processclient` package provides a service instance, `ApiService`, for adding Open Geospatial Consortium (OGC) compliant API processes to the OPT framework. Within the process, it handles HTTP headers, synchronous and asynchronous execution, and automated polling for asynchronous jobs. 

Please follow the steps below for how to utilize the `processclient` package. 

### Adding an OGC compliant API process using the `processclient` package

{% stepper %}
{% step %}

#### Register the dependency 

To use the `ApiService` in your app or new package, it first needs to be declared within the `build.config.mjs`. For example: 

<pre class="language-typescript"><code class="lang-typescript">// packages/your-package/build.config.mjs
import { defineBuildConfig } from "@open-pioneer/build-support";

export default defineBuildConfig({
    services: {
        YourServiceImpl: {
            provides: ["app.YourService"],
            references: {
                apiService: "app.ApiService"
            }
        }
    },
    ui: {
        references: [
            "app.YourService", 
            "app.ApiService" // Add this for UI components
        ]
<strong>    }
</strong>});
</code></pre>

{% endstep %}

{% step %}

#### Use the `ApiService`

**In a `React` UI component**&#x20;

OPT provides a `useService` hook to access the engine directly for UI components. We can utilize this hook for the `ApiService`. For example:&#x20;

```typescript
// your-app/YourComponent.tsx 
import { useService } from "open-pioneer:react-hooks";
import { ApiService, JobStatusResponse } from "processclient";

const apiService = useService<ApiService>("app.ApiService");

const handleSomething = async () => {
    const response = await apiService.executeProcess(URL, payload, true); 
    // Handle the result 
}; 
```

**In a `service` implementation**&#x20;

Inject the service from a constructor. For example:&#x20;

```typescript
// your-app/YourService.ts 
import { ServiceOptions, DeclaredService } from "@open-pioneer/runtime";
import { ApiService, JobStatusResponse } from "processclient"; 

export interface YourService extends DeclaredService<"app.YourService"> {
    // Some functions 
}

export class YourServiceImpl implements YourService {
    private readonly apiService: ApiService;
    
     constructor(options: ServiceOptions<YourServiceReferences>) {
        this.apiService = options.references.apiService; // Inject the service
    }
}
```

{% endstep %}

{% step %}

### Core Logic Reference

`executeProcess(url, payload, sync)`&#x20;

This initiates the API process. It adds the `Prefer: respond-sync` or `respond-async` headers. It returns a standard `Response` object.&#x20;

{% hint style="info" %}
If the status is `201` or `202`, it is recommended to extract the `Location` header to begin the polling.&#x20;
{% endhint %}

`pollJobStatus(url, onUpdate, intervalMs)`&#x20;

This starts a polling loop for asynchronous jobs.&#x20;

* `onUpdate` callback, receives a `JobStatusResponse` every polling cycle. This can be used to update UI progress or status text.&#x20;
* **Resolution** results in the returned `Promise` to resolve when the status hits "successful"
* **Rejection** results in the `Promise` rejecting if the status hits "failed" or "dismissed"&#x20;

{% endstep %}
{% endstepper %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://directed-eu.gitbook.io/data-fabric-manual/adding-and-developing-features/adding-ogc-processes.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.