Code Component Usage

The Code Component

The code component allows you to execute product or industry-specific code within an integration. This page outlines when and how to use a code component.

Why Use a Code Component?

You will likely have integration logic that can't be solved using the standard components Prismatic provides. The portion of your integrations that are specific to your product or industry can be accomplished using code component steps, or custom components.

When to Use a Custom Component Instead

Code component steps should be succinct and integration-specific. If the code you write could be reused in other integrations, if it needs to handle credentials, or if the code is complex enough that it would benefit from unit tests, etc., you should use a custom component instead.

Adding a Code Component to an Integration

Within the integration designer, add a step to your integration. Select the Code - Custom Code action.

You will be presented with a new code step in your integration, as well as a code editor.

Code Structure

The code component provides a stub function by default. Let's examine the structure of the code:

module.exports = async (context, params) => {
return;
};

The code component requires you to export an asynchronous function. The default code uses arrow function notation to create an async function to return.

Code Component Parameters

This function is provided two parameters, context and params.

The context parameter is an object with three attributes, configVars, logger, and credential.

The params parameter is an object that contains outputs from all previous steps of the integration.

context.logger

context.logger is a Pino logger that can be used for debugging. In this example we destructure context to access the logger:

module.exports = async ({ logger }, params) => {
logger.info("Things are going great");
logger.warn("Now less great...");
};

This could also be written

module.exports = async (context, params) => {
context.logger.info("Things are going great");
context.logger.warn("Now less great...");
};

context.configVars

context.configVars provides access to all configuration variables of an integration.

You can add configuration variables to your integration by clicking the Required Config Variables tab in the integration designer.

If you create a configuration variable myEndpoint, you could append text to that endpoint with a custom code block:

module.exports = async ({ logger, configVars }, params) => {
const fullEndpoint = `${configVars.myEndpoint}/extrapath`;
logger.info(fullEndpoint);
return {
fullEndpoint,
};
};

Notice that the endpoint is logged out in the testing pane on the bottom-right, and the endpoint is an output of the code step on the left.

context.credential

Credentials cannot be attached to code component steps. To handle credentials in custom code, use a custom code component instead.

params

params provides access to the return values of all previous steps of an integration. For example, suppose the integration is triggered by a webhook, and the webhook is provided a payload of {"exampleKey": "exampleValue"}.

That exampleKey would be accessible using params like so:

module.exports = async (context, params) => {
const { exampleKey } = params.trigger.all.body;
context.logger.info(`Received '${exampleKey}'`);
};

Notice the logged message in the testing pane

Code Component Return Values

The code component can optionally return a value for use by a subsequent step. The return value can be an object, string, integer, etc., and will retain its type as the value is passed to the next step.

In this example we return an object with key ipURL and value 'https://ipinfo.io/ip'.

module.exports = async (context, params) => {
return {
ipURL: "https://ipinfo.io/ip",
};
};

The output can be used as input for the next step by invoking outputs.runcode.all.ipURL.

Adding Dependencies to a Code Component

If your code component depends on node modules from npm, dependencies will automatically be imported. For example, if your code component reads:

const fetch = require("node-fetch/lib/index.js");
module.exports = async (context, params) => {
const response = await fetch("https://jsonplaceholder.typicode.com/todos/1");
const data = await response.json();
return data;
};

Then node-fetch will be imported as a dependency automatically from the UNPKG CDN.

You can also specify specific versions of npm packages for your code component:

const lodash = require("lodash@2.4.2");
const fetch = require("node-fetch@2.6.1/lib/index.js");

You can require any file from npm using package[@version][/file] syntax. Note that with the lodash import above, no file was specified. If no file is specified, the main file defined in the npm package's package.json is imported. An explicit path was called out for the node-fetch import because the node-fetch package defaults to importing a browser version of the package, and we want a compiled server version instead.

Last updated on