@mittwald/api-client

mittwald API JavaScript client

This package contains a (mostly auto-generated) JavaScript client for the mittwald API.

License

Copyright (c) 2023 Mittwald CM Service GmbH & Co. KG and contributors

This project (and all NPM packages) therein is licensed under the MIT License; see the LICENSE file for details.

Table of contents

• Installing
• Usage
  • Setting request parameters
    • Path parameters
    • Headers, query parameters and request body
• Example
• Usage in React
  • Installation
  • Setup
  • Usage
  • Example
• API documentation
• Accessing the underlying Axios instance
  • Adding custom HTTP headers
  • Intercepting requests or responses
• Usage with TypeScript
  • Importing types
• Migrating from package version V2 to V3

Installing

You can install this package from the regular NPM registry:

yarn add @mittwald/api-client

Usage

Import the client:

import { MittwaldAPIV2Client } from "@mittwald/api-client";

To create a client instance you can use one of the following factory method for different types of authentication:

1. MittwaldAPIClient.newUnauthenticated()
2. MittwaldAPIClient.newWithToken(apiToken: string) (recommended)
3. MittwaldAPIClient.newWithCredentials(email: string, password: string) (does actually perform a login in the background and thus returns a promise)

Have a look at our API introduction for more information on how to obtain an API token and how to get started with the API.

Setting request parameters

API requests may require these type of parameters:

• path parameters
• headers
• query parameters
• request body

Path parameters

Path parameters are variable parts of a URL path. They are typically used to point to a specific resource within a collection, such as a project identified by ID. A URL can have several path parameters, each denoted with curly braces { }.

/v2/projects/{projectId}

Path parameters are required and must be directly defined inside the request object.

// Setting the projectId path parameters
const project = await mittwaldApi.project.getProject({
  projectId: "p-xxxxx",
});

Headers, query parameters and request body

Depending on the operation, you must configure additional parameters, such as queryParameters (URL query parameters), headers (HTTP headers), and data (request body).

The operations and their parameters are documented in the API documentation.

When using TypeScript all parameter schemas are reflected by the request type, so you will get compile errors, when a request does not match the schema.

const response = await mittwaldApi.category.operation({
  // path parameters
  pathParameter1: "param1",
  pathParameter2: "param2",
  // parameters in header
  headers: {
    "x-header": "header",
  },
  // query parameters
  queryParameters: {
    queryParameter1: "queryParam1",
    queryParameter2: "queryParam2",
  },
  // JSON object in request body
  data: {
    data1: "data1",
    data2: "data2",
  },
});

Example

import { MittwaldAPIV2Client } from "@mittwald/api-client";

const mittwaldApi = MittwaldAPIClient.newWithToken("your-access-token");

const projects = await mittwaldApi.project.listProjects();

Usage in React

This package also provides a client aligned to be used in React components. It uses @mittwald/react-use-promise to encapsulate the asynchronous API functions into AsyncResources. More details about how to use AsyncResources see the package documentation.

Installation

To use the React client you have to install the additional @mittwald/react-use-promise package:

yarn add @mittwald/react-use-promise

Setup

To create a React client instance, you first need an instance of the regular (promise-based) client. Then you can use the .fromBaseClient(api) method to build the React client.

const api = MittwaldAPIV2Client.newUnauthenticated();
const apiReact = MittwaldAPIV2ClientReact.fromBaseClient(api);

Usage

The React client has an equivalent for every GET method of the regular client. The methods returning an AsyncResource that can be used to get the API responses.

If the response is not OK (status 200), an ApiClientError will be thrown. Errors can be handled by using error-boundaries. See the error handling section for more details.

Example

import { MittwaldAPIV2Client } from "@mittwald/api-client";
import { MittwaldAPIV2ClientReact } from "@mittwald/api-client/react";

const api = MittwaldAPIV2Client.newUnauthenticated();
const apiReact = MittwaldAPIV2ClientReact.fromBaseClient(api);

const ProjectsList = () => {
  // apiReact.project.listProjects() returns an AsyncResource that can be "used"
  const projects = apiReact.project.listProjects().use({
    autoRefresh: {
      seconds: 30,
    },
  });

  return (
    <ul>
      {projects.map((p) => (
        <li key={p.id}>{p.description}</li>
      ))}
    </ul>
  );
};

API documentation

The API documentation can be found at https://api.mittwald.de/v2/docs/. You can find the operation ID on the right side of each operation.

Accessing the underlying Axios instance

The client uses the popular Axios HTTP client under the hood. You may access the Axios instance with the clients axios property.

Adding custom HTTP headers

To add custom HTTP headers to all requests you can use Axios' defaults.headers property:

client.axios.defaults.headers["User-Agent"] = `your-tool/v1.2.3`;

Intercepting requests or responses

To intercept requests or responses you can use Axios' interceptors.

Usage with TypeScript

All response and request types can be imported from the MittwaldAPIV2 namespace.

Referencing request/response types

import { MittwaldAPIV2 } from "@mittwald/api-client";

type ProjectData = MittwaldAPIV2.Operations.ProjectGetProject.ResponseData;

// Reference "non-200" response type
type ProjectNotFoundData =
  MittwaldAPIV2.Operations.ProjectGetProject.ResponseData<404>;

type CreateProjectData =
  MittwaldAPIV2.Operations.ProjectCreateProject.RequestData;

Migrating from package version V2 to V3

This instruction considers migrating from package version V2 to V3, which has a breaking change in the call signature of request calls. The API itself has not changed and is still at version 2.

Path parameters are a primary component of the request and thus should not be "hidden" in the request config object. In V3 the API of the request configuration object has changed, and you have to set the path parameters directly in the root level of the request object.

// V2
mittwaldApi.project.getProject({
  pathParameters: {
    projectId: "p-xxxxx",
  },
});

// V3
mittwaldApi.project.getProject({
  projectId: "p-xxxxx",
});