Add GitHub provider

components/sesyon/koneksyon.js

@@ -43,6 +43,12 @@ const PROVIDERS = [
     title: 'Twitter',
     width: 56,
     height: 46
+  },
+  {
+    id: 'github',
+    title: 'GitHub',
+    width: 52,
+    height: 51
   }
 ]
 

components/sesyon/login-provider.js

@@ -2,8 +2,11 @@ import PropTypes from 'prop-types'
 import Link from 'next/link'
 import Image from 'next/image'
 import {signIn} from 'next-auth/react'
+import {useTheme} from '@mui/material/styles'
 
 export default function LoginProvider({id, title, width, height, callbackUrl}) {
+  const theme = useTheme()
+
   const hanleClick = event => {
     event.preventDefault()
     signIn(id, {
@@ -18,7 +21,7 @@ export default function LoginProvider({id, title, width, height, callbackUrl}) {
         width={width}
         height={height}
         alt={title}
-        src={`/images/${id}.svg`}
+        src={`/images/${id === 'github' ? `${id}-${theme.palette.mode}` : id}.svg`}
         onClick={hanleClick}
       />
     </Link>

package.json

@@ -73,6 +73,7 @@
             "CredentialsProvider",
             "TwitterProvider",
             "GoogleProvider",
+            "GitHubProvider",
             "NextAuth"
           ]
         }

pages/api/auth/[...nextauth].js

@@ -2,6 +2,7 @@ import NextAuth from 'next-auth'
 import CredentialsProvider from 'next-auth/providers/credentials'
 import TwitterProvider from 'next-auth/providers/twitter'
 import GoogleProvider from 'next-auth/providers/google'
+import GitHubProvider from 'next-auth/providers/github'
 import axios from 'axios'
 
 const options = {
@@ -36,6 +37,10 @@ const options = {
     GoogleProvider({
       clientId: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID,
       clientSecret: process.env.NEXT_PUBLIC_GOOGLE_CLIENT_SECRET
+    }),
+    GitHubProvider({
+      clientId: process.env.NEXT_PUBLIC_GITHUB_CLIENT_ID,
+      clientSecret: process.env.NEXT_PUBLIC_GITHUB_CLIENT_SECRET
     })
   ],
   secret: process.env.NEXT_PUBLIC_JWT_SECRET,
@@ -51,7 +56,7 @@ const options = {
           url = `${process.env.NEXT_PUBLIC_API_URL}/auth/${account.provider}/callback?access_token=${account?.oauth_token}&access_secret=${account?.oauth_token_secret}`
         }
 
-        if (account.provider === 'google') {
+        if (account.provider === 'google' || account.provider === 'github') {
           url = `${process.env.NEXT_PUBLIC_API_URL}/auth/${account.provider}/callback?access_token=${account?.access_token}`
         }