Add GitHub redirect URI configuration and improve type safety

Author: kentcdodds

.env.example

@@ -15,6 +15,7 @@ INTERNAL_COMMAND_TOKEN="some-made-up-token"
 GITHUB_CLIENT_ID="MOCK_GITHUB_CLIENT_ID"
 GITHUB_CLIENT_SECRET="MOCK_GITHUB_CLIENT_SECRET"
 GITHUB_TOKEN="MOCK_GITHUB_TOKEN"
+GITHUB_REDIRECT_URI="https://example.com/auth/github/callback"
 
 # set this to false to prevent search engines from indexing the website
 # default to allow indexing for seo safety

app/utils/env.server.ts

@@ -15,6 +15,7 @@ const schema = z.object({
 	// If you plan to use GitHub auth, remove the default:
 	GITHUB_CLIENT_ID: z.string().default('MOCK_GITHUB_CLIENT_ID'),
 	GITHUB_CLIENT_SECRET: z.string().default('MOCK_GITHUB_CLIENT_SECRET'),
+	GITHUB_REDIRECT_URI: z.string().default('MOCK_GITHUB_REDIRECT_URI'),
 	GITHUB_TOKEN: z.string().default('MOCK_GITHUB_TOKEN'),
 	ALLOW_INDEXING: z.enum(['true', 'false']).optional(),
 

app/utils/providers/github.server.ts

@@ -24,27 +24,29 @@ const shouldMock =
 	process.env.GITHUB_CLIENT_ID?.startsWith('MOCK_') ||
 	process.env.NODE_ENV === 'test'
 
-type GitHubEmailsResponse = {
-	email: string
-	verified: boolean
-	primary: boolean
-	visibility: string | null
-}[]
+const GitHubEmailSchema = z.object({
+	email: z.string(),
+	verified: z.boolean(),
+	primary: z.boolean(),
+	visibility: z.string().nullable(),
+})
 
-type GitHubUserResponse = {
-	login: string
-	id: string
-	name: string | undefined
-	avatar_url: string | undefined
-}
+const GitHubEmailsResponseSchema = z.array(GitHubEmailSchema)
+
+const GitHubUserResponseSchema = z.object({
+	login: z.string(),
+	id: z.string(),
+	name: z.string().optional(),
+	avatar_url: z.string().optional(),
+})
 
 export class GitHubProvider implements AuthProvider {
 	getAuthStrategy() {
 		return new GitHubStrategy(
 			{
 				clientId: process.env.GITHUB_CLIENT_ID,
 				clientSecret: process.env.GITHUB_CLIENT_SECRET,
-				redirectURI: 'https://www.epicstack.dev/auth/github/callback',
+				redirectURI: process.env.GITHUB_REDIRECT_URI,
 			},
 			async ({ tokens }) => {
 				// we need to fetch the user and the emails separately, this is a change in remix-auth-github
@@ -56,7 +58,8 @@ export class GitHubProvider implements AuthProvider {
 						'X-GitHub-Api-Version': '2022-11-28',
 					},
 				})
-				const user = (await userResponse.json()) as GitHubUserResponse
+				const rawUser = await userResponse.json()
+				const user = GitHubUserResponseSchema.parse(rawUser)
 
 				const emailsResponse = await fetch(
 					'https://api.github.com/user/emails',
@@ -68,7 +71,8 @@ export class GitHubProvider implements AuthProvider {
 						},
 					},
 				)
-				const emails = (await emailsResponse.json()) as GitHubEmailsResponse
+				const rawEmails = await emailsResponse.json()
+				const emails = GitHubEmailsResponseSchema.parse(rawEmails)
 				const email = emails.find((e) => e.primary)?.email
 				if (!email) {
 					throw new Error('Email not found')