Oauth with google, twitter & github added

[Edasgh]

Closes: #352

• Title : The oauth buttons in login page doesn't work | Adding oauth in all the pages
• Name: Eshita Das
• Idenitfy yourself: GSSOC, Hacktoberfest contributor

Changes

Files Created:

1. src/functions/useGoogleOauth.js
2. src/functions/useGithubOauth.js
3. src/functions/useXTwitterOauth.js

Files Changed:
1.src/pages/auth/Login.jsx
2. src/pages/auth/SignUp.jsx
3. src/App.jsx

Changes I made:

1. Imported oauth handlers in both "Login.jsx" and "SignUp.jsx" files from the hooks in the files : "useGoogleOauth.js" , "useGithubOauth.js", "useXTwitterOauth.js" & those handlers save the user-info & authorization token in localStorage
2. Added GoogleOAuthProvider in App.jsx
3. Defined googleAuth hook to get the access code from google in "api.js"
4. Added useEffect hooks in both "Login.jsx" and "SignUp.jsx" files to fetch the twitter user details

Please define the env variables : VITE_GOOGLE_CLIENT_ID, VITE_GOOGLE_CLIENT_SECRET ,VITE_X_CLIENT_ID, VITE_X_CLIENT_SECRET, VITE_GITHUB_CLIENT_ID, VITE_GITHUB_CLIENT_SECRET in both backend & frontend else it may show errors

Type of change ☑️

• My code follows the code style of this project.
• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Code style update (formatting, local variables)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

Checklist: ☑️

• My code follows the code style of this project.
• My code follows the Contributing Guidelines & Code of Conduct of this project.
• This PR does not contain plagiarized content.
• I have performed a self-review of my own code.
• I have commented my code, particularly wherever it was hard to understand.
• My changes generate no new warnings.

Demo Video

https://www.loom.com/share/b4b5b067aa5c4b5a990448a8ce5ca0b0?sid=316b2cf0-4efb-4813-8c01-212965a2c7cf

[vercel]

@Edasgh is attempting to deploy a commit to the avdheshvarshney's projects Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

Thank you for submitting your pull request! We'll review it as soon as possible. For further communication, join our discord server https://discord.gg/tSqtvHUJzE.

[Edasgh]

@Avdhesh-Varshney please check this PR and let me know if this doesn't work

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
chanakya	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 11, 2024 10:08am