From 3908f558e5650a666a3e26b9082f37b9223e894e Mon Sep 17 00:00:00 2001 From: Matheus Albino Brunhara Date: Thu, 28 Apr 2022 18:31:16 -0500 Subject: [PATCH] =?UTF-8?q?Acrescentando=20estruturas=20e=20servi=C3=A7os?= =?UTF-8?q?=20para=20integra=C3=A7=C3=A3o=20com=20backend?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 3 +++ src/LocalStorage.ts | 18 +++++++++++++ src/config/api.config.ts | 19 ++++++++++++++ src/constants/routes/sessionRoutes.ts | 11 ++++++++ src/pages/login/Login.tsx | 37 +++++++++++++++------------ src/services/api.ts | 8 ++++++ src/services/session.ts | 33 ++++++++++++++++++++++++ 7 files changed, 113 insertions(+), 16 deletions(-) create mode 100644 src/LocalStorage.ts create mode 100644 src/config/api.config.ts create mode 100644 src/constants/routes/sessionRoutes.ts create mode 100644 src/services/api.ts create mode 100644 src/services/session.ts diff --git a/.gitignore b/.gitignore index e36333d..3d42112 100644 --- a/.gitignore +++ b/.gitignore @@ -26,3 +26,6 @@ yarn-error.log* # Optional eslint cache .eslintcache + +# não commitar url de environment +src/constants/environment.ts diff --git a/src/LocalStorage.ts b/src/LocalStorage.ts new file mode 100644 index 0000000..b7a450b --- /dev/null +++ b/src/LocalStorage.ts @@ -0,0 +1,18 @@ +const tokenId = 'token'; +const productDetails = '@productDetails'; + +const LocalStorage = { + getToken: (): string | null => { + return localStorage.getItem(tokenId) + }, + + setToken: (token: string) => { + localStorage.setItem(tokenId, token) + }, + + clearToken: () => { + localStorage.setItem(tokenId, ''); + } +} + +export default LocalStorage \ No newline at end of file diff --git a/src/config/api.config.ts b/src/config/api.config.ts new file mode 100644 index 0000000..a7790ce --- /dev/null +++ b/src/config/api.config.ts @@ -0,0 +1,19 @@ +import environment from "../constants/environment"; + +const getBaseUrl = (): string => { + // const { hostname } = window.location; + + const { url } = environment; + + let apiUrl = null; + + // if (hostname === 'projeto-integrado-f-web.herokuapp.com') { + // apiUrl = url.prod; + // } else { + apiUrl = url.local; + // } + + return apiUrl; +} + +export default { getBaseUrl }; \ No newline at end of file diff --git a/src/constants/routes/sessionRoutes.ts b/src/constants/routes/sessionRoutes.ts new file mode 100644 index 0000000..a33a439 --- /dev/null +++ b/src/constants/routes/sessionRoutes.ts @@ -0,0 +1,11 @@ +const sessionRoutesDefault = '/session'; +const sessionRoutes = { + create: { + url: `${sessionRoutesDefault}/` + }, + refresh: { + url: `${sessionRoutesDefault}/refresh` + } +} + +export default sessionRoutes; \ No newline at end of file diff --git a/src/pages/login/Login.tsx b/src/pages/login/Login.tsx index f958c36..4ab3161 100644 --- a/src/pages/login/Login.tsx +++ b/src/pages/login/Login.tsx @@ -20,6 +20,9 @@ import { IonAlert, } from "@ionic/react"; +import * as sessionRoutes from '../../services/session'; +import LocalStorage from "../../LocalStorage"; + function validateEmail(email: string) { const re = /^((?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\]))$/; @@ -33,7 +36,7 @@ const Page: React.FC = () => { const [isError, setIsError] = useState(false); const [message, setMessage] = useState(""); - const handleLogin = () => { + const handleLogin = async () => { // validação de inputs if (!email) { setMessage("Por favor, informe um e-mail válido"); @@ -53,26 +56,28 @@ const Page: React.FC = () => { return; } - const loginData = { + const singinForm = { email: email, password: password, }; - const api = axios.create({ - baseURL: `https://625dc16c4c36c7535779792c.mockapi.io/api/v1`, - }); + await sessionRoutes.create(singinForm).then(response => { + // if (!response) return - api - // .post("/login", loginData) - .get("/users/2") - .then((res) => { - // login bem-sucedido - history.push("/dashboard/" + email); - }) - .catch((error) => { - setMessage("Falha na autenticação! Por favor, crie uma conta"); - setIsError(true); - }); + const { token } = response + + LocalStorage.setToken(token); + + history.push({ pathname: '/home' }); + }).catch(error => { + // if (!error.response) return + + // se o backend retornou uma mensagem de erro customizada + // if (error.response.data.message) { + + console.dir('error: ', {error}) + alert('erro') + }) }; return ( diff --git a/src/services/api.ts b/src/services/api.ts new file mode 100644 index 0000000..909f183 --- /dev/null +++ b/src/services/api.ts @@ -0,0 +1,8 @@ +import axios from 'axios'; +import apiConfig from '../config/api.config'; + +const instance = axios.create({ + baseURL: apiConfig.getBaseUrl(), +}); + +export default instance; \ No newline at end of file diff --git a/src/services/session.ts b/src/services/session.ts new file mode 100644 index 0000000..7cd6717 --- /dev/null +++ b/src/services/session.ts @@ -0,0 +1,33 @@ +import instance from '../services/api'; +import sessionRoutes from '../constants/routes/sessionRoutes'; +import LocalStorage from '../LocalStorage'; +import { AxiosRequestHeaders } from 'axios'; + +let token: string | null; +let header: AxiosRequestHeaders; + +interface createData { + email: string, + password: string, +} + +function updateHeader() { + token = LocalStorage.getToken(); + header = { + Accept: 'application/json', + 'Content-Type': 'application/json', + "Authorization": 'Bearer ' + token + } +} + +export async function create(data: createData) { + const response = await instance.post(sessionRoutes.create.url, data); + return response.data; +} + +export async function refresh() { + updateHeader(); + + let response = await instance.post(sessionRoutes.refresh.url, { token }, { headers: header }); + return response.data; +} \ No newline at end of file