Login google funcionando

williamdlm · Oct 22, 2021 · 37fca60 · 37fca60
1 parent ce289e7
commit 37fca60
Show file tree

Hide file tree

Showing 11 changed files with 41 additions and 77 deletions.
diff --git a/pages/api/db.js b/pages/api/db.js
diff --git a/pages/index.js b/pages/index.js
@@ -10,6 +10,7 @@ import React, { useContext, useEffect, useState } from "react";
 import GoogleLogIn from "../src/components/GoogleLogIn";
 import Facebook from "../src/components/Facebook";
 import ModalComplete from "../src/components/Modal";
+import { ContainerLogin } from "../src/components/ContainerLogin";
 
 export default function Home(props) {
  const [screenState, setScreenState] = React.useState(props.isLogged);
@@ -57,10 +58,10 @@ export default function Home(props) {
  <LogOnScreen />
  )} */}
  {screenState !== 1 && (
- <>
+ <ContainerLogin>
  <GoogleLogIn handleStatusLogged={handleStatusLogged} />
  <Facebook handleStatusLogged={handleStatusLogged} />
- </>
+ </ContainerLogin>
  )}
  {screenState === 1 && (
  <>

diff --git a/pages/quiz.js b/pages/quiz.js
@@ -19,8 +19,6 @@ import {
 function ResultWidget({ results }) {
  const router = useRouter();
 
- // setCurrentExperience(amountExp);
- // console.log(`AmountExp: ${amountExp}`);
  return (
  <Widget style={{ margin: "0 auto" }}>
  <Widget.Header>RESULTADO</Widget.Header>
@@ -112,7 +110,6 @@ function QuestionWidget({
  const { completeQuestion } = useContext(ExperienceContext);
  const { handlePointsStats } = useContext(ExperienceContext);
  const { handleRounds } = useContext(ExperienceContext);
- // console.log(question.type);
  React.useEffect(() => {
  handleRounds();
  }, []);
@@ -144,9 +141,6 @@ function QuestionWidget({
  onSubmit={(event) => {
  event.preventDefault();
  setIsClicked(false);
- {
- console.log(event.type);
- }
  setIsQuestionSubmited(true);
  addResult(isCorrect);
  setTimeout(() => {

diff --git a/public/icons/lock.png b/public/icons/lock.png
diff --git a/public/icons/scroll.png b/public/icons/scroll.png
diff --git a/public/icons/scroll.svg b/public/icons/scroll.svg
diff --git a/public/icons/swords (1).png b/public/icons/swords (1).png
diff --git a/public/icons/swords.svg b/public/icons/swords.svg
diff --git a/src/components/ContainerLogin/index.js b/src/components/ContainerLogin/index.js
@@ -0,0 +1,26 @@
+import styled from "styled-components";
+
+export const ContainerLogin = styled.div`
+ display: flex;
+ width: 100%;
+ height: 100%;
+ justify-content: center;
+ margin-top: 50vh;
+ flex-direction: column;
+
+ .googleBtn {
+ margin-bottom: 0.5rem;
+ }
+
+ .googleBtn span {
+ display: block;
+ margin-left: 10%;
+ text-transform: uppercase;
+ }
+ button {
+ margin-bottom: 3rem;
+ display: block;
+ margin: 0 auto;
+ width: 20rem;
+ }
+`;
diff --git a/src/components/Facebook/index.js b/src/components/Facebook/index.js
@@ -34,39 +34,12 @@ export default function Facebook({ handleStatusLogged }) {
  changePlayerName(response.name);
  };
 
- const FbContent = (
- <div
- style={{
- width: "400px",
- margin: "auto",
- background: "#f4f4f4",
- padding: "20px",
- }}
- >
- <img src={state.picture} alt={state.name} />
- <h2>Welcome {state.name}</h2>
- Email: {state.email}
- </div>
- );
-
  return (
- <>
- <div
- style={{
- width: "100%",
- height: "100%",
- display: "flex",
- justifyContent: "center",
- marginTop: "50vh",
- }}
- >
- <FacebookLogin
- appId="632902014369254"
- // autoLoad={true}
- fields="name,email,picture"
- callback={responseFacebook}
- />
- </div>
- </>
+ <FacebookLogin
+ appId="632902014369254"
+ // autoLoad={true}
+ fields="name,email,picture"
+ callback={responseFacebook}
+ />
  );
 }
diff --git a/src/components/GoogleLogIn/index.js b/src/components/GoogleLogIn/index.js
@@ -1,10 +1,10 @@
 import GoogleLogin from "react-google-login";
 import React, { useContext } from "react";
 import { ExperienceContext } from "../../contexts/ExperienceContext";
-import styled from "styled-components";
 
 export default function GoogleLogIn({ handleStatusLogged }) {
- const { handleIsLogged } = useContext(ExperienceContext);
+ const { handleIsLogged, changePlayerName, changePlayerImage } =
+ useContext(ExperienceContext);
  const changeStatus = () => {
  handleStatusLogged(1);
  };
@@ -14,29 +14,22 @@ export default function GoogleLogIn({ handleStatusLogged }) {
  } = response;
  handleIsLogged();
  changeStatus();
+ changePlayerImage(imageUrl);
+ changePlayerName(name);
  };
 
  const responseGoogleFailed = (response) => {
  console.log("falha resposta google");
  console.log(response);
  };
  return (
- // <div
- // style={{
- // width: "100%",
- // height: "100%",
- // display: "flex",
- // justifyContent: "center",
- // marginTop: "50vh",
- // }}
- // >
  <GoogleLogin
+ className="googleBtn"
  clientId="279991950987-fa92c6k1lffqtegplfqd9r1p8dos5kn6.apps.googleusercontent.com"
- buttonText="Login"
+ // buttonText="LOGIN WITH GOOGLE"
  onSuccess={responseGoogleSucess}
  onFailed={responseGoogleFailed}
  cookiePolicy={"single_host_origin"}
  />
- // </div>
  );
 }