Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit ca8b65e2 by jaymehta
Options

Merge branch 'master' of https://git.logicloop.io/jaymehta/zango-frontend

2 parents e9dcc47e 25eaa001
Inline Side-by-side
Showing 2 changed files with 181 additions and 112 deletions
components/layout/Footer.js
import Image from "next/image";
import React from "react";
import React, { useState } from "react";
import { Button } from "react-bootstrap";
import { newsletter } from "../../redux/actions/newsletterAction";
import { toast } from "react-toastify";
const Footer = () => {
const [email, setEmail] = useState('');
const [isValidEmail, setIsValidEmail] = useState(true);
const validateEmail = () => {
// Regular expression for email validation
const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return regex.test(email);
};
const handleSubmit = async (e) => {
e.preventDefault();
if (validateEmail()) {
// Email is valid, perform your action (e.g., subscribe)
const res = await newsletter(email);
console.log("res", res.data);
// Reset email input field after successful submission
setEmail('');
setIsValidEmail(true);
toast.success("Subscribed successful!");
} else {
// Email is not valid, show error message or handle as you wish
setIsValidEmail(false);
}
};
return (
<>
<footer>
<div className="container-fluid">
<div className="row">
<div className="col-md-9">
<div className="footer-logo">
<span className="image-container">
<Image layout="fill" className="image img-fluid" alt="" src="/images/Zango-logo-footer.svg" />
</span>
<footer>
<div className="container-fluid">
<div className="row">
<div className="col-md-9">
<div className="footer-logo">
<span className="image-container">
<Image layout="fill" className="image img-fluid" alt="" src="/images/Zango-logo-footer.svg" />
</span>
</div>
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor </div>
</div>
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor </div>
</div>
<div className="col-md-3">
<div className="footer-link">
<h3>VENDOR SIGN UP</h3>
<div className="">
<Button href="/login/vendor" variant="light me-3">Log In</Button>
<Button href="/signup/vendor" variant="primary">Sign Up</Button>
<div className="col-md-3">
<div className="footer-link">
<h3>VENDOR SIGN UP</h3>
<div className="">
<Button href="/login/vendor" variant="light me-3">
Log In
</Button>
<Button href="/signup/vendor" variant="primary">
Sign Up
</Button>
</div>
</div>
</div>
</div>
</div>
<div className="row">
<div className="col-12">
<hr />
</div>
</div>
<div className="row">
<div className="col-md-3">
<div className="footer-link mtp-0">
<h3>QUICK LINKS</h3>
<ul>
<li>
<a href="/about-us">About Us</a>
</li>
<li>
<a href="/contact-us">Contact Us</a>
</li>
<li>
<a href="">Corporate Programs</a>
</li>
<li>
<a href="">Private Events</a>
</li>
<li>
<a href="">Promo T & C’s</a>
</li>
<li>
<a href="">Gifting</a>
</li>
</ul>
<div className="row">
<div className="col-12">
<hr />
</div>
</div>
<div className="col-md-3">
<div className="footer-link">
<h3>CONTACT </h3>
<div className="icon-text">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/location.svg" />
</span>
<div className="text">
<a href="">Lorem ipsum dolor sit amet</a>
</div>
<div className="row">
<div className="col-md-3">
<div className="footer-link mtp-0">
<h3>QUICK LINKS</h3>
<ul>
<li>
<a href="/about-us">About Us</a>
</li>
<li>
<a href="/contact-us">Contact Us</a>
</li>
<li>
<a href="">Corporate Programs</a>
</li>
<li>
<a href="">Private Events</a>
</li>
<li>
<a href="">Promo T & C’s</a>
</li>
<li>
<a href="">Gifting</a>
</li>
</ul>
</div>
<div className="icon-text">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/email.svg" />
</span>
<div className="text">
<a href="mailTo:zango@gmail.com">zango@gmail.com</a>
</div>
<div className="col-md-3">
<div className="footer-link">
<h3>CONTACT </h3>
<div className="icon-text">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/location.svg" />
</span>
<div className="text">
<a href="">Lorem ipsum dolor sit amet</a>
</div>
</div>
</div>
<div className="icon-text">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/phone-call.svg" />
</span>
<div className="text">
<a href="">+91-8798798798</a>
<div className="icon-text">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/email.svg" />
</span>
<div className="text">
<a href="mailTo:zango@gmail.com">zango@gmail.com</a>
</div>
</div>
<div className="icon-text">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/phone-call.svg" />
</span>
<div className="text">
<a href="">+91-8798798798</a>
</div>
</div>
</div>
</div>
</div>
<div className="col-md-3">
<div className="footer-link">
<h3>HELP</h3>
<ul>
<li>
<a href="/terms-and-conditions">Terms & Policy</a>
</li>
<li>
<a href="/privacy-policy">Privacy Policy</a>
</li>
<li>
<a href="">Careers</a>
</li>
<li>
<a href="">FAQs</a>
</li>
</ul>
<div className="col-md-3">
<div className="footer-link">
<h3>HELP</h3>
<ul>
<li>
<a href="/terms-and-conditions">Terms & Policy</a>
</li>
<li>
<a href="/privacy-policy">Privacy Policy</a>
</li>
<li>
<a href="">Careers</a>
</li>
<li>
<a href="">FAQs</a>
</li>
</ul>
</div>
</div>
</div>
<div className="col-md-3">
<div className="footer-link mb-3">
<h3>FOLLOW US ON</h3>
<div className="social-icon">
<div className="col-md-3">
<div className="footer-link mb-3">
<h3>FOLLOW US ON</h3>
<div className="social-icon">
<a href="">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/facebook.svg" />
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/facebook.svg" />
</span>
</a>
<a href="">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/twitter.svg" />
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/twitter.svg" />
</span>
</a>
<a href="">
<span className="image-container">
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/instagram.svg" />
<Image layout="fill" alt="" className="image img-fluid" src="/images/icons/instagram.svg" />
</span>
</a>
</div>
</div>
</div>
<div className="footer-link">
<h3>JOIN OUR COMMUNITY</h3>
<div>Subscribe to gt information, latest news and other interesting offers</div>
<div className="subscribe">
<form action="">
<div className="row">
<div className="col-12">
<input id="subscribe" type="text" placeholder="Email Address"/>
<label htmlFor="subscribe"><Button variable="primary">Subscribe </Button></label>
</div>
<div className="footer-link">
<h3>JOIN OUR COMMUNITY</h3>
<div>Subscribe to gt information, latest news and other interesting offers</div>
<div className="subscribe">
<form onSubmit={handleSubmit}>
<div className="row">
<div className="col-12">
<input
id="subscribe"
onChange={e => {
setEmail(e.target.value);
setIsValidEmail(true);
}}
type="text"
value={email}
placeholder="Email Address"
/>
<label htmlFor="subscribe">
<Button variable="primary" type="submit">Subscribe </Button>
</label>
{!isValidEmail && (
<span style={{ color: 'red' }}>Please enter a valid email address.</span>
)}
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
<div className="copyright">
</footer>
<div className="copyright">
<div className="container">
<div className="row">
<div className="col-12">
<div>Copyright © 2024 ZanGO. All Rights Reserved</div>
<div>Copyright © 2024 ZanGO. All Rights Reserved</div>
</div>
</div>
</div>
</div>
</div>
</>
);
};
......
redux/actions/newsletterAction.js 0 → 100644
import axios from "axios";
import qs from "qs";
import { GET_TESTIMONIAL_FAIL, GET_TESTIMONIAL_REQUEST, GET_TESTIMONIAL_SUCCESS } from "../constants/testimonialConstants";
export const newsletter = async email => {
try {
console.log("email", email);
const config = {
headers: {
"Content-Type": "application/json"
}
};
const data = {
data: {
email: email
}
};
const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/newsletters`, data, config);
console.log("response > ", response.data);
return response.data;
} catch (error) {}
};
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!