add FE service to post to auth/guest
This commit is contained in:
parent
2f1174c21b
commit
1e6050a486
4 changed files with 115 additions and 59 deletions
34
packages/play-node-go/src/components/Button/Guest/Guest.js
Normal file
34
packages/play-node-go/src/components/Button/Guest/Guest.js
Normal file
|
@ -0,0 +1,34 @@
|
|||
import React from "react";
|
||||
import authServices from "../../../services/authServices";
|
||||
|
||||
const Guest = ({ dispatch }) => {
|
||||
const handleClick = async (e) => {
|
||||
e.preventDefault();
|
||||
// dispatch to guest endpoint
|
||||
const guestResponse = await authServices.guestService();
|
||||
|
||||
if (guestResponse.errors) {
|
||||
const authError = guestResponse.errors[0].auth;
|
||||
return dispatch({
|
||||
type: "ERR",
|
||||
message: "AUTH_ERROR",
|
||||
body: { authError },
|
||||
});
|
||||
}
|
||||
|
||||
return dispatch({
|
||||
type: "AUTH",
|
||||
message: "GUEST",
|
||||
body: guestResponse,
|
||||
});
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<button className="nav__section__button" onClick={handleClick}>
|
||||
Continue As Guest
|
||||
</button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default Guest;
|
|
@ -1,45 +1,49 @@
|
|||
import React, { useState } from 'react';
|
||||
import React, { useState } from "react";
|
||||
|
||||
import Login from '../Login/Login';
|
||||
import Signup from '../Signup/Signup';
|
||||
import Login from "../Login/Login";
|
||||
import Signup from "../Signup/Signup";
|
||||
import Guest from "../../Button/Guest/Guest";
|
||||
|
||||
const Auth = (props) => {
|
||||
const [ showForm, setShowForm ] = useState('login')
|
||||
const [showForm, setShowForm] = useState("login");
|
||||
const { state, dispatch } = props;
|
||||
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
className="nav__section nav__section--auth"
|
||||
onClick={()=>{setShowForm('login')}}
|
||||
onClick={() => {
|
||||
setShowForm("login");
|
||||
}}
|
||||
>
|
||||
<p
|
||||
className="nav__section__label"
|
||||
>Login</p>
|
||||
<p className="nav__section__label">Login</p>
|
||||
|
||||
{
|
||||
showForm === 'login'
|
||||
? <Login dispatch={dispatch} state={state}/>
|
||||
: <></>
|
||||
}
|
||||
{showForm === "login" ? (
|
||||
<Login dispatch={dispatch} state={state} />
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="nav__section nav__section--auth"
|
||||
onClick={()=>{setShowForm('signup')}}
|
||||
onClick={() => {
|
||||
setShowForm("signup");
|
||||
}}
|
||||
>
|
||||
<p
|
||||
className="nav__section__label"
|
||||
>Signup</p>
|
||||
<p className="nav__section__label">Signup</p>
|
||||
|
||||
{
|
||||
showForm === 'signup'
|
||||
? <Signup dispatch={dispatch} state={state}/>
|
||||
: <></>
|
||||
}
|
||||
{showForm === "signup" ? (
|
||||
<Signup dispatch={dispatch} state={state} />
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</div>
|
||||
<div className="nav__section nav__section--auth">
|
||||
<Guest dispatch={dispatch} />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
export default Auth;
|
||||
|
|
|
@ -1,20 +1,23 @@
|
|||
export const authReducer = (state, action) => {
|
||||
switch (action.message) {
|
||||
case 'LOGIN':
|
||||
case "LOGIN":
|
||||
return loginReducer(state, action);
|
||||
|
||||
case 'SIGNUP':
|
||||
case "SIGNUP":
|
||||
return loginReducer(state, action);
|
||||
|
||||
case 'LOGOUT':
|
||||
case "GUEST":
|
||||
return loginReducer(state, action);
|
||||
|
||||
case "LOGOUT":
|
||||
return state;
|
||||
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
function loginReducer(state, action) {
|
||||
const newUser = action.body;
|
||||
return {...state, user: newUser };
|
||||
return { ...state, user: newUser };
|
||||
}
|
|
@ -1,43 +1,58 @@
|
|||
import config from '../config';
|
||||
import config from "../config";
|
||||
|
||||
const authEndpoint = config.authAddress;
|
||||
const signupEndpoint = `${authEndpoint}/signup`
|
||||
const loginEndpoint = `${authEndpoint}/login`
|
||||
const signupEndpoint = `${authEndpoint}/signup`;
|
||||
const loginEndpoint = `${authEndpoint}/login`;
|
||||
const guestEndpoint = `${authEndpoint}/guest`;
|
||||
|
||||
var headers = new Headers();
|
||||
headers.append('Content-Type', 'application/json');
|
||||
headers.append('Accept', 'application/json');
|
||||
headers.append('Sec-Fetch-Site', 'cross-site')
|
||||
headers.append("Content-Type", "application/json");
|
||||
headers.append("Accept", "application/json");
|
||||
headers.append("Sec-Fetch-Site", "cross-site");
|
||||
|
||||
const loginService = async(formData) => {
|
||||
const loginService = async (formData) => {
|
||||
const response = await fetch(loginEndpoint, {
|
||||
method: 'POST',
|
||||
credentials: 'include',
|
||||
method: "POST",
|
||||
credentials: "include",
|
||||
body: JSON.stringify(formData),
|
||||
headers: headers
|
||||
headers: headers,
|
||||
})
|
||||
.then(res => res.text())
|
||||
.then(text => JSON.parse(text))
|
||||
.catch(err => err);
|
||||
.then((res) => res.text())
|
||||
.then((text) => JSON.parse(text))
|
||||
.catch((err) => err);
|
||||
|
||||
return response;
|
||||
}
|
||||
};
|
||||
|
||||
const signupService = async (formData) => {
|
||||
const response = await fetch(signupEndpoint, {
|
||||
method: 'POST',
|
||||
credentials: 'include',
|
||||
method: "POST",
|
||||
credentials: "include",
|
||||
body: JSON.stringify(formData),
|
||||
headers: headers
|
||||
headers: headers,
|
||||
})
|
||||
.then(res => res.text())
|
||||
.then(text => JSON.parse(text))
|
||||
.catch(err => err);
|
||||
.then((res) => res.text())
|
||||
.then((text) => JSON.parse(text))
|
||||
.catch((err) => err);
|
||||
|
||||
return response;
|
||||
}
|
||||
};
|
||||
|
||||
const guestService = async () => {
|
||||
const response = await fetch(guestEndpoint, {
|
||||
method: "POST",
|
||||
credentials: "include",
|
||||
headers,
|
||||
})
|
||||
.then((res) => res.text())
|
||||
.then((text) => JSON.parse(text))
|
||||
.catch((err) => err);
|
||||
|
||||
return response;
|
||||
};
|
||||
|
||||
export default {
|
||||
loginService,
|
||||
signupService
|
||||
}
|
||||
signupService,
|
||||
guestService,
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue