From 1263cb8260bfbf881bcb9929b963f6630183271e Mon Sep 17 00:00:00 2001
From: Gana016 <jayam.ganapathi12@gmail.com>
Date: Sun, 21 Feb 2021 20:59:18 +0530
Subject: [PATCH] Feat: google signin and github signin

implemented google and github

fixes #33
---
 digital-course-file/Capture.JPG        | Bin 0 -> 24525 bytes
 digital-course-file/package-lock.json  |  85 ++++++++++++++++++++++
 digital-course-file/package.json       |   3 +
 digital-course-file/src/App.css        |   5 ++
 digital-course-file/src/user/Login.js  |  84 +++++++++++++++-------
 digital-course-file/src/user/Signin.js |  93 ++++++++++++++++++++-----
 6 files changed, 227 insertions(+), 43 deletions(-)
 create mode 100644 digital-course-file/Capture.JPG

diff --git a/digital-course-file/Capture.JPG b/digital-course-file/Capture.JPG
new file mode 100644
index 0000000000000000000000000000000000000000..0178f1ef2087b67b3311d44faf2cc83f5aaf8afd
GIT binary patch
literal 24525
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
Rul)S;t~npu=AQq5695TOX~zHn

literal 0
HcmV?d00001

diff --git a/digital-course-file/package-lock.json b/digital-course-file/package-lock.json
index ad82d93..566586a 100644
--- a/digital-course-file/package-lock.json
+++ b/digital-course-file/package-lock.json
@@ -11,8 +11,11 @@
         "@testing-library/react": "^11.2.5",
         "@testing-library/user-event": "^12.7.1",
         "firebase": "^8.2.9",
+        "firebaseui": "^4.7.3",
         "react": "^17.0.1",
         "react-dom": "^17.0.1",
+        "react-github-login-button": "^1.0.1",
+        "react-google-button": "^0.7.2",
         "react-icons": "^4.2.0",
         "react-router-dom": "^5.2.0",
         "react-scripts": "4.0.2",
@@ -6934,6 +6937,11 @@
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
       "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
+    "node_modules/dialog-polyfill": {
+      "version": "0.4.10",
+      "resolved": "https://registry.npmjs.org/dialog-polyfill/-/dialog-polyfill-0.4.10.tgz",
+      "integrity": "sha512-j5yGMkP8T00UFgyO+78OxiN5vC5dzRQF3BEio+LhNvDbyfxWBsi3sfPArDm54VloaJwy2hm3erEiDWqHRC8rzw=="
+    },
     "node_modules/diff-sequences": {
       "version": "26.6.2",
       "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-26.6.2.tgz",
@@ -8858,6 +8866,18 @@
         "node": "^8.13.0 || >=10.10.0"
       }
     },
+    "node_modules/firebaseui": {
+      "version": "4.7.3",
+      "resolved": "https://registry.npmjs.org/firebaseui/-/firebaseui-4.7.3.tgz",
+      "integrity": "sha512-KKeZQS2fO2SrZFIsEmG6GrTm/+Na8Vk+OM9wnNgP8FtUw6h4S5oCPtebBREr9ETlDFvIK88gaHvp5bvF96yogA==",
+      "dependencies": {
+        "dialog-polyfill": "^0.4.7",
+        "material-design-lite": "^1.2.0"
+      },
+      "peerDependencies": {
+        "firebase": ">=8.2.4"
+      }
+    },
     "node_modules/flat-cache": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.0.4.tgz",
@@ -13290,6 +13310,14 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/material-design-lite": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/material-design-lite/-/material-design-lite-1.3.0.tgz",
+      "integrity": "sha1-0ATOP+6Zoe63Sni4oyUTSl8RcdM=",
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
     "node_modules/md5.js": {
       "version": "1.3.5",
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -16524,6 +16552,28 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.9.tgz",
       "integrity": "sha512-nQTTcUu+ATDbrSD1BZHr5kgSD4oF8OFjxun8uAaL8RwPBacGBNPf/yAuVVdx17N8XNzRDMrZ9XcKZHCjPW+9ew=="
     },
