feat: linear social provider (#2617)

* feature: linear oauth

* update profile map

* remove props spread from stringIcon

* update icon svg props

* updates

* update

---------

Co-authored-by: Kinfe123 <kinfishtech@gmail.com>

docs/components/builder/social-provider.tsx

@@ -202,6 +202,34 @@ export const socialProviders = {
 				<path fill="#EB4335" d="M130.55 50.479c24.514 0 41.05 10.589 50.479 19.438l36.844-35.974C195.245 12.91 165.798 0 130.55 0C79.49 0 35.393 29.301 13.925 71.947l42.211 32.783c10.59-31.477 39.891-54.251 74.414-54.251"></path>
 			</svg>`,
 	},
+	linear: {
+		Icon: (props: SVGProps<any>) => (
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				width="1em"
+				height="1em"
+				viewBox="0 0 24 24"
+				{...props}
+			>
+				<path
+					fill="currentColor"
+					d="M1.22541 61.5228c-.2225-.9485.90748-1.5459 1.59638-.857L39.3342 97.1782c.6889.6889.0915 1.8189-.857 1.5964C20.0515 94.4522 5.54779 79.9485 1.22541 61.5228ZM.00189135 46.8891c-.01764375.2833.08887215.5599.28957165.7606L52.3503 99.7085c.2007.2007.4773.3075.7606.2896 2.3692-.1476 4.6938-.46 6.9624-.9259.7645-.157 1.0301-1.0963.4782-1.6481L2.57595 39.4485c-.55186-.5519-1.49117-.2863-1.648174.4782-.465915 2.2686-.77832 4.5932-.92588465 6.9624ZM4.21093 29.7054c-.16649.3738-.08169.8106.20765 1.1l64.77602 64.776c.2894.2894.7262.3742 1.1.2077 1.7861-.7956 3.5171-1.6927 5.1855-2.684.5521-.328.6373-1.0867.1832-1.5407L8.43566 24.3367c-.45409-.4541-1.21271-.3689-1.54074.1832-.99132 1.6684-1.88843 3.3994-2.68399 5.1855ZM12.6587 18.074c-.3701-.3701-.393-.9637-.0443-1.3541C21.7795 6.45931 35.1114 0 49.9519 0 77.5927 0 100 22.4073 100 50.0481c0 14.8405-6.4593 28.1724-16.7199 37.3375-.3903.3487-.984.3258-1.3542-.0443L12.6587 18.074Z"
+				/>
+			</svg>
+		),
+		stringIcon: `<svg
+				xmlns="http://www.w3.org/2000/svg"
+				fill="none"
+				width="1em"
+				height="1em"
+				viewBox="0 0 24 24"
+			>
+				<path
+					fill="currentColor"
+					d="M1.22541 61.5228c-.2225-.9485.90748-1.5459 1.59638-.857L39.3342 97.1782c.6889.6889.0915 1.8189-.857 1.5964C20.0515 94.4522 5.54779 79.9485 1.22541 61.5228ZM.00189135 46.8891c-.01764375.2833.08887215.5599.28957165.7606L52.3503 99.7085c.2007.2007.4773.3075.7606.2896 2.3692-.1476 4.6938-.46 6.9624-.9259.7645-.157 1.0301-1.0963.4782-1.6481L2.57595 39.4485c-.55186-.5519-1.49117-.2863-1.648174.4782-.465915 2.2686-.77832 4.5932-.92588465 6.9624ZM4.21093 29.7054c-.16649.3738-.08169.8106.20765 1.1l64.77602 64.776c.2894.2894.7262.3742 1.1.2077 1.7861-.7956 3.5171-1.6927 5.1855-2.684.5521-.328.6373-1.0867.1832-1.5407L8.43566 24.3367c-.45409-.4541-1.21271-.3689-1.54074.1832-.99132 1.6684-1.88843 3.3994-2.68399 5.1855ZM12.6587 18.074c-.3701-.3701-.393-.9637-.0443-1.3541C21.7795 6.45931 35.1114 0 49.9519 0 77.5927 0 100 22.4073 100 50.0481c0 14.8405-6.4593 28.1724-16.7199 37.3375-.3903.3487-.984.3258-1.3542-.0443L12.6587 18.074Z"
+				/>
+			</svg>`,
+	},
 	linkedin: {
 		Icon: (props: SVGProps<any>) => (
 			<svg

docs/components/sidebar-content.tsx

@@ -638,6 +638,24 @@ export const contents: Content[] = [
 					</svg>
 				),
 			},
+			{
+				title: "Linear",
+				href: "/docs/authentication/linear",
+				icon: () => (
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						fill="none"
+						width="1.2em"
+						height="1.2em"
+						viewBox="0 0 100 100"
+					>
+						<path
+							fill="currentColor"
+							d="M1.22541 61.5228c-.2225-.9485.90748-1.5459 1.59638-.857L39.3342 97.1782c.6889.6889.0915 1.8189-.857 1.5964C20.0515 94.4522 5.54779 79.9485 1.22541 61.5228ZM.00189135 46.8891c-.01764375.2833.08887215.5599.28957165.7606L52.3503 99.7085c.2007.2007.4773.3075.7606.2896 2.3692-.1476 4.6938-.46 6.9624-.9259.7645-.157 1.0301-1.0963.4782-1.6481L2.57595 39.4485c-.55186-.5519-1.49117-.2863-1.648174.4782-.465915 2.2686-.77832 4.5932-.92588465 6.9624ZM4.21093 29.7054c-.16649.3738-.08169.8106.20765 1.1l64.77602 64.776c.2894.2894.7262.3742 1.1.2077 1.7861-.7956 3.5171-1.6927 5.1855-2.684.5521-.328.6373-1.0867.1832-1.5407L8.43566 24.3367c-.45409-.4541-1.21271-.3689-1.54074.1832-.99132 1.6684-1.88843 3.3994-2.68399 5.1855ZM12.6587 18.074c-.3701-.3701-.393-.9637-.0443-1.3541C21.7795 6.45931 35.1114 0 49.9519 0 77.5927 0 100 22.4073 100 50.0481c0 14.8405-6.4593 28.1724-16.7199 37.3375-.3903.3487-.984.3258-1.3542-.0443L12.6587 18.074Z"
+						/>
+					</svg>
+				),
+			},
 			{
 				title: "LinkedIn",
 				href: "/docs/authentication/linkedin",

docs/content/docs/authentication/linear.mdx

@@ -0,0 +1,75 @@
+---
+title: Linear
+description: Linear provider setup and usage.
+---
+
+<Steps>
+    <Step> 
+        ### Get your Linear credentials
+        To use Linear sign in, you need a client ID and client secret. You can get them from the [Linear Developer Portal](https://linear.app/settings/api).
+
+        Make sure to set the redirect URL to `http://localhost:3000/api/auth/callback/linear` for local development. For production, you should set it to the URL of your application. If you change the base path of the auth routes, you should update the redirect URL accordingly.
+
+        When creating your OAuth application in Linear, you'll need to specify the required scopes. The default scope is `read`, but you can also request additional scopes like `write` if needed.
+    </Step>
+
+    <Step>
+        ### Configure the provider
+        To configure the provider, you need to import the provider and pass it to the `socialProviders` option of the auth instance.
+
+        ```ts title="auth.ts"
+        import { betterAuth } from "better-auth"
+        
+        export const auth = betterAuth({
+            socialProviders: {
+                linear: { // [!code highlight]
+                    clientId: process.env.LINEAR_CLIENT_ID as string, // [!code highlight]
+                    clientSecret: process.env.LINEAR_CLIENT_SECRET as string, // [!code highlight]
+                }, // [!code highlight]
+            },
+        })
+        ```
+    </Step>
+
+    <Step>
+        ### Sign In with Linear
+        To sign in with Linear, you can use the `signIn.social` function provided by the client. The `signIn` function takes an object with the following properties:
+        - `provider`: The provider to use. It should be set to `linear`.
+
+        ```ts title="auth-client.ts"  
+        import { createAuthClient } from "better-auth/client"
+        const authClient = createAuthClient()
+        
+        const signIn = async () => {
+            const data = await authClient.signIn.social({
+                provider: "linear"
+            })
+        }
+        ```
+    </Step>
+
+    <Step>
+        ### Available scopes
+        Linear OAuth supports the following scopes:
+        - `read` (default): Read access for the user's account
+        - `write`: Write access for the user's account
+        - `issues:create`: Allows creating new issues and their attachments
+        - `comments:create`: Allows creating new issue comments
+        - `timeSchedule:write`: Allows creating and modifying time schedules
+        - `admin`: Full access to admin level endpoints (use with caution)
+
+        You can specify additional scopes when configuring the provider:
+
+        ```ts title="auth.ts"
+        export const auth = betterAuth({
+            socialProviders: {
+                linear: {
+                    clientId: process.env.LINEAR_CLIENT_ID as string,
+                    clientSecret: process.env.LINEAR_CLIENT_SECRET as string,
+                    scope: ["read", "write"] // [!code highlight]
+                },
+            },
+        })
+        ```
+    </Step>
+</Steps>

packages/better-auth/src/social-providers/index.ts

@@ -10,6 +10,7 @@ import { spotify } from "./spotify";
 import { twitch } from "./twitch";
 import { twitter } from "./twitter";
 import { dropbox } from "./dropbox";
+import { linear } from "./linear";
 import { linkedin } from "./linkedin";
 import { gitlab } from "./gitlab";
 import { tiktok } from "./tiktok";
@@ -32,6 +33,7 @@ export const socialProviders = {
 	twitter,
 	dropbox,
 	kick,
+	linear,
 	linkedin,
 	gitlab,
 	tiktok,
@@ -70,6 +72,7 @@ export * from "./twitch";
 export * from "./facebook";
 export * from "./twitter";
 export * from "./dropbox";
+export * from "./linear";
 export * from "./linkedin";
 export * from "./gitlab";
 export * from "./tiktok";

packages/better-auth/src/social-providers/linear.ts

@@ -0,0 +1,118 @@
+import { betterFetch } from "@better-fetch/fetch";
+import type { OAuthProvider, ProviderOptions } from "../oauth2";
+import {
+	createAuthorizationURL,
+	refreshAccessToken,
+	validateAuthorizationCode,
+} from "../oauth2";
+
+interface LinearUser {
+	id: string;
+	name: string;
+	email: string;
+	avatarUrl?: string;
+	active: boolean;
+	createdAt: string;
+	updatedAt: string;
+}
+
+export interface LinearProfile {
+	data: {
+		viewer: LinearUser;
+	};
+}
+
+export interface LinearOptions extends ProviderOptions<LinearUser> {}
+
+export const linear = (options: LinearOptions) => {
+	const tokenEndpoint = "https://api.linear.app/oauth/token";
+	return {
+		id: "linear",
+		name: "Linear",
+		createAuthorizationURL({ state, scopes, loginHint, redirectURI }) {
+			const _scopes = options.disableDefaultScope ? [] : ["read"];
+			options.scope && _scopes.push(...options.scope);
+			scopes && _scopes.push(...scopes);
+			return createAuthorizationURL({
+				id: "linear",
+				options,
+				authorizationEndpoint: "https://linear.app/oauth/authorize",
+				scopes: _scopes,
+				state,
+				redirectURI,
+				loginHint,
+			});
+		},
+		validateAuthorizationCode: async ({ code, redirectURI }) => {
+			return validateAuthorizationCode({
+				code,
+				redirectURI,
+				options,
+				tokenEndpoint,
+			});
+		},
+		refreshAccessToken: options.refreshAccessToken
+			? options.refreshAccessToken
+			: async (refreshToken) => {
+					return refreshAccessToken({
+						refreshToken,
+						options: {
+							clientId: options.clientId,
+							clientKey: options.clientKey,
+							clientSecret: options.clientSecret,
+						},
+						tokenEndpoint,
+					});
+				},
+		async getUserInfo(token) {
+			if (options.getUserInfo) {
+				return options.getUserInfo(token);
+			}
+
+			const { data: profile, error } = await betterFetch<LinearProfile>(
+				"https://api.linear.app/graphql",
+				{
+					method: "POST",
+					headers: {
+						"Content-Type": "application/json",
+						Authorization: `Bearer ${token.accessToken}`,
+					},
+					body: JSON.stringify({
+						query: `
+							query {
+								viewer {
+									id
+									name
+									email
+									avatarUrl
+									active
+									createdAt
+									updatedAt
+								}
+							}
+						`,
+					}),
+				},
+			);
+			if (error || !profile?.data?.viewer) {
+				return null;
+			}
+
+			const userData = profile.data.viewer;
+			const userMap = await options.mapProfileToUser?.(userData);
+
+			return {
+				user: {
+					id: profile.data.viewer.id,
+					name: profile.data.viewer.name,
+					email: profile.data.viewer.email,
+					image: profile.data.viewer.avatarUrl,
+					emailVerified: true,
+					...userMap,
+				},
+				data: userData,
+			};
+		},
+		options,
+	} satisfies OAuthProvider<LinearUser>;
+};