@vercel/integration-utils

A set of utilities for Vercel Integrations

Usage no npm install needed!

<script type="module">
  import vercelIntegrationUtils from 'https://cdn.skypack.dev/@vercel/integration-utils';
</script>

README

@vercel/integration-utils

npm install size cicleci codecov

A set of utilies for Vercel Integrations.
Vist https://vercel.com/docs/integrations for more details.

Install

yarn add @vercel/integrations

Middleware for Micro / Vercel

This middleware helps to write UiHook for Vercel integrations easily.

const {withUiHook} = require('@vercel/integration-utils');

module.exports = withUiHook(async (options) => {
    const {payload, vercelClient} = options;
    const {action, clientState} = payload;
    let metadata = await vercelClient.getMetadata();

    if (action === 'submit') {
        metadata = clientState;
        await vercelClient.setMetadata(metadata);
    }

    if (action === 'reset') {
        metadata = {};
        await vercelClient.setMetadata(metadata);
    }

    return `
        <Page>
            <Container>
                <Input label="Secret Id" name="secretId" value="${metadata.secretId || ''}"/>
                <Input label="Secret Key" name="secretKey" type="password" value="${metadata.secretKey || ''}" />
            </Container>
            <Container>
                <Button action="submit">Submit</Button>
                <Button action="reset">Reset</Button>
            </Container>
        </Page>
    `;
});

This middleware calls the handler with an object containing following entities:

  • payload - the information related uiHook
  • vercelClient - initialized API client for Vercel with some helpers