+    "node_modules/react-github-login-button": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/react-github-login-button/-/react-github-login-button-1.0.1.tgz",
+      "integrity": "sha512-HXtYwgy8EwR9i+W5HgP1d/Ndf28AXLgc2l7TQwDQfn3Tf6PeS7xD0vqF+xGAfvqKOx6rFWP5E5wpAaoC8wzirw==",
+      "dependencies": {
+        "prop-types": "^15.7.2"
+      },
+      "peerDependencies": {
+        "react": "*"
+      }
+    },
+    "node_modules/react-google-button": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/react-google-button/-/react-google-button-0.7.2.tgz",
+      "integrity": "sha512-LPIqU2hIlc212kqks8MtKjRstquVkP3SIjxlK5B1nIfg2R7YqSusJAxZUkJA5dv/z6QeSuGyI9ujwV/VWMTyAA==",
+      "dependencies": {
+        "prop-types": "^15.7.2"
+      },
+      "peerDependencies": {
+        "react": "*"
+      }
+    },
     "node_modules/react-icons": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.2.0.tgz",
@@ -27507,6 +27557,11 @@
         }
       }
     },
+    "dialog-polyfill": {
+      "version": "0.4.10",
+      "resolved": "https://registry.npmjs.org/dialog-polyfill/-/dialog-polyfill-0.4.10.tgz",
+      "integrity": "sha512-j5yGMkP8T00UFgyO+78OxiN5vC5dzRQF3BEio+LhNvDbyfxWBsi3sfPArDm54VloaJwy2hm3erEiDWqHRC8rzw=="
+    },
     "diff-sequences": {
       "version": "26.6.2",
       "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-26.6.2.tgz",
@@ -29015,6 +29070,15 @@
         "@firebase/util": "0.3.4"
       }
     },
+    "firebaseui": {
+      "version": "4.7.3",
+      "resolved": "https://registry.npmjs.org/firebaseui/-/firebaseui-4.7.3.tgz",
+      "integrity": "sha512-KKeZQS2fO2SrZFIsEmG6GrTm/+Na8Vk+OM9wnNgP8FtUw6h4S5oCPtebBREr9ETlDFvIK88gaHvp5bvF96yogA==",
+      "requires": {
+        "dialog-polyfill": "^0.4.7",
+        "material-design-lite": "^1.2.0"
+      }
+    },
     "flat-cache": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.0.4.tgz",
@@ -32380,6 +32444,11 @@
         "object-visit": "^1.0.0"
       }
     },
+    "material-design-lite": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/material-design-lite/-/material-design-lite-1.3.0.tgz",
+      "integrity": "sha1-0ATOP+6Zoe63Sni4oyUTSl8RcdM="
+    },
     "md5.js": {
       "version": "1.3.5",
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -34971,6 +35040,22 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.9.tgz",
       "integrity": "sha512-nQTTcUu+ATDbrSD1BZHr5kgSD4oF8OFjxun8uAaL8RwPBacGBNPf/yAuVVdx17N8XNzRDMrZ9XcKZHCjPW+9ew=="
     },
+    "react-github-login-button": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/react-github-login-button/-/react-github-login-button-1.0.1.tgz",
+      "integrity": "sha512-HXtYwgy8EwR9i+W5HgP1d/Ndf28AXLgc2l7TQwDQfn3Tf6PeS7xD0vqF+xGAfvqKOx6rFWP5E5wpAaoC8wzirw==",
+      "requires": {
+        "prop-types": "^15.7.2"
+      }
+    },
+    "react-google-button": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/react-google-button/-/react-google-button-0.7.2.tgz",
+      "integrity": "sha512-LPIqU2hIlc212kqks8MtKjRstquVkP3SIjxlK5B1nIfg2R7YqSusJAxZUkJA5dv/z6QeSuGyI9ujwV/VWMTyAA==",
+      "requires": {
+        "prop-types": "^15.7.2"
+      }
+    },
     "react-icons": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.2.0.tgz",
