added toastify to signin and signup

This commit is contained in:
QkoSad
2022-11-30 16:58:41 +02:00
parent 98d2d372e8
commit 19fb5256cf
6 changed files with 72 additions and 27 deletions
+34
View File
@@ -16,6 +16,7 @@
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-router-dom": "^6.4.3", "react-router-dom": "^6.4.3",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"react-toastify": "^9.1.1",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
} }
}, },
@@ -6299,6 +6300,14 @@
"wrap-ansi": "^7.0.0" "wrap-ansi": "^7.0.0"
} }
}, },
"node_modules/clsx": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz",
"integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==",
"engines": {
"node": ">=6"
}
},
"node_modules/co": { "node_modules/co": {
"version": "4.6.0", "version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz", "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -15081,6 +15090,18 @@
} }
} }
}, },
"node_modules/react-toastify": {
"version": "9.1.1",
"resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-9.1.1.tgz",
"integrity": "sha512-pkFCla1z3ve045qvjEmn2xOJOy4ZciwRXm1oMPULVkELi5aJdHCN/FHnuqXq8IwGDLB7PPk2/J6uP9D8ejuiRw==",
"dependencies": {
"clsx": "^1.1.1"
},
"peerDependencies": {
"react": ">=16",
"react-dom": ">=16"
}
},
"node_modules/read-cache": { "node_modules/read-cache": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -22425,6 +22446,11 @@
"wrap-ansi": "^7.0.0" "wrap-ansi": "^7.0.0"
} }
}, },
"clsx": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz",
"integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg=="
},
"co": { "co": {
"version": "4.6.0", "version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz", "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -28627,6 +28653,14 @@
"workbox-webpack-plugin": "^6.4.1" "workbox-webpack-plugin": "^6.4.1"
} }
}, },
"react-toastify": {
"version": "9.1.1",
"resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-9.1.1.tgz",
"integrity": "sha512-pkFCla1z3ve045qvjEmn2xOJOy4ZciwRXm1oMPULVkELi5aJdHCN/FHnuqXq8IwGDLB7PPk2/J6uP9D8ejuiRw==",
"requires": {
"clsx": "^1.1.1"
}
},
"read-cache": { "read-cache": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
+1
View File
@@ -11,6 +11,7 @@
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-router-dom": "^6.4.3", "react-router-dom": "^6.4.3",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"react-toastify": "^9.1.1",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },
"scripts": { "scripts": {
+20 -17
View File
@@ -1,26 +1,29 @@
import Navbar from './components/Navbar' import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import {BrowserRouter as Router,Routes, Route} from 'react-router-dom' import { ToastContainer } from "react-toastify";
import Explore from './pages/Explore' import "react-toastify/dist/ReactToastify.css";
import Profile from './pages/Profile' import Navbar from "./components/Navbar";
import ForgotPassword from './pages/ForgotPassword' import Explore from "./pages/Explore";
import Offers from './pages/Offers' import Profile from "./pages/Profile";
import Signin from './pages/Signin' import ForgotPassword from "./pages/ForgotPassword";
import Signup from './pages/Signup' import Offers from "./pages/Offers";
import Signin from "./pages/Signin";
import Signup from "./pages/Signup";
function App() { function App() {
return ( return (
<> <>
<Router> <Router>
<Routes> <Routes>
<Route path='/' element={<Explore />}/> <Route path="/" element={<Explore />} />
<Route path='/offers' element={<Offers />}/> <Route path="/offers" element={<Offers />} />
<Route path='/profile' element={<Profile />}/> <Route path="/profile" element={<Profile />} />
<Route path='/sign-in' element={<Signin />}/> <Route path="/sign-in" element={<Signin />} />
<Route path='/sign-up' element={<Signup />}/> <Route path="/sign-up" element={<Signup />} />
<Route path='/forgot-password' element={<ForgotPassword />}/> <Route path="/forgot-password" element={<ForgotPassword />} />
</Routes> </Routes>
<Navbar/> <Navbar />
</Router> </Router>
<ToastContainer />
</> </>
); );
} }
+11 -7
View File
@@ -1,9 +1,13 @@
import { useEffect, useState } from "react";
import { getAuth } from "firebase/auth";
function Profile (){ function Profile() {
return ( const [user, setUser] = useState();
<> const auth = getAuth();
<h1>My app</h1> useEffect(() => {
</> setUser(auth.currentUser);
); }, []);
return user ? <h1>{user.displayName}</h1> : "Not Logged In";
} }
export default Profile export default Profile;
+3 -2
View File
@@ -1,8 +1,9 @@
import { useState } from "react"; import { useState } from "react";
import { Link, useNavigate } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import { toast } from "react-toastify";
import { getAuth, signInWithEmailAndPassword } from "firebase/auth";
import { ReactComponent as ArrowRightIcon } from "../assets/svg/keyboardArrowRightIcon.svg"; import { ReactComponent as ArrowRightIcon } from "../assets/svg/keyboardArrowRightIcon.svg";
import visibilityIcon from "../assets/svg/visibilityIcon.svg"; import visibilityIcon from "../assets/svg/visibilityIcon.svg";
import { getAuth, signInWithEmailAndPassword } from "firebase/auth";
function Signin() { function Signin() {
const [showPassword, setShowPassword] = useState(false); const [showPassword, setShowPassword] = useState(false);
@@ -29,7 +30,7 @@ function Signin() {
navigate("/"); navigate("/");
} }
} catch (error) { } catch (error) {
console.log(error); toast.error("Bad user credentials")
} }
}; };
return ( return (
+3 -1
View File
@@ -1,3 +1,5 @@
import 'react-toastify/dist/ReactToastify.css';
import { toast } from 'react-toastify';
import { useState } from "react"; import { useState } from "react";
import { Link, useNavigate } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import { ReactComponent as ArrowRightIcon } from "../assets/svg/keyboardArrowRightIcon.svg"; import { ReactComponent as ArrowRightIcon } from "../assets/svg/keyboardArrowRightIcon.svg";
@@ -47,7 +49,7 @@ function Signup() {
navigate("/"); navigate("/");
} catch (error) { } catch (error) {
console.log(error); toast.error("something went wron with the registration")
} }
}; };
return ( return (