feat(providers): Click up provider (#8489)

* feat: click up provider created

* docs: ClickUp documentation

* Format

---------

Co-authored-by: Antonio Basile <antoniobasile2@eng.it>
Co-authored-by: Thang Vu <hi@thvu.dev>

.github/ISSUE_TEMPLATE/2_bug_provider.yml

@@ -36,6 +36,7 @@ body:
         - "Beyond Identity"
         - "Box"
         - "Bungie"
+        - "ClickUp"
         - "Cognito"
         - "Coinbase"
         - "Descope"

apps/dev/nextjs/.env.local.example

@@ -59,6 +59,10 @@ WIKIMEDIA_SECRET=
 YANDEX_ID=
 YANDEX_SECRET=
 
+# ClickUp OAuth. https://clickup.com/api/
+CLICK_UP_ID=
+CLICK_UP_SECRET=
+
 # Example configuration for a Gmail account (will need SMTP enabled)
 EMAIL_SERVER=smtps://user@gmail.com:password@smtp.gmail.com:465
 EMAIL_FROM=user@gmail.com

apps/dev/nextjs/pages/api/auth/[...nextauth].ts

@@ -39,7 +39,7 @@ import Yandex from "@auth/core/providers/yandex"
 import Vk from "@auth/core/providers/vk"
 import Wikimedia from "@auth/core/providers/wikimedia"
 import WorkOS from "@auth/core/providers/workos"
-
+import ClickUp from '@auth/core/providers/click-up'
 // // Prisma
 // import { PrismaClient } from "@prisma/client"
 // import { PrismaAdapter } from "@auth/prisma-adapter"
@@ -131,6 +131,7 @@ export const authConfig: AuthConfig = {
     Vk({ clientId: process.env.VK_ID, clientSecret: process.env.VK_SECRET }),
     Wikimedia({ clientId: process.env.WIKIMEDIA_ID, clientSecret: process.env.WIKIMEDIA_SECRET }),
     WorkOS({ clientId: process.env.WORKOS_ID, clientSecret: process.env.WORKOS_SECRET }),
+    ClickUp({ clientId: process.env.CLICK_UP_ID, clientSecret: process.env.CLICK_UP_SECRET })
   ],
   // debug: process.env.NODE_ENV !== "production",
 }

packages/core/src/providers/click-up.ts

@@ -0,0 +1,103 @@
+/**
+ * <div style={{backgroundColor: "#24292f", display: "flex", justifyContent: "space-between", color: "#fff", padding: 16}}>
+ * <span>Built-in <b>ClickUp</b> integration.</span>
+ * <a href="https://clickup.com">
+ *   <img style={{display: "block"}} src="https://authjs.dev/img/providers/click-up.svg" height="48" width="48"/>
+ * </a>
+ * </div>
+ *
+ * @module providers/ClickUp
+ */
+
+import type { OAuthConfig, OAuthUserConfig } from "./index.js"
+
+/** @see [Get the authenticated user](https://clickup.com/api/clickupreference/operation/GetAuthorizedUser/)*/
+export interface ClickUpProfile {
+  user: {
+    id: number
+    username: string
+    color: string
+    profilePicture: string
+  }
+}
+
+/**
+ * Add ClickUp login to your page and make requests to [ClickUp APIs](https://clickup.com/api/).
+ *
+ * ### Setup
+ *
+ * #### Callback URL
+ * ```
+ * https://example.com/api/auth/callback/clickup
+ * ```
+ *
+ * #### Configuration
+ * ```ts
+ * import { Auth } from "@auth/core"
+ * import ClickUp from "@auth/core/providers/click-up"
+ *
+ * const request = new Request(origin)
+ * const response = await Auth(request, {
+ *   providers: [ClickUp({ clientId: CLICKUP_CLIENT_ID, clientSecret: CLICKUP_CLIENT_SECRET })],
+ * })
+ * ```
+ *
+ * ### Resources
+ *
+ * - [ClickUp - Authorizing OAuth Apps](https://clickup.com/api/developer-portal/authentication#oauth-flow)
+ * - [Source code](https://github.com/nextauthjs/next-auth/blob/main/packages/core/src/providers/click-up.ts)
+ *
+ * ### Notes
+ *
+ * By default, Auth.js assumes that the ClickUp provider is
+ * based on the [OAuth 2](https://www.rfc-editor.org/rfc/rfc6749.html) specification.
+ *
+ * :::tip
+ *
+ * The ClickUp provider comes with a [default configuration](https://github.com/nextauthjs/next-auth/blob/main/packages/core/src/providers/click-up.ts).
+ * To override the defaults for your use case, check out [customizing a built-in OAuth provider](https://authjs.dev/guides/providers/custom-provider#override-default-options).
+ *
+ * :::
+ *
+ * :::info **Disclaimer**
+ *
+ * If you think you found a bug in the default configuration, you can [open an issue](https://authjs.dev/new/provider-issue).
+ *
+ * Auth.js strictly adheres to the specification and it cannot take responsibility for any deviation from
+ * the spec by the provider. You can open an issue, but if the problem is non-compliance with the spec,
+ * we might not pursue a resolution. You can ask for more help in [Discussions](https://authjs.dev/new/github-discussions).
+ *
+ * :::
+ */
+export default function ClickUp(
+  config: OAuthUserConfig<ClickUpProfile>
+): OAuthConfig<ClickUpProfile> {
+  return {
+    id: "clickup",
+    name: "ClickUp",
+    type: "oauth",
+    authorization: "https://app.clickup.com/api",
+    token: "https://api.clickup.com/api/v2/oauth/token",
+    userinfo: "https://api.clickup.com/api/v2/user",
+    clientId: config.clientId,
+    clientSecret: config.clientSecret,
+    checks: ["state"],
+    profile: (profile: ClickUpProfile) => {
+      return {
+        id: profile.user.id.toString(),
+        name: profile.user.username,
+        profilePicture: profile.user.profilePicture,
+        color: profile.user.color,
+      }
+    },
+    style: {
+      logo: "/click-up.svg",
+      logoDark: "/click-up.svg",
+      bg: "#fff",
+      bgDark: "#24292f",
+      text: "#000",
+      textDark: "#fff",
+    },
+    options: config,
+  }
+}