diff --git a/digital-course-file/package.json b/digital-course-file/package.json
index 466e1ca..3da98cb 100644
--- a/digital-course-file/package.json
+++ b/digital-course-file/package.json
@@ -7,8 +7,11 @@
     "@testing-library/react": "^11.2.5",
     "@testing-library/user-event": "^12.7.1",
     "firebase": "^8.2.9",
+    "firebaseui": "^4.7.3",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
+    "react-github-login-button": "^1.0.1",
+    "react-google-button": "^0.7.2",
     "react-icons": "^4.2.0",
     "react-router-dom": "^5.2.0",
     "react-scripts": "4.0.2",
diff --git a/digital-course-file/src/App.css b/digital-course-file/src/App.css
index 3b4fd8c..4b3da7d 100644
--- a/digital-course-file/src/App.css
+++ b/digital-course-file/src/App.css
@@ -123,3 +123,8 @@ button {
   padding: 8px 0;
   background: #3a2b58;
 }
+
+.Google {
+  padding-top: 10px;
+  text-align: center;
+}
diff --git a/digital-course-file/src/user/Login.js b/digital-course-file/src/user/Login.js
index 70361d0..579d82d 100644
--- a/digital-course-file/src/user/Login.js
+++ b/digital-course-file/src/user/Login.js
@@ -1,4 +1,6 @@
 import React from 'react'
