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 axios from 'axios';
import React, { useEffect, useState } from 'react'
import { Table } from "antd";
import axios from "axios";
import React, { useEffect, useState } from "react";
import dayjs from 'dayjs';
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
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";
import PageBanner from "./PageBanner.js";
import { useDispatch, useSelector } from "react-redux";
const Blog = () => {
const { blogs } = useSelector(state => state.blogs);
const { blogs, loading } = useSelector(state => state.blogs);
console.log("blogs", blogs)
return (
<>
<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 = () => {
// Handle form submission here
}}
>
{({ isSubmitting, values, handleChange, handleBlur, touched, errors }) => (
{({ isSubmitting, values, handleChange, handleBlur, touched, errors, setErrors }) => (
<Form action="" className="form-01">
<div className="title">Buy a gift card</div>
<div className="cl-gry">Please select an amount</div>
......@@ -210,12 +210,21 @@ const GiftCard = () => {
<Field
className="form-control"
type="number"
min="1"
name="customAmt"
placeholder="Enter your amount"
onChange={e => {
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}
/>
{touched.customAmt && errors.customAmt && <div className="text-danger">{errors.customAmt}</div>}
......@@ -362,7 +371,6 @@ const GiftCard = () => {
onChange={handleChange}
onBlur={handleBlur}
value={values.code}
/>
{touched.code && errors.code && <div className="text-danger">{errors.code}</div>}
{/* <div className="link-a">
......
components/layout/Generics/GenericSidebar.js
......@@ -2,8 +2,10 @@ import Image from "next/image";
import Link from "next/link";
import { useRouter } from "next/router";
import React from "react";
import { useSelector } from "react-redux";
export const GenericSidebar = ({ isRoute }) => {
const router = useRouter();
const { loadedUser, error } = useSelector(state => state.loadedUser);
const VenderRoutes = () => {
return (
<ul>
......@@ -15,14 +17,16 @@ export const GenericSidebar = ({ isRoute }) => {
</span>
</Link>
</li>
<li className={router.pathname === "/vendor/activity-details" ? "active" : ""}>
<Link href="/vendor/activity-details">
<span className="d-flex cursor-pointer">
<Image className="" alt="" width={25} height={18} src="/images/vendor/add-activity.svg" />
<div className="mx-2">Add Activity</div>
</span>
</Link>
</li>
{loadedUser && loadedUser.approved == "approved" && (
<li className={router.pathname === "/vendor/activity-details" ? "active" : ""}>
<Link href="/vendor/activity-details">
<span className="d-flex cursor-pointer">
<Image className="" alt="" width={25} height={18} src="/images/vendor/add-activity.svg" />
<div className="mx-2">Add Activity</div>
</span>
</Link>
</li>
)}
<li className={router.pathname === "/vendor/business-details" ? "active" : ""}>
<Link href="/vendor/business-details">
<span className="d-flex cursor-pointer">
......
components/login/Login.js
......@@ -115,6 +115,7 @@ const Login = props => {
</Form>
)}
</Formik>
<div className="input-group justify-content-center">
<p className="text-center mb-0">
or{" "}
......@@ -123,6 +124,14 @@ const Login = props => {
</Link>
</p>
</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" && (
<>
<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 = () => {
<p>
<FaArrowRight /> Your bank account details for receiving payments from ZanGO
</p>
<p className="mb-4">
{/* <p className="mb-4">
<FaArrowRight /> Tax (GST/PAN) details of your business.
</p>
</p> */}
<hr />
<div className="form-container mt-4">
<ApprovalStatus />
......
pages/api/auth/[...nextauth].js
......@@ -42,8 +42,9 @@ export default NextAuth({
password: password
});
// console.log("Axios login returned with data:");
// console.log("userResponse", userResponse.data);
console.log("userResponse", userResponse.data);
// console.log(jwt);
// Response from the above call can be
......@@ -86,7 +87,7 @@ export default NextAuth({
// Sign In Fail
// 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";
import Home from "../components/home/Home";
import Layout from "../components/layout/Layout";
import { getBlogData, getBlogsData } from "../redux/actions/blogAction";
import { getAllCategories } from "../redux/actions/categoriesAction";
import { loadUser } from "../redux/actions/userActions";
import { wrapper } from "../redux/store";
......@@ -19,8 +20,8 @@ export default function BlogsPage() {
export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => {
try {
await store.dispatch(getBlogsData())
await store.dispatch(getBlogsData({}))
await store.dispatch(getAllCategories())
return {
props: {},
// 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";
import { getLoggedInVendor } from "../../../redux/actions/vendorActions";
import { wrapper } from "../../../redux/store";
import { GenericLayout } from "../../../components/layout/Generics/GenericLayout";
import { useSelector } from "react-redux";
export default function ActivityDetailsPage() {
const { loadedUser, error } = useSelector(state => state.loadedUser);
return (
// <Layout>
<GenericLayout>
<ActivityDetails isUpdate={false} />
<ActivityDetails isUpdate={false} loadedUser={loadedUser} />
</GenericLayout>
);
};
......
redux/actions/blogAction.js
......@@ -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";
export const getBlogsData =
() =>
async dispatch => {
try {
console.log("HI >>>>>")
dispatch({
type: FETCH_BLOGS_REQUEST
});
const config = {
headers: {
"Content-Type": "application/json"
}
};
const query = {
// pagination: {
// pageSize: 12,
// page: currentPage
// },
filters: {
category: {
name: {}
}
({ subCategories }) =>
async dispatch => {
try {
console.log("HI >>>>>");
dispatch({
type: FETCH_BLOGS_REQUEST
});
const config = {
headers: {
"Content-Type": "application/json"
}
};
const query = {
// pagination: {
// pageSize: 12,
// page: currentPage
// },
filters: {
category: {
name: {}
},
populate: ["image"],
sort: ["updatedAt:desc"]
// pagination: {}
// pageSize: -1,
};
const queryString = qs.stringify(query, {
encodeValuesOnly: true
});
$or: subCategories
},
populate: ["image", "subCategory"],
sort: ["updatedAt:desc"]
// pagination: {}
// pageSize: -1,
};
const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/blogs/?${queryString}`);
const queryString = qs.stringify(query, {
encodeValuesOnly: true
});
dispatch({
// type: published ? PUBLISHED_ROOMS_SUCCESS : ADMIN_ROOMS_SUCCESS,
type: FETCH_BLOGS_SUCCESS,
payload: response.data
});
} catch (error) {
const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/blogs/?${queryString}`, config);
dispatch({
// type: published ? PUBLISHED_ROOMS_FAIL : ADMIN_ROOMS_FAIL,
type: FETCH_BLOGS_FAIL,
payload: error.response.data
});
}
};
dispatch({
type: FETCH_BLOGS_SUCCESS,
payload: 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 => {
try {
dispatch({
type: FETCH_BLOG_REQUEST
......@@ -62,7 +59,7 @@ export const getBlogData = slug => async dispatch => {
const query = {
filters: {},
populate: ["image","profilePic"],
populate: ["image", "profilePic"],
pagination: {}
};
// if (country) {
......@@ -84,7 +81,6 @@ export const getBlogData = slug => async dispatch => {
payload: response.data
});
} catch (error) {
dispatch({
// type: published ? PUBLISHED_ROOMS_FAIL : ADMIN_ROOMS_FAIL,
type: FETCH_BLOG_FAIL,
......
redux/actions/categoriesAction.js
......@@ -24,7 +24,7 @@ export const getAllCategories = () => async dispatch => {
}
};
const query = {
populate: ["image"]
populate: ["image", "subCategories"]
};
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!