Step 7 - Webhook Subscriptions
So far, we have created some basic demonstrations of the platform. Now, let's build a useful integration between two apps.
Enable the GitHub repository webhook
In src/index.js, uncomment the import of ./githubToSlack.
import "./helloWorld";
import "./helloSlack";
import "./basicWebhook";
import "./githubToSlack";Take a look at the webhook definition
Look at src/githubToSlack.js. The first thing we do is import the GitHub connector.
import { GitHub } from "@runlightyear/github";
import { defineAction } from "@runlightyear/lightyear";
import { Slack } from "@runlightyear/slack";
const githubWebhook = GitHub.defineWebhook({
name: "githubWebhook",
title: "GitHub Webhook",
variables: ["owner", "repo"],
subscribeProps: ({ variables }) => {
return {
owner: variables.owner,
repo: variables.repo,
events: ["push"],
};
},
});
...Next, we define a GitHub webhook. This webhook will be more sophisticated than the previous one we defined in that it will have a subscription to events in a GitHub repository.
You'll notice that instead of using the defineWebhook function that we used in the previous step, we actually call a function on the GitHub connector. This will be typical of connectors that support subscriptions and will take care of most of the work of subscribing and unsubscribing.
import { GitHub } from "@runlightyear/github";
import { defineAction } from "@runlightyear/lightyear";
import { Slack } from "@runlightyear/slack";
const githubWebhook = GitHub.defineWebhook({
name: "githubWebhook",
title: "GitHub Webhook",
variables: ["owner", "repo"],
subscribeProps: ({ variables }) => {
return {
owner: variables.owner,
repo: variables.repo,
events: ["push"],
};
},
});
...We can use some variables to configure which owner/repo we want to connect to.
import { GitHub } from "@runlightyear/github";
import { defineAction } from "@runlightyear/lightyear";
import { Slack } from "@runlightyear/slack";
const githubWebhook = GitHub.defineWebhook({
name: "githubWebhook",
title: "GitHub Webhook",
variables: ["owner", "repo"],
subscribeProps: ({ variables }) => {
return {
owner: variables.owner,
repo: variables.repo,
events: ["push"],
};
},
});
...And finally we set up subscribeProps. This describes the properties of the subscription that we want to set up. You can take a look at the API docs for a full set of properties once we have the docs generating properly.
import { GitHub } from "@runlightyear/github";
import { defineAction } from "@runlightyear/lightyear";
import { Slack } from "@runlightyear/slack";
const githubWebhook = GitHub.defineWebhook({
name: "githubWebhook",
title: "GitHub Webhook",
variables: ["owner", "repo"],
subscribeProps: ({ variables }) => {
return {
owner: variables.owner,
repo: variables.repo,
events: ["push"],
};
},
});
...Now look at the action definition
Here we leverage the optional trigger property to let the platform know we want this to run every time a particular webhook is called.
...
defineAction({
name: "githubToSlack",
title: "GitHub to Slack",
trigger: {
webhook: githubWebhook,
},
apps: ["slack"],
variables: ["channel"],
run: async ({ data, auths, variables }) => {
const pushPayload = GitHub.asPushPayload(data);
if (pushPayload) {
console.info("Got a push payload");
const slack = new Slack({ auth: auths.slack });
await slack.postMessage({
channel: variables.channel,
text: `Got push event on repo: ${pushPayload.repository.fullName}`,
});
console.info("Posted message to Slack");
}
},
});We'll use another variable to specify what channel to write the Slack message.
...
defineAction({
name: "githubToSlack",
title: "GitHub to Slack",
trigger: {
webhook: githubWebhook,
},
apps: ["slack"],
variables: ["channel"],
run: async ({ data, auths, variables }) => {
const pushPayload = GitHub.asPushPayload(data);
if (pushPayload) {
console.info("Got a push payload");
const slack = new Slack({ auth: auths.slack });
await slack.postMessage({
channel: variables.channel,
text: `Got push event on repo: ${pushPayload.repository.fullName}`,
});
console.info("Posted message to Slack");
}
},
});Now that we've reviewed both the webhook and the action, let's take a look at the terminal and see what happened on deploy.
VM: [INFO]: Starting deploy
VM: [INFO]: Deploying helloWorld, basicWebhook, helloSlack, githubWebhook, githubToSlack
VM: [INFO]: Deploy succeeded
CLI: [INFO]: Skipping subscribe for webhooks that need configuration: githubWebhookLooks like we need to do some configuration!
Configure the webhook
Go to the Webhooks menu (opens in a new tab) and click on the new GitHub Webhook
Notice that the GitHub app needs to be authorized. Click on the GitHub app...
...and then click Authorize to begin the OAuth2 flow.
When you are back, you should see that GitHub is authorized and that you can share the auth with the production environment. Go ahead and do that.
Now go back to the webhook.
To finish configuring the webhook, we need to enter an owner and repo name. You should choose an existing repo that you don't mind pushing a commit to.
Once you have filled in a valid owner/repo, take a look at the Subscription tab...
...and see if the subscription worked.
Subscribed to GitHub webhook
Configure the action
Now go to the Actions menu and click on the GitHub to Slack action.
You can see that Slack is already authorized since we did that earlier in this tutorial. So you just need to enter a Slack channel you want to post messages to.
Push to the repo and see the result
And now, the moment of truth. Drumroll please....
Make a change to your repo, commit the change, and push it. Then, let's go to the Runs tab to see what happened.
If everything went smoothly, you should see a single run like this.
Running action githubToSlack
Got a push payload
Posted message to Slack