Custom Connector – ClickUp API

Foreword, foreword, foreword. A foreword written by the author. Ok…I like to share things that I’ve learned in practice for a client, things that I think are interesting concepts, and things that I think will extend the Power Platform. I like to extend the Power Platform to users that aren’t in the tenant, to provide users and clients with tools that they are familiar with…Insert custom connector, Power Apps Portal, webhooks, MS forms, emails…yada…yada…yada, this could’ve turned into the song that doesn’t end, and yes it does go on and on my friend….

Today, we will focus on the extensibility via the Custom Connector utilizing a tool that I like to use because it has a free tier that is more than useful — ClickUp. In short I use ClickUp the way that someone would use MS Planner, Monday.com, Jira, and the like. I’ve also worked with clients that use it as a ticketing system.

Because I work with the Power Platform, I thought that it would be neat to merge these two swell technologies.

First things first…you will need a ClickUp account, if you don’t have one visit https://www.clickup.com and get signed up or if you have a trusting friend ask to use theirs…

Lets begin…

First open notepad, a text editor, or have a paper and pencil handy. Honestly, I’d go with the copy and paste electronic method because the things that you are going to copy and paste will be pretty long…fine…nix the paper and pencil.

Now…

Once you’ve signed into your ClickUp Dashboard copy the team id from the address bar and paste it into notepad

Next go to settings and click on Integrations

Click on ClickUp API

Create App

Enter the name of your app and the redirect uri then select Create App. I use the standard redirect uri that we get back from Power Platform when we create a connector global.consent.azure-apim.net. It’s perfectly fine if you use it too. I promise I don’t own it…no rights whatsoever.

Once you successfully create your app, you will be provided with a Client ID and Client Secret, please copy and paste these to notepad as well.

Now the fun begins, it really doesn’t take long to go through the next steps…maybe. If you do this right, you will create a custom connector to ClickUp.

Documentation is your best friend, fortunately for us, ClickUp has documentation on how to work with their API. In a new tab/window navigate to https://clickup.com/api to see the docs and different actions that are at your disposal.

The first thing that we will need to do is generate a code for if you used the redirect uri that I provided in the previous step copy and paste the following address into your address bar, you will need to add your Client ID to the address

https://app.clickup.com/api?client_id=client_id&redirect_uri=global.consent.azure-apim.net

After executing the previous step you will be prompted to connect to your workspace. If you’ve done everything right you will see the name of your app in the prompt. Select the workspace and click connect.

Once you select connect you will navigate to a new page. Please copy the code from the address bar and paste it into notepad.

Next we will generate our authorization code or API Key. You will need the Client ID, Client Secret, and the code from the previous step.

Return to https://clickup.com/api

• Select Authentication
• Get Access Token
• Switch to Console
• Insert
  • Client ID
  • Client Secret
  • Code
• Call Resources
• Scroll down to the response body and copy the authorization code then paste it to notepad

Next navigate to make.powerapps.com

• Select Data
• Select Custom Connectors
• New Custom Connector
• New From Blank

• Name your connector
• Click Continue

Next we will go through setting up general information for our connector. You can choose to upload an image for your connector or add a description – either not required. However, you will need to enter the host url and the base url.

The host url is api.clickup.com and in the base url input insert a forward slash /

Next we will set up the security for our connector and this is one of the easier steps.

The Authentication Type will be API Key, the value for Parameter Label and Parameter Name is “Authorization”, and the Location will be “Header”

Next we will create our connector definitions by navigating to the Definition tab.

Select New Action from the left pane.

In the General box the only required field is the operation id. I tend to name this something similar to whatever action is being performed.

Next we will want to select Import from sample in the Request box

For this tutorial, the action that we will be performing is getting all of the Workspaces in our team

Please select Get from the radio options.

Next enter the following url as is into the Url text input. We don’t want to hard code the team id into this we want to be able to access it from outside of the request by using curly brackets we create arguments that can be passed in from an app or flow.

https://api.clickup.com/api/v2/team/team_id/space

Finally select Import

Next select create connector to create the connector. Once the connector is created navigate to test here we will create our connection to the api.

Select New connection when prompted, enter the authorization code we created earlier, then create.

Once you click create you will be moved to the connections screen. if you’ve done it right you will see that you have a connection to the api.

Copy the JSON payload and navigate to the Definition tab. In the response area select Add default response > paste payload into the body > import.

Now that we have the basic knowledge of how to create a custom connector for the ClickUp, feel free to see what other actions you can create. At the time of this publication I have 15 actions that I am using in an app. In the weeks to come I will share this with you.

Thanks for spending time with me. You could’ve been anywhere else on the world wide web, but you’re here with me…I appreciate that.