Skip to content

Commit

Permalink
Added toasts (#248)
Browse files Browse the repository at this point in the history
  • Loading branch information
@tamalCodes
tamalCodes authored Jul 26, 2022
1 parent 6635798 commit 04004c9
Show file tree
Hide file tree
Showing 10 changed files with 1,148 additions and 1,038 deletions.
1,966 changes: 976 additions & 990 deletions package-lock.json
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
"react-loader-spinner": "^6.0.0-0",
"react-router-dom": "^6.2.1",
"react-scripts": "^5.0.1",
"react-toastify": "^8.2.0",
"react-toastify": "^9.0.7",
"web-vitals": "^2.1.4"
},
"scripts": {
Expand Down
20 changes: 18 additions & 2 deletions src/components/SingleClub.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,9 @@ import * as React from "react";
import ClubUpperImage from "../assets/pictures/ClubUpperImage.svg"
import { useLocation, Link } from 'react-router-dom';

import { toast, ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';


export default function SingleClub({ club }) {

Expand All @@ -19,6 +22,19 @@ export default function SingleClub({ club }) {
document.getElementById(`less${club._id}`).classList.remove("hidden");
};

const handleDonate = () => {
toast('🌈 Thanks for the donation !', {
position: "top-right",
autoClose: 3000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,

});
}

return (
<div className="card clubCard">
<img
Expand Down Expand Up @@ -58,7 +74,7 @@ export default function SingleClub({ club }) {

<>

<button type="button" className="btn btn-warning donate_btn" data-bs-toggle="modal" data-bs-target="#staticBackdrop" onClick={() => { console.log(club.name) }} >
<button type="button" className="btn btn-warning donate_btn" data-bs-toggle="modal" data-bs-target="#staticBackdrop" >
Donate
</button>

Expand All @@ -83,7 +99,7 @@ export default function SingleClub({ club }) {
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"> Close </button>

<button type="button" class="btn btn-warning" data-bs-dismiss="modal"> Donate </button>
<button type="button" class="btn btn-warning" data-bs-dismiss="modal" onClick={() => { handleDonate() }}> Donate </button>

</div>
</div>
Expand Down
15 changes: 15 additions & 0 deletions src/pages/Donate.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,9 @@ import SingleClub from '../components/SingleClub'
import { GetAllClubs } from '../service/MilanApi'
import "../styles/Donate.css"

import { toast, ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

const Donate = () => {

const [clubData, setClubData] = useState([]);
Expand All @@ -25,6 +28,18 @@ const Donate = () => {

<Navbar />

<ToastContainer
position="top-right"
autoClose={5000}
hideProgressBar={false}
newestOnTop={false}
closeOnClick
rtl={false}
pauseOnFocusLoss
draggable
pauseOnHover
/>

<div id="donate_banner"
className="container"
>
Expand Down
46 changes: 38 additions & 8 deletions src/pages/clubs/ClubsLogin.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,10 @@ import "../../styles/ClubLogin.css";
import Pic from "../../assets/pictures/clubs-login.png";
import { LoginClub } from "../../service/MilanApi";
import { Audio, Oval, TailSpin } from "react-loader-spinner";
import {toast} from 'react-toastify';
import { toast, ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

toast.configure()


function ClubLogin() {
const Navigate = useNavigate();
Expand Down Expand Up @@ -52,14 +52,32 @@ function ClubLogin() {

Data.then((response) => {
if (response.data.success === true) {
toast.success("Logged you in!!", {
position: toast.POSITION.TOP_RIGHT
});

sessionStorage.setItem("club", response.data.authToken);
Navigate("/");

toast('🌈 Logged you in !', {
position: "top-right",
autoClose: 3000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
onClose: () => {
Navigate("/");
}
});

} else if (response.data.success === false) {
toast.error("Please input valid credentials",{
position: toast.POSITION.TOP_RIGHT
toast('🌈 Error !', {
position: "top-right",
autoClose: 3000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,

});
setCredentials({
email: "",
Expand All @@ -75,6 +93,18 @@ function ClubLogin() {
<>
<Navbar />

<ToastContainer
position="top-right"
autoClose={5000}
hideProgressBar={false}
newestOnTop={false}
closeOnClick
rtl={false}
pauseOnFocusLoss
draggable
pauseOnHover
/>

<section className="vh-100">
<div className="container py-5 h-100">
<div className="row d-flex align-items-center justify-content-center h-100">
Expand Down
32 changes: 31 additions & 1 deletion src/pages/clubs/ClubsRegister.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,9 @@ import { Link, useNavigate } from "react-router-dom";
import { RegisterClub } from "../../service/MilanApi";
import "../../styles/ClubsRegister.css";

import { toast, ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

const ClubLogin = () => {
document.title = "Register your club | Milan";
const navigate = useNavigate();
Expand Down Expand Up @@ -52,12 +55,39 @@ const ClubLogin = () => {
setIsLoading(true);
await RegisterClub(credentials);
setIsLoading(false);
navigate("/clubs/login");


toast('🌈 Registered club !', {
position: "top-right",
autoClose: 3000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
onClose: () => {
navigate("/clubs/login");
}
});
};

return (
<>
<Navbar />

<ToastContainer
position="top-right"
autoClose={5000}
hideProgressBar={false}
newestOnTop={false}
closeOnClick
rtl={false}
pauseOnFocusLoss
draggable
pauseOnHover
/>


<div className="mobile-sec container py-5 h-100">
<div className="row d-flex align-items-center justify-content-center h-100">
<div className="col-md-8 col-lg-7 col-xl-6">
Expand Down
2 changes: 1 addition & 1 deletion src/pages/display/CLUB_DATA.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ const data = [
{
"id": 2,
"club_name": "Maitreya Project",
"club_email": "ebeckerleg0@arizona.edu",
"club_email": "emairtyleg0@arizona.edu",
"club_des": "Maitreya Project is based on the belief that inner peace and outer peace share a cause and effect relationship and that loving-kindness leads to peace at every level of society — peace for individuals, families, communities and the world. ",
"club_logo": "https://i.ibb.co/0hxWDDD/1.jpg"
},
Expand Down
41 changes: 33 additions & 8 deletions src/pages/user/UserLogin.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,9 @@ import Navbar from "../../components/Navbar";
import "../../styles/UserLogin.css";
import { LoginUser } from "../../service/MilanApi";

import {toast} from 'react-toastify';
import { toast, ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
toast.configure();


function UserLogin() {
const Navigate = useNavigate();
Expand Down Expand Up @@ -48,11 +48,22 @@ function UserLogin() {
Data.then((response) => {
if (response?.data.token) {
//alert("Logged you in!!");
toast.success('Logged you in!!', {
position: toast.POSITION.TOP_RIGHT
})

sessionStorage.setItem("token", response.data.token);
Navigate("/");

toast('🌈 Logged you in !', {
position: "top-right",
autoClose: 3000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
onClose: () => {
Navigate("/");
}
});

} else {
setCredentials({ email: "", password: "", });
}
Expand All @@ -61,10 +72,24 @@ function UserLogin() {
});
};



return (
<>
<Navbar />

<ToastContainer
position="top-right"
autoClose={5000}
hideProgressBar={false}
newestOnTop={false}
closeOnClick
rtl={false}
pauseOnFocusLoss
draggable
pauseOnHover
/>

<section className="vh-100">
<div className="container py-5 h-100">
<div className="row d-flex align-items-center justify-content-center h-100">
Expand All @@ -77,7 +102,7 @@ function UserLogin() {
</div>

<div className="col-md-7 col-lg-5 col-xl-5 offset-xl-1">
<form style={{ width: "auto" }} onSubmit={handleSubmit}>
<form style={{ width: "auto" }} onSubmit={handleSubmit}>
<h2 style={{ letterSpacing: "1px", marginBottom: "20px" }}>Log in</h2>
<div className="form-outline mb-4">

Expand Down Expand Up @@ -106,7 +131,7 @@ function UserLogin() {
</div>

<div className="form-outline mb-4">

<input
type="password"
className="desktop form-control form-control-lg"
Expand Down
30 changes: 29 additions & 1 deletion src/pages/user/UserRegister.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import { RegisterUser } from "../../service/MilanApi";

//* The styles for Login and Register are essentially same
import "../../styles/UserLogin.css";
import { toast, ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

function UserRegister() {
const navigate = useNavigate();
Expand Down Expand Up @@ -45,13 +47,39 @@ function UserRegister() {
e.preventDefault();

await RegisterUser(credentials);
navigate("/user/login");

toast('🌈 Logged you in !', {
position: "top-right",
autoClose: 3000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
onClose: () => {
navigate("/user/login");
}
});


};

return (
<>
<Navbar />

<ToastContainer
position="top-right"
autoClose={5000}
hideProgressBar={false}
newestOnTop={false}
closeOnClick
rtl={false}
pauseOnFocusLoss
draggable
pauseOnHover
/>

<section className="vh-100">
<div className="container py-5 h-100">
<div className="row d-flex align-items-center justify-content-center h-100">
Expand Down
Loading

1 comment on commit 04004c9

@vercel
Copy link

@vercel vercel bot commented on 04004c9 Jul 26, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

milan – ./

milan-git-main-iamtamal.vercel.app
milan-iamtamal.vercel.app
milaan.vercel.app

Please sign in to comment.