AppClient Component - helixml/apps-client

The AppClient component is the core of the helixml/apps-client project. It is responsible for initializing and managing the connection to the Helix Cloud backend. The AppClient component is built using React, TypeScript, Axios, and the Helix Cloud API.

The AppClient component is initialized by creating an instance of the AppClient class. This class takes an apiUrl parameter in the constructor, which is the base URL for the Helix Cloud API. Here is an example of how to initialize the AppClient component:

const apiUrl = 'https://api.helixcloud.com';
const appClient = new AppClient(apiUrl);

The AppClient component provides several methods for interacting with the Helix Cloud backend. These methods include:

  • getApps(): Returns a list of all the apps available in the Helix Cloud backend.
  • getApp(appId: string): Returns the details of a specific app by its ID.
  • createApp(app: CreateAppRequest): Creates a new app in the Helix Cloud backend.
  • updateApp(appId: string, app: UpdateAppRequest): Updates an existing app in the Helix Cloud backend.
  • deleteApp(appId: string): Deletes an app from the Helix Cloud backend.

Here is an example of how to use the getApps() method to retrieve a list of all the apps available in the Helix Cloud backend:

const apps = await appClient.getApps();
console.log(apps);

The AppClient component also provides a useApps() hook, which can be used to retrieve the list of apps in a functional component. Here is an example of how to use the useApps() hook:

import { useApps } from './AppClient';

function MyComponent() {
const apps = useApps();
return (
<div>
{apps.map(app => (
<div key={app.id}>{app.name}</div>
))}
</div>
);
}

The AppClient component also supports several options. These options include:

  • apiUrl: The base URL for the Helix Cloud API. This option is required.
  • headers: Additional headers to include in all API requests.
  • timeout: The timeout in milliseconds for all API requests.
  • retry: The number of times to retry a failed API request.

Here is an example of how to initialize the AppClient component with custom headers and a timeout:

const apiUrl = 'https://api.helixcloud.com';
const headers = {
'Authorization': 'Bearer my-token',
'X-Custom-Header': 'my-value'
};
const timeout = 10000; // 10 seconds
const appClient = new AppClient(apiUrl, { headers, timeout });

For more information on the AppClient component, you can refer to the following resources: