Skip to content

Jay Mehta / zango-frontend

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

.

1 parent cdf775d8
Expand all
Inline Side-by-side
Showing 15 changed files with 375 additions and 149 deletions
components/admin/ContactUsleads.js
import { Table } from 'antd'; import { Table } from "antd";
import axios from 'axios'; import axios from "axios";
import React, { useEffect, useState } from 'react' import React, { useEffect, useState } from "react";
import dayjs from 'dayjs';
export const ContactUsleads = () => { export const ContactUsleads = () => {
const [contactLeads, setContactLeads] = useState([]);
useEffect(() => {
axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/contact-uses`).then((res) => {
let contactLeadsData =
res.data &&
res.data.data.map((data) => {
return {
key: data.id,
name: data?.attributes?.name,
email: data?.attributes?.email,
number: data?.attributes?.number,
zip: data?.attributes?.zip,
message: data?.attributes?.message,
publishedAt: data?.attributes?.publishedAt,
}
})
console.log("contactLeadsData :", contactLeadsData);
setContactLeads(contactLeadsData)
}).catch((err) => {
console.log(err)
})
}, [])
const transformDateTime = (rawDate) => {
const date = new Date(rawDate);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, "0"); // Months are zero-indexed
const day = String(date.getDate()).padStart(2, "0");
const hours = String(date.getHours()).padStart(2, "0");
const minutes = String(date.getMinutes()).padStart(2, "0");
const seconds = String(date.getSeconds()).padStart(2, "0");
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
const columns = [
{
title: "Name",
dataIndex: "name",
key: "name",
width :300,
render: text => <a>{text}</a>
},
{
title: "Email",
dataIndex: "email",
key: "email",
width:300,
render: text => <a>{text}</a>
},
{
title: "Zip",
dataIndex: "zip",
key: "zip",
width: 100,
render: text => <a>{text}</a>
},
{
title: "Message",
dataIndex: "message",
key: "message",
render: text => <a>{text}</a>
},
{
title: "Date & Time",
dataIndex: "publishedAt",
key: "publishedAt",
width : 200,
render: text => <a>{transformDateTime(text)}</a>
},
]
return (
<div className="p-5 h-100">
<Table columns={columns} dataSource={contactLeads} />
</div>
)
}
\ No newline at end of file \ No newline at end of file
const [contactLeads, setContactLeads] = useState([]);
useEffect(() => {
axios
.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/contact-uses`)
.then(res => {
let contactLeadsData =
res.data &&
res.data.data.map(data => {
return {
key: data.id,
name: data?.attributes?.name,
email: data?.attributes?.email,
number: data?.attributes?.number,
zip: data?.attributes?.zip,
message: data?.attributes?.message,
publishedAt: data?.attributes?.publishedAt
};
});
console.log("contactLeadsData :", contactLeadsData);
setContactLeads(contactLeadsData);
})
.catch(err => {
console.log(err);
});
}, []);
const transformDateTime = rawDate => {
const date = new Date(rawDate);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, "0"); // Months are zero-indexed
const day = String(date.getDate()).padStart(2, "0");
const hours = String(date.getHours()).padStart(2, "0");
const minutes = String(date.getMinutes()).padStart(2, "0");
const seconds = String(date.getSeconds()).padStart(2, "0");
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
const columns = [
{
title: "Name",
dataIndex: "name",
key: "name",
width: 300,
render: text => <a>{text}</a>
},
{
title: "Email",
dataIndex: "email",
key: "email",
width: 300,
render: text => <a>{text}</a>
},
{
title: "Zip",
dataIndex: "zip",
key: "zip",
width: 100,
render: text => <a>{text}</a>
},
{
title: "Message",
dataIndex: "message",
key: "message",
render: text => <a>{text}</a>
},
{
title: "Date & Time",
dataIndex: "publishedAt",
key: "publishedAt",
width: 200,
render: text => <a>{transformDateTime(text)}</a>,
// sorter: (a, b) => a.publishedAt - b.publishedAt,
sorter: (a, b) => dayjs(a.publishedAt).unix() - dayjs(b.publishedAt).unix(),
sortDirections: ["descend", "ascend"],
}
];
return (
<div className="p-5 h-100">
<Table columns={columns} dataSource={contactLeads} />
</div>
);
};
components/blog/Blog.js
...@@ -3,12 +3,12 @@ import BlogsItem from "./BlogItem.js"; ...@@ -3,12 +3,12 @@ import BlogsItem from "./BlogItem.js";
import PageBanner from "./PageBanner.js"; import PageBanner from "./PageBanner.js";
import { useDispatch, useSelector } from "react-redux"; import { useDispatch, useSelector } from "react-redux";
const Blog = () => { const Blog = () => {
const { blogs } = useSelector(state => state.blogs); const { blogs, loading } = useSelector(state => state.blogs);
console.log("blogs", blogs) console.log("blogs", blogs)
return ( return (
<> <>
<PageBanner /> <PageBanner />
<BlogsItem blogs={blogs} /> <BlogsItem blogs={blogs} loading={loading} />
</> </>
); );
}; };
......
components/common-components/ForgotPassword.js 0 → 100644
import axios from "axios";
import { Form, Formik } from "formik";
import { useRouter } from "next/router";
import React, { Fragment, useState } from "react";
import { Button } from "react-bootstrap";
import { toast } from "react-toastify";
import * as Yup from "yup";
import { finishVendorOtpVerification } from "../../redux/actions/vendorActions";
import OTPInput from "./OTPInput";
const ForgotPassword = () => {
const loginValidationSchema = Yup.object().shape({
email: Yup.string().required("Email Id is Required").email("Please Enter An Valid Email Id")
});
const [showOtpModal, setshowOtpModal] = useState(false);
const [showPasswordPannel, setshowPasswordPannel] = useState(false);
const [otp, setOtp] = useState(new Array(4).fill(""));
const [passwordUpdatedSuccess, setpasswordUpdatedSuccess] = useState(false);
const router = useRouter();
return (
<div>
<Fragment>
<div className="contaier-fluid login-banner-image">
<div className="row">
<div className="col-11 col-lg-4 login-div">
<div className="">
<h2>Password reset:</h2>
<div className="form-container">
<div>
<Formik
initialValues={{
email: "",
password: "",
confirmPassword: ""
}}
validationSchema={loginValidationSchema}
onSubmit={async values => {
const config = {
headers: {
// Authorization: `Bearer ${authUser.data.jwt}`,
"Content-Type": "application/json"
}
};
const data = {
data: {
email: values.email
}
};
const response = await axios.post(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/end-users`, data, config);
console.log("response", response);
if (response.data.otpSent) {
toast.success("OTP sent");
setshowOtpModal(true);
} else {
}
}}
>
{({ values, errors, touched, handleChange, handleBlur, handleSubmit, setErrors, setValues }) => (
<Form>
{!showOtpModal && !showPasswordPannel && (
<>
<div className="input-group">
<label>Email Id</label>
<input type="text" name="email" onChange={handleChange} onBlur={handleBlur} value={values.email} placeholder="yourname@example.com" />
{errors.email && touched.email && <span className="form-error">{errors.email}</span>}
</div>
<div className="input-group">
<Button type="submit" className="btn btn-primary btn-submit" disabled={!values.email || errors.email}>
Send OTP
</Button>
</div>
</>
)}
{showOtpModal && (
<>
<div className="input-group mb-0 text-center">
<div className="otp-input">
<OTPInput setOtp={setOtp} otp={otp} />
</div>
<div className="input-group mt-4">
<Button
type="submit"
className="btn btn-primary btn-submit"
onClick={async e => {
e.preventDefault();
console.log(otp);
const oneTimePassword = otp.join("");
// setLoading(false);
const otpRes = await finishVendorOtpVerification({ email: values.email, oneTimePassword });
console.log("otpRes", otpRes);
if (!otpRes.data.ok) {
toast.error("OTP is invalid, please enter the correct OTP!");
return;
}
if (otpRes.data.ok) {
setshowPasswordPannel(true);
setshowOtpModal(false);
}
}}
>
Verify OTP
</Button>
</div>
</div>
</>
)}
{showPasswordPannel && (
<>
<div className="input-group">
<label>Password</label>
<input type="password" name="password" onChange={handleChange} onBlur={handleBlur} value={values.password} placeholder="Enter new password" />
{errors.password && touched.password && <span className="form-error">{errors.password}</span>}
<label className="mt-3">Confirm Password</label>
<input
type="password"
name="confirmPassword"
onChange={handleChange}
onBlur={e => {
handleBlur(e);
if (values.password != values.confirmPassword) {
setErrors({ confirmPassword: "Passwords do not match!" });
}
}}
value={values.confirmPassword}
placeholder="Confirm Password"
/>
{errors.confirmPassword && touched.confirmPassword && <span className="form-error">{errors.confirmPassword}</span>}
</div>
<div className="input-group">
<Button
// type="submit"
className="btn btn-primary btn-submit"
disabled={!values.password || !values.confirmPassword || values.password != values.confirmPassword}
onClick={async () => {
const config = {
headers: {
// Authorization: `Bearer ${authUser.data.jwt}`,
"Content-Type": "application/json"
}
};
const response = await axios.post(
`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/end-user/reset-password`,
{ email: values.email, password: values.password },
config
);
console.log("response", response);
if (response.data.ok) {
// setpasswordUpdatedSuccess(true)
setshowPasswordPannel(false);
setshowOtpModal(false);
toast.success("Password updated! you can now log in.");
// setValues({ email: "", password: "", confirmPassword: "" });
// setTimeout(() => {
// router.push("/")
// }, 500);
} else {
toast.error("Error occured, please try again!");
}
}}
>
Reset password
</Button>
</div>
</>
)}
</Form>
)}
</Formik>
</div>
</div>
</div>
</div>
</div>
</div>
</Fragment>
</div>
);
};
export default ForgotPassword;
components/gift-card/GiftCard.js
...@@ -108,7 +108,7 @@ const GiftCard = () => { ...@@ -108,7 +108,7 @@ const GiftCard = () => {
// Handle form submission here // Handle form submission here
}} }}
> >
{({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => ( {({ isSubmitting, values, handleChange, handleBlur, touched, errors, setErrors }) => (
<Form action="" className="form-01"> <Form action="" className="form-01">
<div className="title">Buy a gift card</div> <div className="title">Buy a gift card</div>
<div className="cl-gry">Please select an amount</div> <div className="cl-gry">Please select an amount</div>
...@@ -210,12 +210,21 @@ const GiftCard = () => { ...@@ -210,12 +210,21 @@ const GiftCard = () => {
<Field <Field
className="form-control" className="form-control"
type="number" type="number"
min="1"
name="customAmt" name="customAmt"
placeholder="Enter your amount" placeholder="Enter your amount"
onChange={e => { onChange={e => {
setAmount(e.target.value); setAmount(e.target.value);
}} }}
onBlur={handleBlur} onBlur={e => {
handleBlur(e.target.value);
console.log("blur", e);
if (e.target.value < 1) {
setErrors({customAmt: "Amount cant be 0 or less"})
} else {
setErrors({...errors, customAmt: null})
}
}}
value={amount} value={amount}
/> />
{touched.customAmt && errors.customAmt && <div className="text-danger">{errors.customAmt}</div>} {touched.customAmt && errors.customAmt && <div className="text-danger">{errors.customAmt}</div>}
...@@ -362,7 +371,6 @@ const GiftCard = () => { ...@@ -362,7 +371,6 @@ const GiftCard = () => {
onChange={handleChange} onChange={handleChange}
onBlur={handleBlur} onBlur={handleBlur}
value={values.code} value={values.code}
/> />
{touched.code && errors.code && <div className="text-danger">{errors.code}</div>} {touched.code && errors.code && <div className="text-danger">{errors.code}</div>}
{/* <div className="link-a"> {/* <div className="link-a">
......
components/layout/Generics/GenericSidebar.js
...@@ -2,8 +2,10 @@ import Image from "next/image"; ...@@ -2,8 +2,10 @@ import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import React from "react"; import React from "react";
import { useSelector } from "react-redux";
export const GenericSidebar = ({ isRoute }) => { export const GenericSidebar = ({ isRoute }) => {
const router = useRouter(); const router = useRouter();
const { loadedUser, error } = useSelector(state => state.loadedUser);
const VenderRoutes = () => { const VenderRoutes = () => {
return ( return (
<ul> <ul>
...@@ -15,14 +17,16 @@ export const GenericSidebar = ({ isRoute }) => { ...@@ -15,14 +17,16 @@ export const GenericSidebar = ({ isRoute }) => {
</span> </span>
</Link> </Link>
</li> </li>
<li className={router.pathname === "/vendor/activity-details" ? "active" : ""}> {loadedUser && loadedUser.approved == "approved" && (
<Link href="/vendor/activity-details"> <li className={router.pathname === "/vendor/activity-details" ? "active" : ""}>
<span className="d-flex cursor-pointer"> <Link href="/vendor/activity-details">
<Image className="" alt="" width={25} height={18} src="/images/vendor/add-activity.svg" /> <span className="d-flex cursor-pointer">
<div className="mx-2">Add Activity</div> <Image className="" alt="" width={25} height={18} src="/images/vendor/add-activity.svg" />
</span> <div className="mx-2">Add Activity</div>
</Link> </span>
</li> </Link>
</li>
)}
<li className={router.pathname === "/vendor/business-details" ? "active" : ""}> <li className={router.pathname === "/vendor/business-details" ? "active" : ""}>
<Link href="/vendor/business-details"> <Link href="/vendor/business-details">
<span className="d-flex cursor-pointer"> <span className="d-flex cursor-pointer">
......
components/login/Login.js
...@@ -115,6 +115,7 @@ const Login = props => { ...@@ -115,6 +115,7 @@ const Login = props => {
</Form> </Form>
)} )}
</Formik> </Formik>
<div className="input-group justify-content-center"> <div className="input-group justify-content-center">
<p className="text-center mb-0"> <p className="text-center mb-0">
or{" "} or{" "}
...@@ -123,6 +124,14 @@ const Login = props => { ...@@ -123,6 +124,14 @@ const Login = props => {
</Link> </Link>
</p> </p>
</div> </div>
<div className="input-group justify-content-center">
<p className="text-center mb-0">
<Link href={`/forgot-password`}>
<span style={{ textDecoration: "underline", cursor: "pointer" }}>Forgot password?</span>
</Link>
</p>
</div>
{/* {props && props.type == "user" && ( {/* {props && props.type == "user" && (
<> <>
<div className="input-group mb-0"> <div className="input-group mb-0">
......
components/vendor/ActivityDetails.js
This diff could not be displayed because it is too large.
components/vendor/BusinessDetails.js
...@@ -136,9 +136,9 @@ const BusinessDetails = () => { ...@@ -136,9 +136,9 @@ const BusinessDetails = () => {
<p> <p>
<FaArrowRight /> Your bank account details for receiving payments from ZanGO <FaArrowRight /> Your bank account details for receiving payments from ZanGO
</p> </p>
<p className="mb-4"> {/* <p className="mb-4">
<FaArrowRight /> Tax (GST/PAN) details of your business. <FaArrowRight /> Tax (GST/PAN) details of your business.
</p> </p> */}
<hr /> <hr />
<div className="form-container mt-4"> <div className="form-container mt-4">
<ApprovalStatus /> <ApprovalStatus />
......
pages/api/auth/[...nextauth].js
...@@ -42,8 +42,9 @@ export default NextAuth({ ...@@ -42,8 +42,9 @@ export default NextAuth({
password: password password: password
}); });
// console.log("Axios login returned with data:"); // console.log("Axios login returned with data:");
// console.log("userResponse", userResponse.data); console.log("userResponse", userResponse.data);
// console.log(jwt); // console.log(jwt);
// Response from the above call can be // Response from the above call can be
...@@ -86,7 +87,7 @@ export default NextAuth({ ...@@ -86,7 +87,7 @@ export default NextAuth({
// Sign In Fail // Sign In Fail
// return null; // return null;
throw new Error(error.response.data.error.message); throw new Error("Invalid credentials");
} }
} }
}) })
......
pages/blog.js
...@@ -3,6 +3,7 @@ import Blog from "../components/blog/Blog"; ...@@ -3,6 +3,7 @@ import Blog from "../components/blog/Blog";
import Home from "../components/home/Home"; import Home from "../components/home/Home";
import Layout from "../components/layout/Layout"; import Layout from "../components/layout/Layout";
import { getBlogData, getBlogsData } from "../redux/actions/blogAction"; import { getBlogData, getBlogsData } from "../redux/actions/blogAction";
import { getAllCategories } from "../redux/actions/categoriesAction";
import { loadUser } from "../redux/actions/userActions"; import { loadUser } from "../redux/actions/userActions";
import { wrapper } from "../redux/store"; import { wrapper } from "../redux/store";
...@@ -19,8 +20,8 @@ export default function BlogsPage() { ...@@ -19,8 +20,8 @@ export default function BlogsPage() {
export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => { export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => {
try { try {
await store.dispatch(getBlogsData()) await store.dispatch(getBlogsData({}))
await store.dispatch(getAllCategories())
return { return {
props: {}, props: {},
// Next.js will attempt to re-generate the page: // Next.js will attempt to re-generate the page:
......
pages/forgot-password.js 0 → 100644
import React from "react";
import ForgotPassword from "../components/common-components/ForgotPassword";
import Layout from "../components/layout/Layout";
const ForgotPasswordPage = () => {
return (
<div>
<Layout>
<ForgotPassword />
</Layout>
</div>
);
};
export default ForgotPasswordPage;
pages/vendor/activity-details/index.js
...@@ -6,13 +6,15 @@ import { loadUser } from "../../../redux/actions/userActions"; ...@@ -6,13 +6,15 @@ import { loadUser } from "../../../redux/actions/userActions";
import { getLoggedInVendor } from "../../../redux/actions/vendorActions"; import { getLoggedInVendor } from "../../../redux/actions/vendorActions";
import { wrapper } from "../../../redux/store"; import { wrapper } from "../../../redux/store";
import { GenericLayout } from "../../../components/layout/Generics/GenericLayout"; import { GenericLayout } from "../../../components/layout/Generics/GenericLayout";
import { useSelector } from "react-redux";
export default function ActivityDetailsPage() { export default function ActivityDetailsPage() {
const { loadedUser, error } = useSelector(state => state.loadedUser);
return ( return (
// <Layout> // <Layout>
<GenericLayout> <GenericLayout>
<ActivityDetails isUpdate={false} /> <ActivityDetails isUpdate={false} loadedUser={loadedUser} />
</GenericLayout> </GenericLayout>
); );
}; };
......
redux/actions/blogAction.js
...@@ -3,58 +3,55 @@ import qs from "qs"; ...@@ -3,58 +3,55 @@ import qs from "qs";
import { FETCH_BLOGS_FAIL, FETCH_BLOGS_REQUEST, FETCH_BLOGS_SUCCESS, FETCH_BLOG_FAIL, FETCH_BLOG_REQUEST, FETCH_BLOG_SUCCESS } from "../constants/blogConstants"; import { FETCH_BLOGS_FAIL, FETCH_BLOGS_REQUEST, FETCH_BLOGS_SUCCESS, FETCH_BLOG_FAIL, FETCH_BLOG_REQUEST, FETCH_BLOG_SUCCESS } from "../constants/blogConstants";
export const getBlogsData = export const getBlogsData =
() => ({ subCategories }) =>
async dispatch => { async dispatch => {
try { try {
console.log("HI >>>>>") console.log("HI >>>>>");
dispatch({ dispatch({
type: FETCH_BLOGS_REQUEST type: FETCH_BLOGS_REQUEST
}); });
const config = { const config = {
headers: { headers: {
"Content-Type": "application/json" "Content-Type": "application/json"
} }
}; };
const query = { const query = {
// pagination: { // pagination: {
// pageSize: 12, // pageSize: 12,
// page: currentPage // page: currentPage
// }, // },
filters: { filters: {
category: { category: {
name: {} name: {}
}
}, },
populate: ["image"], $or: subCategories
sort: ["updatedAt:desc"] },
// pagination: {} populate: ["image", "subCategory"],
// pageSize: -1, sort: ["updatedAt:desc"]
}; // pagination: {}
// pageSize: -1,
};
const queryString = qs.stringify(query, {
encodeValuesOnly: true
});
const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/blogs/?${queryString}`); const queryString = qs.stringify(query, {
encodeValuesOnly: true
});
dispatch({ const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/blogs/?${queryString}`, config);
// type: published ? PUBLISHED_ROOMS_SUCCESS : ADMIN_ROOMS_SUCCESS,
type: FETCH_BLOGS_SUCCESS,
payload: response.data
});
} catch (error) {
dispatch({ dispatch({
// type: published ? PUBLISHED_ROOMS_FAIL : ADMIN_ROOMS_FAIL, type: FETCH_BLOGS_SUCCESS,
type: FETCH_BLOGS_FAIL, payload: response.data
payload: error.response.data });
}); } catch (error) {
} dispatch({
}; // type: published ? PUBLISHED_ROOMS_FAIL : ADMIN_ROOMS_FAIL,
type: FETCH_BLOGS_FAIL,
payload: error.response.data
});
}
};
export const getBlogData = slug => async dispatch => { export const getBlogData = slug => async dispatch => {
try { try {
dispatch({ dispatch({
type: FETCH_BLOG_REQUEST type: FETCH_BLOG_REQUEST
...@@ -62,7 +59,7 @@ export const getBlogData = slug => async dispatch => { ...@@ -62,7 +59,7 @@ export const getBlogData = slug => async dispatch => {
const query = { const query = {
filters: {}, filters: {},
populate: ["image","profilePic"], populate: ["image", "profilePic"],
pagination: {} pagination: {}
}; };
// if (country) { // if (country) {
...@@ -84,7 +81,6 @@ export const getBlogData = slug => async dispatch => { ...@@ -84,7 +81,6 @@ export const getBlogData = slug => async dispatch => {
payload: response.data payload: response.data
}); });
} catch (error) { } catch (error) {
dispatch({ dispatch({
// type: published ? PUBLISHED_ROOMS_FAIL : ADMIN_ROOMS_FAIL, // type: published ? PUBLISHED_ROOMS_FAIL : ADMIN_ROOMS_FAIL,
type: FETCH_BLOG_FAIL, type: FETCH_BLOG_FAIL,
......
redux/actions/categoriesAction.js
...@@ -24,7 +24,7 @@ export const getAllCategories = () => async dispatch => { ...@@ -24,7 +24,7 @@ export const getAllCategories = () => async dispatch => {
} }
}; };
const query = { const query = {
populate: ["image"] populate: ["image", "subCategories"]
}; };
const queryString = qs.stringify(query, { const queryString = qs.stringify(query, {
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!