diff --git a/src/App.js b/src/App.js index 94bb84f..f2910b2 100644 --- a/src/App.js +++ b/src/App.js @@ -21,6 +21,8 @@ import RestartPassword from './pages/RestartPassword'; const App = () => { + + return ( diff --git a/src/pages/Chargement.js b/src/pages/Chargement.js index 04ef0b3..b8556dc 100644 --- a/src/pages/Chargement.js +++ b/src/pages/Chargement.js @@ -1,11 +1,14 @@ -import React, {Component} from 'react'; +import React from 'react'; import ReactLoading from 'react-loading'; + + const Chargement = () => { - return ( + return(
- + +
); } diff --git a/src/pages/Connexion.js b/src/pages/Connexion.js index 343fdcd..8ce50c5 100644 --- a/src/pages/Connexion.js +++ b/src/pages/Connexion.js @@ -1,9 +1,10 @@ import axios from 'axios' -import React, { useState } from 'react'; +import React, { useState, useEffect } from 'react'; import CryptoJS from 'crypto-js'; import Admin from './Admin_create.js' import Dashboard from './Dashboard.js' import Admin_list from './Admin_list.js'; +import Chargement from './Chargement.js'; const api = axios.create({ baseURL: 'http://localhost:8080' @@ -58,6 +59,15 @@ function Connexion() { }); } + const [loader, setLoader] = useState(true); + + useEffect(() => { + setTimeout(() => { + setLoader(false); + }, 3000) + }, []) + + if (auth === "Succeed") { const apiString = '/User/role/' + login; api.get(apiString).then((response) => { @@ -77,7 +87,9 @@ function Connexion() { return (); } else { - return ( + return loader ?( + + ) : (
diff --git a/src/styles/components/_chargement.scss b/src/styles/components/_chargement.scss index 102e780..64dc2f2 100644 --- a/src/styles/components/_chargement.scss +++ b/src/styles/components/_chargement.scss @@ -1,6 +1,12 @@ .chargement { display: flex; + flex-direction: column; justify-content: center; align-items: center; height: 100vh; +} + +.logo{ + height: 200px; + width:200px; } \ No newline at end of file