+import GoogleButton from 'react-google-button'
+import GithubButton from 'react-github-login-button'
 
 const Login = (props) => {
   const {
@@ -12,36 +14,64 @@ const Login = (props) => {
     setHasAccount,
     emailError,
     passwordError,
+    googlesignin,
+    githubsignin,
   } = props
   return (
-  <section className='login'>
-      <div className="loginContainer">
-          <label>UserName</label>
-          <input type="text" autoFocus required value={email} onChange={(e)=>setEmail(e.target.value)}>
-          </input>
-          <p className="errorMsg">{emailError}</p>
-          <label>Password</label>
-          <input type="password" required value={password} onChange={(e)=>setPassword(e.target.value)}/>
-          <p className="errorMsg">{passwordError}</p>
-          <div className="btnContainer">
-              {hasAccount?(
-                  <>
-                  <button onClick={handleLogin}>
-                      Sign In
-                  </button>
-                  <p>Don't have an account ? <span onClick={()=>setHasAccount(!hasAccount)}>Sign up</span></p>
-                  </>
-              ):(
-                  <>
-                  <button onClick={handleSignup}>
-                      Sign up
-                  </button>
-                  <p>Have an account ? <span onClick={()=>setHasAccount(!hasAccount)}>Sign in</span></p>
-                  </>
-              )}
-          </div>
+    <section className='login'>
+      <div className='loginContainer'>
+        <label>UserName</label>
+        <input
+          type='text'
+          autoFocus
+          required
+          value={email}
+          onChange={(e) => setEmail(e.target.value)}
+        ></input>
+        <p className='errorMsg'>{emailError}</p>
+        <label>Password</label>
+        <input
+          type='password'
+          required
+          value={password}
+          onChange={(e) => setPassword(e.target.value)}
+        />
+        <p className='errorMsg'>{passwordError}</p>
+        <div className='btnContainer'>
+          {hasAccount ? (
+            <>
+              <button onClick={handleLogin}>Sign In</button>
+              <p>
+                Don't have an account ?{' '}
+                <span onClick={() => setHasAccount(!hasAccount)}>Sign up</span>
+              </p>
+              <p></p>
+              <GoogleButton onClick={googlesignin} />
+              <p></p>
+              
+              <GithubButton
+                onClick={githubsignin}
+              />
+            </>
+          ) : (
+            <>
+              <button onClick={handleSignup}>Sign up</button>
+              <p>
+                Have an account ?{' '}
+                <span onClick={() => setHasAccount(!hasAccount)}>Sign in</span>
+              </p>
+              <p></p>
+              <GoogleButton onClick={googlesignin} />
+              <p></p>
+              
+              <GithubButton
+                onClick={githubsignin}
+              />
+            </>
+          )}
+        </div>
       </div>
-  </section>
+    </section>
   )
 }
 export default Login
diff --git a/digital-course-file/src/user/Signin.js b/digital-course-file/src/user/Signin.js
index 78e6357..1cc6cbb 100644
--- a/digital-course-file/src/user/Signin.js
+++ b/digital-course-file/src/user/Signin.js
@@ -3,6 +3,7 @@ import '../App.css'
 import fire from '../fire'
 import Login from './Login'
 import Hero from './Hero'
+import firebase from 'firebase'
 
 const Signin = () => {
   const [user, setUser] = useState('')
@@ -12,6 +13,64 @@ const Signin = () => {
   const [passwordError, setPasswordError] = useState('')
   const [hasAccount, setHasAccount] = useState(false)
 
+  const githubsignin = () => {
+    var provider = new firebase.auth.GithubAuthProvider()
+    firebase
+      .auth()
+      .signInWithPopup(provider)
+      .then((result) => {
+        /** @type {firebase.auth.OAuthCredential} */
+        var credential = result.credential
+
+        // This gives you a GitHub Access Token. You can use it to access the GitHub API.
+        var token = credential.accessToken
+
+        // The signed-in user info.
+        setUser(result.user)
+        // ...
+      })
+      .catch((error) => {
+        // Handle Errors here.
+        var errorCode = error.code
+        var errorMessage = error.message
+        // The email of the user's account used.
+        var email = error.email
+        // The firebase.auth.AuthCredential type that was used.
+        var credential = error.credential
+        setEmailError(error.message)
+        // ...
+      })
+  }
+
+  const googlesignin = () => {
+    clearErrors()
+    var provider = new firebase.auth.GoogleAuthProvider()
+    firebase
+      .auth()
+      .signInWithPopup(provider)
+      .then((result) => {
+        /** @type {firebase.auth.OAuthCredential} */
+        var credential = result.credential
+
+        // This gives you a Google Access Token. You can use it to access the Google API.
+        var token = credential.accessToken
+        // The signed-in user info.
+        setUser(result.user)
+        // ...
+      })
+      .catch((error) => {
+        // Handle Errors here.
+        var errorCode = error.code
+        var errorMessage = error.message
+        // The email of the user's account used.
+        var email = error.email
+        // The firebase.auth.AuthCredential type that was used.
+        var credential = error.credential
+        setEmailError(error.message)
+        // ...
+      })
+  }
+
   const clearInputs = () => {
     setEmail('')
     setPassword('')
@@ -80,22 +139,24 @@ const Signin = () => {
 
   return (
     <div className='App'>
-        {user?(
-            <Hero handleLogout={handleLogout}/>
-        ):(
-            <Login
-        email={email}
-        setEmail={setEmail}
-        password={password}
-        setPassword={setPassword}
-        handleLogin={handleLogin}
-        handleSignup={handleSignup}
-        hasAccount={hasAccount}
-        setHasAccount={setHasAccount}
-        emailError={emailError}
-        passwordError={passwordError}
-      />
-        )}   
+      {user ? (
+        <Hero handleLogout={handleLogout} />
+      ) : (
+        <Login
+          email={email}
+          setEmail={setEmail}
+          password={password}
+          setPassword={setPassword}
+          handleLogin={handleLogin}
+          handleSignup={handleSignup}
+          hasAccount={hasAccount}
+          setHasAccount={setHasAccount}
+          emailError={emailError}
+          passwordError={passwordError}
+          googlesignin={googlesignin}
+          githubsignin={githubsignin}
+        />
+      )}
     </div>
   )
 }
-- 
GitLab