From 2998370ae9ce0daffbb1ad07aba0012800cb1f09 Mon Sep 17 00:00:00 2001 From: Johnny Wesley Date: Thu, 6 Apr 2023 01:38:05 -0300 Subject: [PATCH 01/14] Rotas Criadas --- package-lock.json | 50 ++++++++++++++++++++--------------------- package.json | 2 +- src/App.jsx | 17 +++++++++++--- src/Routes/NotFound.jsx | 21 +++++++++++++++++ src/index.jsx | 5 ++--- 5 files changed, 63 insertions(+), 32 deletions(-) create mode 100644 src/Routes/NotFound.jsx diff --git a/package-lock.json b/package-lock.json index 271e8eb..236a062 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,7 +15,7 @@ "bootstrap": "^5.2.2", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.4.1", + "react-router-dom": "^6.10.0", "react-scripts": "5.0.1", "web-vitals": "^2.1.4" }, @@ -3151,9 +3151,9 @@ } }, "node_modules/@remix-run/router": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.0.1.tgz", - "integrity": "sha512-eBV5rvW4dRFOU1eajN7FmYxjAIVz/mRHgUE9En9mBn6m3mulK3WTR5C3iQhL9MZ14rWAq+xOlEaCkDiW0/heOg==", + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz", + "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg==", "engines": { "node": ">=14" } @@ -14960,11 +14960,11 @@ } }, "node_modules/react-router": { - "version": "6.4.1", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.4.1.tgz", - "integrity": "sha512-OJASKp5AykDWFewgWUim1vlLr7yfD4vO/h+bSgcP/ix8Md+LMHuAjovA74MQfsfhQJGGN1nHRhwS5qQQbbBt3A==", + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz", + "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==", "dependencies": { - "@remix-run/router": "1.0.1" + "@remix-run/router": "1.5.0" }, "engines": { "node": ">=14" @@ -14974,12 +14974,12 @@ } }, "node_modules/react-router-dom": { - "version": "6.4.1", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.4.1.tgz", - "integrity": "sha512-MY7NJCrGNVJtGp8ODMOBHu20UaIkmwD2V3YsAOUQoCXFk7Ppdwf55RdcGyrSj+ycSL9Uiwrb3gTLYSnzcRoXww==", + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz", + "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==", "dependencies": { - "@remix-run/router": "1.0.1", - "react-router": "6.4.1" + "@remix-run/router": "1.5.0", + "react-router": "6.10.0" }, "engines": { "node": ">=14" @@ -20019,9 +20019,9 @@ "integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==" }, "@remix-run/router": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.0.1.tgz", - "integrity": "sha512-eBV5rvW4dRFOU1eajN7FmYxjAIVz/mRHgUE9En9mBn6m3mulK3WTR5C3iQhL9MZ14rWAq+xOlEaCkDiW0/heOg==" + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.5.0.tgz", + "integrity": "sha512-bkUDCp8o1MvFO+qxkODcbhSqRa6P2GXgrGZVpt0dCXNW2HCSCqYI0ZoAqEOSAjRWmmlKcYgFvN4B4S+zo/f8kg==" }, "@rollup/plugin-babel": { "version": "5.3.1", @@ -28408,20 +28408,20 @@ "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==" }, "react-router": { - "version": "6.4.1", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.4.1.tgz", - "integrity": "sha512-OJASKp5AykDWFewgWUim1vlLr7yfD4vO/h+bSgcP/ix8Md+LMHuAjovA74MQfsfhQJGGN1nHRhwS5qQQbbBt3A==", + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.10.0.tgz", + "integrity": "sha512-Nrg0BWpQqrC3ZFFkyewrflCud9dio9ME3ojHCF/WLsprJVzkq3q3UeEhMCAW1dobjeGbWgjNn/PVF6m46ANxXQ==", "requires": { - "@remix-run/router": "1.0.1" + "@remix-run/router": "1.5.0" } }, "react-router-dom": { - "version": "6.4.1", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.4.1.tgz", - "integrity": "sha512-MY7NJCrGNVJtGp8ODMOBHu20UaIkmwD2V3YsAOUQoCXFk7Ppdwf55RdcGyrSj+ycSL9Uiwrb3gTLYSnzcRoXww==", + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.10.0.tgz", + "integrity": "sha512-E5dfxRPuXKJqzwSe/qGcqdwa18QiWC6f3H3cWXM24qj4N0/beCIf/CWTipop2xm7mR0RCS99NnaqPNjHtrAzCg==", "requires": { - "@remix-run/router": "1.0.1", - "react-router": "6.4.1" + "@remix-run/router": "1.5.0", + "react-router": "6.10.0" } }, "react-scripts": { diff --git a/package.json b/package.json index 3b61e5f..8233c91 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "bootstrap": "^5.2.2", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.4.1", + "react-router-dom": "^6.10.0", "react-scripts": "5.0.1", "web-vitals": "^2.1.4" }, diff --git a/src/App.jsx b/src/App.jsx index de514e1..628ec64 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,17 +1,28 @@ - import { Outlet } from "react-router-dom"; import Footer from "./Components/Footer"; import Navbar from "./Components/Navbar"; - +import Home from "./Routes/Home"; +import Login from "./Routes/Login"; +import { BrowserRouter, Routes, Route } from "react-router-dom"; +import Detail from "./Routes/Detail"; +import NotFound from "./Routes/NotFound"; function App() { return ( <> {/* //Na linha seguinte deverá ser feito um teste se a aplicação // está em dark mode e deverá utilizar a classe dark ou light */} -
+
+ + + } /> + } /> + } /> + } /> + +
diff --git a/src/Routes/NotFound.jsx b/src/Routes/NotFound.jsx new file mode 100644 index 0000000..b4afce3 --- /dev/null +++ b/src/Routes/NotFound.jsx @@ -0,0 +1,21 @@ +import { useEffect } from "react"; + +const NotFound = () => { + + useEffect(() => { + //Nesse useEffect, deverá ser obtido todos os dentistas da API + //Armazena-los em um estado para posteriormente fazer um map + //Usando o componente + }, []); + + return ( + <> +

Página não encontrada

+
+

Tente outra rota.

+
+ + ); +}; + +export default NotFound; diff --git a/src/index.jsx b/src/index.jsx index b140d17..a86c3fd 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -6,13 +6,12 @@ import Navbar from "./Components/Navbar"; import Home from "./Routes/Home"; import Footer from "./Components/Footer"; import "./index.css"; +import App from "./App"; const root = ReactDOM.createRoot(document.getElementById("root")); //Lembre-se de configurar suas rotas e seu contexto aqui root.render( - - -
+ ); From ee66b7b97d2f609d92ed974cb971763c25e81e61 Mon Sep 17 00:00:00 2001 From: Jirayakbc Date: Fri, 7 Apr 2023 10:07:54 -0300 Subject: [PATCH 02/14] commit inicial branch --- src/App.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/App.jsx b/src/App.jsx index 628ec64..168a6e1 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -9,7 +9,7 @@ import NotFound from "./Routes/NotFound"; function App() { return ( <> - {/* //Na linha seguinte deverá ser feito um teste se a aplicação + {/* //Na linha seguinte deverá ser feito um teste se a aplicação teste // está em dark mode e deverá utilizar a classe dark ou light */}
From 1f833081a0fa0eaec5a07a4ed4678685e7baa505 Mon Sep 17 00:00:00 2001 From: Felipe Roberto Rocha <87021275+Jirayakbc@users.noreply.github.com> Date: Fri, 7 Apr 2023 11:06:07 -0300 Subject: [PATCH 03/14] =?UTF-8?q?inicio=20das=20configura=C3=A7=C3=B5es?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 56 +++++++++++++++++++++++++++++++++++++++++ package.json | 1 + src/App.jsx | 2 +- src/Components/Card.jsx | 6 ++--- src/Routes/Detail.jsx | 2 +- src/Routes/Home.jsx | 33 ++++++++++++++++++++++-- src/services/api.js | 7 ++++++ 7 files changed, 100 insertions(+), 7 deletions(-) create mode 100644 src/services/api.js diff --git a/package-lock.json b/package-lock.json index 236a062..c6790e4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,6 +12,7 @@ "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", + "axios": "^1.3.5", "bootstrap": "^5.2.2", "react": "^18.2.0", "react-dom": "^18.2.0", @@ -5081,6 +5082,29 @@ "node": ">=4" } }, + "node_modules/axios": { + "version": "1.3.5", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.3.5.tgz", + "integrity": "sha512-glL/PvG/E+xCWwV8S6nCHcrfg1exGx7vxyUIivIA1iL7BIh6bePylCfVHwp6k13ao7SATxB6imau2kqY+I67kw==", + "dependencies": { + "follow-redirects": "^1.15.0", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + } + }, + "node_modules/axios/node_modules/form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/axobject-query": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", @@ -14657,6 +14681,11 @@ "node": ">= 0.10" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "node_modules/psl": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", @@ -21463,6 +21492,28 @@ "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.4.3.tgz", "integrity": "sha512-32+ub6kkdhhWick/UjvEwRchgoetXqTK14INLqbGm5U2TzBkBNF3nQtLYm8ovxSkQWArjEQvftCKryjZaATu3w==" }, + "axios": { + "version": "1.3.5", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.3.5.tgz", + "integrity": "sha512-glL/PvG/E+xCWwV8S6nCHcrfg1exGx7vxyUIivIA1iL7BIh6bePylCfVHwp6k13ao7SATxB6imau2kqY+I67kw==", + "requires": { + "follow-redirects": "^1.15.0", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + }, + "dependencies": { + "form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "requires": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + } + } + } + }, "axobject-query": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz", @@ -28191,6 +28242,11 @@ } } }, + "proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "psl": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", diff --git a/package.json b/package.json index 8233c91..cbf5b1f 100644 --- a/package.json +++ b/package.json @@ -7,6 +7,7 @@ "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", + "axios": "^1.3.5", "bootstrap": "^5.2.2", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/src/App.jsx b/src/App.jsx index 168a6e1..628ec64 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -9,7 +9,7 @@ import NotFound from "./Routes/NotFound"; function App() { return ( <> - {/* //Na linha seguinte deverá ser feito um teste se a aplicação teste + {/* //Na linha seguinte deverá ser feito um teste se a aplicação // está em dark mode e deverá utilizar a classe dark ou light */}
diff --git a/src/Components/Card.jsx b/src/Components/Card.jsx index 51ec637..2734741 100644 --- a/src/Components/Card.jsx +++ b/src/Components/Card.jsx @@ -1,7 +1,7 @@ import styles from "./Card.module.css"; -const Card = () => { - +const Card = (props) => { + const {nome, sobrenome} = props.dados; return ( <> {/* //Na linha seguinte deverá ser feito um teste se a aplicação @@ -16,7 +16,7 @@ const Card = () => { {/* Na linha seguinte o link deverá utilizar a matricula, nome e sobrenome do dentista que vem da API */} -
Nome e Sobrenome do dentista
+
{nome} {sobrenome}
diff --git a/src/Routes/Detail.jsx b/src/Routes/Detail.jsx index 2161a79..b094697 100644 --- a/src/Routes/Detail.jsx +++ b/src/Routes/Detail.jsx @@ -8,4 +8,4 @@ const Detail = () => { ) } -export default Detail \ No newline at end of file +export default Detail; \ No newline at end of file diff --git a/src/Routes/Home.jsx b/src/Routes/Home.jsx index d6c7f85..28fd374 100644 --- a/src/Routes/Home.jsx +++ b/src/Routes/Home.jsx @@ -1,19 +1,48 @@ -import { useEffect } from "react"; +import { useEffect , useState} from "react"; import Card from "../Components/Card"; +import axios from "axios"; +/***import api from "../services";*/ const Home = () => { + const [dentista, setDentista] = useState([]); + const [nome, setNome] = useState(""); + const [sobrenome, setSobrenome] = useState(""); + const [matricula, setMatricula] = useState(""); + const [usuario, setUsuario] = useState(""); + + async function getDentistas(){ + try { + const response = await axios("https://dhodonto.ctdprojetos.com.br/dentista"); + + console.log(response.data); + + } catch (error) { + console.log(error) + } + } + useEffect(() => { //Nesse useEffect, deverá ser obtido todos os dentistas da API //Armazena-los em um estado para posteriormente fazer um map //Usando o componente + getDentistas(); + }, []); return ( <>

Home

- + {dentista.map((d)=>( +
+ +
+ ))} + +
); diff --git a/src/services/api.js b/src/services/api.js new file mode 100644 index 0000000..7567c2b --- /dev/null +++ b/src/services/api.js @@ -0,0 +1,7 @@ +import axios from 'axios'; + +const api = axios.create({ + baseURL: "https://dhodonto.ctdprojetos.com.br", +}); + +export default api; \ No newline at end of file From 139ea7915df6a19c87e9e6468ba6043bef45be80 Mon Sep 17 00:00:00 2001 From: Jirayakbc Date: Sat, 8 Apr 2023 17:30:26 -0300 Subject: [PATCH 04/14] Ajustes com Michel --- src/App.jsx | 2 +- src/Components/Card.jsx | 19 ++++++++++++++++--- src/Components/DetailCard.jsx | 1 + src/Routes/Home.jsx | 23 +++++++++++------------ 4 files changed, 29 insertions(+), 16 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index 628ec64..6cf980d 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -19,7 +19,7 @@ function App() { } /> } /> - } /> + } /> } /> diff --git a/src/Components/Card.jsx b/src/Components/Card.jsx index 2734741..605c75f 100644 --- a/src/Components/Card.jsx +++ b/src/Components/Card.jsx @@ -1,7 +1,19 @@ +import { Link } from "react-router-dom"; import styles from "./Card.module.css"; +//import {useState, useEffect} from 'react' + const Card = (props) => { - const {nome, sobrenome} = props.dados; + const {nome, sobrenome, usuario, matricula} = props.dados; +// const {matricula, setMatricula} = useState("") + + + + //useEffect(() => { + // const response = localStorage.getItem("@dentista_matricula"); + // saveMatricula(response); + //}, []); + return ( <> {/* //Na linha seguinte deverá ser feito um teste se a aplicação @@ -15,9 +27,10 @@ const Card = (props) => {
{/* Na linha seguinte o link deverá utilizar a matricula, nome e sobrenome do dentista que vem da API */} - + +
{nome} {sobrenome}
- +
diff --git a/src/Components/DetailCard.jsx b/src/Components/DetailCard.jsx index 3709ac0..ee87d31 100644 --- a/src/Components/DetailCard.jsx +++ b/src/Components/DetailCard.jsx @@ -1,6 +1,7 @@ import { useEffect } from "react"; import ScheduleFormModal from "./ScheduleFormModal"; import styles from "./DetailCard.module.css"; +import { useParams } from "react-router-dom"; const DetailCard = () => { diff --git a/src/Routes/Home.jsx b/src/Routes/Home.jsx index 28fd374..cfca9fe 100644 --- a/src/Routes/Home.jsx +++ b/src/Routes/Home.jsx @@ -1,22 +1,22 @@ import { useEffect , useState} from "react"; import Card from "../Components/Card"; -import axios from "axios"; -/***import api from "../services";*/ +//import axios from "axios"; +import api from "../services/api"; const Home = () => { const [dentista, setDentista] = useState([]); - const [nome, setNome] = useState(""); - const [sobrenome, setSobrenome] = useState(""); - const [matricula, setMatricula] = useState(""); - const [usuario, setUsuario] = useState(""); - + //const [nome, setNome] = useState(""); + //const [sobrenome, setSobrenome] = useState(""); + //const [matricula, setMatricula] = useState(""); + // const [usuario, setUsuario] = useState(""); + async function getDentistas(){ try { - const response = await axios("https://dhodonto.ctdprojetos.com.br/dentista"); + const response = await api.get("/dentista"); console.log(response.data); - + setDentista (response.data); } catch (error) { console.log(error) } @@ -36,12 +36,11 @@ const Home = () => {
{dentista.map((d)=>(
- + +
))} -
From db526c1705cc7da530d8d0336613ced936f9b823 Mon Sep 17 00:00:00 2001 From: Jirayakbc Date: Sat, 8 Apr 2023 17:51:36 -0300 Subject: [PATCH 05/14] validacao formulario --- src/Components/LoginForm.jsx | 24 ++++++++++++++++++++++-- 1 file changed, 22 insertions(+), 2 deletions(-) diff --git a/src/Components/LoginForm.jsx b/src/Components/LoginForm.jsx index b3900cf..9e4e24b 100644 --- a/src/Components/LoginForm.jsx +++ b/src/Components/LoginForm.jsx @@ -1,14 +1,32 @@ import styles from "./Form.module.css"; +import api from "../services/api" +import { useState } from "react"; +import { async } from "q"; +import { useNavigate } from "react-router"; const LoginForm = () => { - const handleSubmit = (e) => { - //Nesse handlesubmit você deverá usar o preventDefault, + const [username, setUsername] = useState(""); + const [password, setPassorwd] = useState(""); + const navigate = useNavigate(); + + const handleSubmit = async (event) => { + event.preventDefault(); + //Nesse handlesubmit você deverá usar o preventDefault,-ok //enviar os dados do formulário e enviá-los no corpo da requisição //para a rota da api que faz o login /auth //lembre-se que essa rota vai retornar um Bearer Token e o mesmo deve ser salvo //no localstorage para ser usado em chamadas futuras //Com tudo ocorrendo corretamente, o usuário deve ser redirecionado a página principal,com react-router //Lembre-se de usar um alerta para dizer se foi bem sucedido ou ocorreu um erro + try { + const {data} = await api.post("/auth",{ + username, + password, + }) + navigate('/home') + } catch (error) { + alert("Dados Invalidos") + } }; return ( @@ -25,6 +43,7 @@ const LoginForm = () => { placeholder="Login" name="login" required + onChange={(event)=>setUsername(event.target.value)} /> { name="password" type="password" required + onChange={(event)=>setPassorwd(event.target.value)} /> - - + + ); diff --git a/src/Routes/Login.jsx b/src/Routes/Login.jsx index 88509b2..62adcac 100644 --- a/src/Routes/Login.jsx +++ b/src/Routes/Login.jsx @@ -1,9 +1,6 @@ import LoginForm from "../Components/LoginForm"; -import { useContext } from "react"; -import { AuthContext } from "../contexts/auth-context"; -const Contact = () => { - const { saveName, saveToken } = useContext(AuthContext); +const Contact = () => { return ( <>

Login

From 6d09c4b14d474626d5a3e9e57ee21fed16fcaca2 Mon Sep 17 00:00:00 2001 From: paulabfurlan Date: Tue, 11 Apr 2023 22:21:52 -0300 Subject: [PATCH 09/14] Mecanismo de Login e Logout funfando --- src/App.jsx | 3 --- src/Components/Form.module.css | 8 -------- src/Components/LoginForm.jsx | 18 +++++++++++++----- src/Components/Navbar.jsx | 12 ++++++++++-- src/contexts/auth-context.jsx | 22 ++++++++++------------ src/index.jsx | 9 ++++++--- 6 files changed, 39 insertions(+), 33 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index ea57314..23e9d61 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -6,7 +6,6 @@ import Login from "./Routes/Login"; import { BrowserRouter, Routes, Route } from "react-router-dom"; import Detail from "./Routes/Detail"; import NotFound from "./Routes/NotFound"; -import AuthProvider from "./contexts/auth-context"; import { useContext } from "react"; import { ThemeContext } from "./contexts/theme-context"; @@ -19,7 +18,6 @@ function App() { {/* //Na linha seguinte deverá ser feito um teste se a aplicação // está em dark mode e deverá utilizar a classe dark ou light */}
-
@@ -33,7 +31,6 @@ function App() {
-
); diff --git a/src/Components/Form.module.css b/src/Components/Form.module.css index 39b2cc8..b049f8a 100644 --- a/src/Components/Form.module.css +++ b/src/Components/Form.module.css @@ -12,12 +12,4 @@ .inputSpacing+.inputSpacing{ margin: 1rem 0; -} - -.loginForm{ - display: flex; - flex-direction: column; - justify-content: space-around; - width: 300px; - margin: 0 auto; } \ No newline at end of file diff --git a/src/Components/LoginForm.jsx b/src/Components/LoginForm.jsx index 6d9e701..ced272b 100644 --- a/src/Components/LoginForm.jsx +++ b/src/Components/LoginForm.jsx @@ -6,7 +6,7 @@ import { useState } from "react"; import { useNavigate } from "react-router-dom"; const LoginForm = () => { - const { saveName, saveToken } = useContext(AuthContext); + const { saveEmail, saveToken, setEstadoLogin } = useContext(AuthContext); const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); @@ -17,13 +17,20 @@ const LoginForm = () => { try { const response = await axios.post("https://dhodonto.ctdprojetos.com.br/auth", { username: email, password: password }); console.log(response.data); + saveEmail(email); saveToken(response.data.token); + setEstadoLogin("Logout"); navigate("/home"); } catch (error) { alert("Erro ao logar"); } } + const handleSubmit = (e) => { + e.preventDefault(); + logar(); + } + return ( <> {/* //Na linha seguinte deverá ser feito um teste se a aplicação @@ -32,7 +39,7 @@ const LoginForm = () => { className={`text-center card container ${styles.card}`} >
-
+
{ value={password} onChange={(event) => setPassword(event.target.value)} /> -
-
+ + + ); diff --git a/src/Components/Navbar.jsx b/src/Components/Navbar.jsx index 0189a1b..6a812d5 100644 --- a/src/Components/Navbar.jsx +++ b/src/Components/Navbar.jsx @@ -1,6 +1,10 @@ +import { useEffect, useState } from "react"; import styles from "./Navbar.module.css"; +import { useContext } from "react"; +import { AuthContext } from "../contexts/auth-context"; const Navbar = () => { + const { stsLogin, removeUserStorage } = useContext(AuthContext); return (
@@ -45,8 +49,12 @@ const Navbar = () => { ao formulário de login O botão de logout deverá ser testado darkmode se sim, btn-dark, se não, btn-light */} - - Login + { + if(stsLogin === "Logout") + removeUserStorage(); + }}> + {stsLogin}
  • diff --git a/src/contexts/auth-context.jsx b/src/contexts/auth-context.jsx index 56a3d96..123ddd4 100644 --- a/src/contexts/auth-context.jsx +++ b/src/contexts/auth-context.jsx @@ -3,16 +3,10 @@ import { createContext, useEffect, useState } from "react"; export const AuthContext = createContext({}); const AuthProvider = ({ children }) => { - const [name, setName] = useState(""); - - useEffect(() => { - const response = localStorage.getItem("ctd_username"); - setName(response); - }, []); - - function saveName(username) { - setName(username); - localStorage.setItem("ctd_username", username); + const [stsLogin, setStsLogin] = useState("Login"); + + function saveEmail(email) { + localStorage.setItem("ctd_email", email); } function saveToken(token) { @@ -20,13 +14,17 @@ const AuthProvider = ({ children }) => { } function removeUserStorage() { - localStorage.removeItem("ctd_username"); + localStorage.removeItem("ctd_email"); localStorage.removeItem("ctd_token"); } + function setEstadoLogin(login){ + setStsLogin(login); + } + return ( {children} diff --git a/src/index.jsx b/src/index.jsx index 97e9774..e5fe412 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -8,13 +8,16 @@ import Footer from "./Components/Footer"; import "./index.css"; import App from "./App"; import ThemeProvider from "./contexts/theme-context"; +import AuthProvider from "./contexts/auth-context"; const root = ReactDOM.createRoot(document.getElementById("root")); //Lembre-se de configurar suas rotas e seu contexto aqui root.render( - - - + + + + + ); From 7c045956e5d7767af97db0b1ee9d894d4cc9fad5 Mon Sep 17 00:00:00 2001 From: paulabfurlan Date: Tue, 11 Apr 2023 22:35:25 -0300 Subject: [PATCH 10/14] Melhorando o mecanismo de Login e Logout --- src/contexts/auth-context.jsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/contexts/auth-context.jsx b/src/contexts/auth-context.jsx index 123ddd4..dfa205b 100644 --- a/src/contexts/auth-context.jsx +++ b/src/contexts/auth-context.jsx @@ -4,6 +4,15 @@ export const AuthContext = createContext({}); const AuthProvider = ({ children }) => { const [stsLogin, setStsLogin] = useState("Login"); + + useEffect(() => { + const token = localStorage.getItem("ctd_token"); + console.log("Token no contexto: " + token); + if(token == null) + setStsLogin("Login"); + else + setStsLogin("Logout"); + }, []); function saveEmail(email) { localStorage.setItem("ctd_email", email); From 2f9118f15cd4897b571d5fcbd4d92eedbd07a04e Mon Sep 17 00:00:00 2001 From: paulabfurlan Date: Wed, 12 Apr 2023 22:45:57 -0300 Subject: [PATCH 11/14] Consertando o login e fazendo o get do dentista na pagina Detail --- src/App.jsx | 2 +- src/Components/Card.jsx | 2 +- src/Components/DetailCard.jsx | 37 +++++++++++++++++++++++++++++++---- src/Components/LoginForm.jsx | 4 ++-- 4 files changed, 37 insertions(+), 8 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index 23e9d61..eaccf7c 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -25,7 +25,7 @@ function App() { } /> } /> - } /> + } /> } /> diff --git a/src/Components/Card.jsx b/src/Components/Card.jsx index 605c75f..e1cf0a1 100644 --- a/src/Components/Card.jsx +++ b/src/Components/Card.jsx @@ -27,7 +27,7 @@ const Card = (props) => {
    {/* Na linha seguinte o link deverá utilizar a matricula, nome e sobrenome do dentista que vem da API */} - +
    {nome} {sobrenome}
    diff --git a/src/Components/DetailCard.jsx b/src/Components/DetailCard.jsx index ee87d31..19b898a 100644 --- a/src/Components/DetailCard.jsx +++ b/src/Components/DetailCard.jsx @@ -1,14 +1,43 @@ -import { useEffect } from "react"; +import { useEffect, useState } from "react"; import ScheduleFormModal from "./ScheduleFormModal"; import styles from "./DetailCard.module.css"; import { useParams } from "react-router-dom"; +import api from "../services/api"; const DetailCard = () => { + const { matricula } = useParams(); + const [dentista, setDentista] = useState({}); + const [token, setToken] = useState(""); + + async function getDentista(){ + const t = localStorage.getItem("ctd_token"); + setToken(t); + try{ + const response = await api.get(`/dentista?matricula=${matricula}`, { + headers: { + 'Authorization': `Bearer ${t}` + }}); + const d = { + nome: response.data.nome, + sobrenome: response.data.sobrenome, + matricula: response.data.matricula, + email: response.data.usuario.username + } + setDentista(d); + console.log(d); + } catch (error) { + console.log(error); + alert("Erro ao tentar pegar dados do Dentista"); + } + } useEffect(() => { //Nesse useEffect, você vai fazer um fetch na api passando o //id do dentista que está vindo do react-router e carregar os dados em algum estado + getDentista(); + }, []); + return ( //As instruções que estão com {''} precisam ser //substituídas com as informações que vem da api @@ -29,12 +58,12 @@ const DetailCard = () => {
      -
    • Nome: {'Nome do Dentista'}
      • +
    • Nome: {dentista.nome}
    • - Sobrenome: {'Sobrenome do Dentista'} + Sobrenome: {dentista.sobrenome}
    • - Usuário: {'Nome de usuário do Dentista'} + Usuário: {dentista.email}
    diff --git a/src/Components/LoginForm.jsx b/src/Components/LoginForm.jsx index 4a29867..6f54c43 100644 --- a/src/Components/LoginForm.jsx +++ b/src/Components/LoginForm.jsx @@ -16,8 +16,8 @@ const LoginForm = () => { async function logar() { try { const response = await api.post("/auth",{ - username, - password, + username: email, + password: password, }) console.log(response.data); saveEmail(email); From 147f72dc301ff8609cda75c0f9b186681bc11a9f Mon Sep 17 00:00:00 2001 From: Johnny Wesley Date: Wed, 12 Apr 2023 23:33:00 -0300 Subject: [PATCH 12/14] =?UTF-8?q?moderniza=C3=A7=C3=A3o=20m=C3=B3dulos=20d?= =?UTF-8?q?o=20projeto?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.jsx | 35 +++++++++---------- src/Components/LoginForm.jsx | 2 +- src/Components/Navbar.jsx | 6 ++-- src/index.jsx | 3 -- .../Detail.jsx => pages/detail/index.jsx} | 2 +- src/{Routes/Home.jsx => pages/home/index.jsx} | 6 ++-- .../Login.jsx => pages/login/index.jsx} | 4 +-- .../not-found/index.jsx} | 2 +- 8 files changed, 28 insertions(+), 32 deletions(-) rename src/{Routes/Detail.jsx => pages/detail/index.jsx} (64%) rename src/{Routes/Home.jsx => pages/home/index.jsx} (91%) rename src/{Routes/Login.jsx => pages/login/index.jsx} (57%) rename src/{Routes/NotFound.jsx => pages/not-found/index.jsx} (94%) diff --git a/src/App.jsx b/src/App.jsx index eaccf7c..4b86d9f 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,15 +1,14 @@ import { Outlet } from "react-router-dom"; import Footer from "./Components/Footer"; import Navbar from "./Components/Navbar"; -import Home from "./Routes/Home"; -import Login from "./Routes/Login"; +import Home from "./pages/home"; +import Login from "./pages/login"; import { BrowserRouter, Routes, Route } from "react-router-dom"; -import Detail from "./Routes/Detail"; -import NotFound from "./Routes/NotFound"; +import Detail from "./pages/detail"; +import NotFound from "./pages/not-found"; import { useContext } from "react"; import { ThemeContext } from "./contexts/theme-context"; - function App() { const { theme, handleChangeTheme } = useContext(ThemeContext); @@ -18,19 +17,19 @@ function App() { {/* //Na linha seguinte deverá ser feito um teste se a aplicação // está em dark mode e deverá utilizar a classe dark ou light */}
    - -
    - - - - } /> - } /> - } /> - } /> - - -
    -
    + +
    + + + + } /> + } /> + } /> + } /> + + +
    +
    ); diff --git a/src/Components/LoginForm.jsx b/src/Components/LoginForm.jsx index 6f54c43..f217413 100644 --- a/src/Components/LoginForm.jsx +++ b/src/Components/LoginForm.jsx @@ -23,7 +23,7 @@ const LoginForm = () => { saveEmail(email); saveToken(response.data.token); setEstadoLogin("Logout"); - navigate("/home"); + navigate("/"); } catch (error) { alert("Erro ao logar"); } diff --git a/src/Components/Navbar.jsx b/src/Components/Navbar.jsx index 6a812d5..26ae503 100644 --- a/src/Components/Navbar.jsx +++ b/src/Components/Navbar.jsx @@ -16,7 +16,7 @@ const Navbar = () => { >
    {/* Ao clicar, o usuário deve ser redirecionado a home, com react-router */} - + DH Odonto
    • diff --git a/src/contexts/auth-context.jsx b/src/contexts/auth-context.jsx index dfa205b..2c875f3 100644 --- a/src/contexts/auth-context.jsx +++ b/src/contexts/auth-context.jsx @@ -10,8 +10,10 @@ const AuthProvider = ({ children }) => { console.log("Token no contexto: " + token); if(token == null) setStsLogin("Login"); + else setStsLogin("Logout"); + }, []); function saveEmail(email) {