Skip to content

Jay Mehta / zango-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit 0345c913 by jaymehta
Options

vendor journey

1 parent c2ebaf43
Expand all
Inline Side-by-side
Showing 11 changed files with 244 additions and 47 deletions
components/layout/Header.js
......@@ -10,14 +10,10 @@ import { loadUser } from "../../redux/actions/userActions";
const Header = () => {
const { user, error } = useSelector(state => state.loadedUser);
const dispatch = useDispatch();
console.log("user", user);
// console.log("user", user);
const [isSticky, setIsSticky] = useState(false);
useEffect(() => {
dispatch(loadUser());
}, []);
useEffect(() => {
const handleScroll = () => {
// Check if the scroll position is greater than a certain threshold
const scrollY = window.scrollY || window.pageYOffset;
......@@ -63,11 +59,21 @@ const Header = () => {
</div>
</Form>
{/* {console.log(user.id)} */}
{(user && user.id) ? (
{user && user.id ? (
<div>
{console.log("here")}
<div><p>Brand Logo</p></div>
<div>
<p>Brand Logo</p>
</div>
<p>{user.phone}</p>
<Button
onClick={() => {
signOut({ redirect: false });
}}
className="me-3"
variant="primary"
>
Log out
</Button>
</div>
) : (
<div>
......
components/layout/Layout.js
import React from "react";
import React, { useEffect } from "react";
import Head from "next/head";
import Header from "./Header";
import Footer from "./Footer";
import { ToastContainer } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import { loadUser } from "../../redux/actions/userActions";
import { useDispatch } from "react-redux";
const Layout = ({ children, title = "Zango", description = "" }) => {
const dispatch = useDispatch();
useEffect(() => {
dispatch(loadUser());
}, []);
return (
<div>
<Head>
......
components/vendor/BusinessDetails.js
......@@ -6,29 +6,33 @@ import { FaArrowRight, FaTimes } from "react-icons/fa";
import Image from "next/image";
import { getSession } from "next-auth/react";
import "react-bootstrap-typeahead/css/Typeahead.css";
import { useDispatch } from "react-redux";
import { getLoggedInVendor } from "../../redux/actions/vendorActions";
import { useDispatch, useSelector } from "react-redux";
import { getLoggedInVendor, updateVendorBusinessDetails } from "../../redux/actions/vendorActions";
const BusinessDetails = () => {
const [session, setSession] = useState(null);
const dispatch = useDispatch()
const dispatch = useDispatch();
const { loggedInVendor } = useSelector(state => state.loggedInVendor);
const { vendorDetails } = useSelector(state => state.vendorDetails);
// const [pincodeData, setPinCodeData] = useState()
// const ref = useRef(null);
console.log("vendorDetails", vendorDetails);
useEffect(() => {
const fetchSession = async () => {
setSession(await getSession());
};
fetchSession();
// dispatch(getLoggedInVendor());
}, []);
console.log("session", session);
console.log("session", loggedInVendor);
const businessDetailsValidationSchema = Yup.object().shape({
panNumber: Yup.string().required("Pan Number is Required"),
panFile: Yup.mixed().required("Pan Image is Required"),
panFile: Yup.mixed(),
gstNumber: Yup.string().required("GST Number is Required"),
gstCertificateFile: Yup.mixed().required("GST Certificate is Required"),
gstCertificateFile: Yup.mixed(),
businessName: Yup.string().required("Business Name is Required"),
brandLogoFile: Yup.mixed().required("Brand Logo is Required"),
brandLogoFile: Yup.mixed(),
pincode: Yup.string().required("Pincode is Required"),
country: Yup.string().required("Country is Required"),
state: Yup.string().required("State is Required"),
......@@ -42,6 +46,26 @@ const BusinessDetails = () => {
// console.log("pincodeData", pincodeDataSet.data.data);
// setPinCodeData(pincodeDataSet.data.data)
// };
let vendorData;
if (vendorDetails) {
vendorData = {
panNumber: vendorDetails.attributes.pan,
panFile: vendorDetails.attributes.panImage,
gstNumber: vendorDetails.attributes.gst,
gstCertificateFile: vendorDetails.attributes.gstImage,
businessName: vendorDetails.attributes.businessName,
brandLogoFile: vendorDetails.attributes.logo,
pincode: vendorDetails.attributes.pincode,
country: vendorDetails.attributes.country,
state: vendorDetails.attributes.state,
city: vendorDetails.attributes.city,
addressLine1: vendorDetails.attributes.addressLine1,
addressLine2: vendorDetails.attributes.addressLine2
};
}
// vendorDetails && console.log("vendorData", vendorData, vendorDetails.length > 0);
return (
<Fragment>
<div className="container p-5">
......@@ -59,19 +83,20 @@ const BusinessDetails = () => {
<hr />
<div className="form-container mt-4">
<Formik
enableReinitialize
initialValues={{
panNumber: "",
panFile: "",
gstNumber: "",
gstCertificateFile: "",
businessName: "",
brandLogoFile: "",
pincode: "",
country: "",
state: "",
city: "",
addressLine1: "",
addressLine2: ""
panNumber: vendorData?.panNumber ? vendorData?.panNumber : "",
panFile: vendorData?.panImage ? vendorData?.panImage : "",
gstNumber: vendorData?.gstNumber ? vendorData?.gstNumber : "",
gstCertificateFile: vendorData?.gstImage ? vendorData?.gstImage : "",
businessName: vendorData?.businessName ? vendorData?.businessName : "",
brandLogoFile: vendorData?.logo ? vendorData?.logo : "",
pincode: vendorData?.pincode ? vendorData?.pincode : "",
country: vendorData?.country ? vendorData?.country : "",
state: vendorData?.state ? vendorData?.state : "",
city: vendorData?.city ? vendorData?.city : "",
addressLine1: vendorData?.addressLine1 ? vendorData?.addressLine1 : "",
addressLine2: vendorData?.addressLine2 ? vendorData?.addressLine2 : ""
}}
validationSchema={businessDetailsValidationSchema}
// enableReinitialize={true}
......@@ -88,7 +113,12 @@ const BusinessDetails = () => {
};
// await dispatch(updateVendorBusinessDetails({businessDetails, }))
dispatch(getLoggedInVendor())
const response = await dispatch(getLoggedInVendor());
console.log("loggedInVendorReducer", response);
const updateBusinessDetails = await dispatch(updateVendorBusinessDetails({ businessDetails, vendorId: response.id }));
console.log("updateBusinessDetails", updateBusinessDetails);
}}
>
{({ values, errors, touched, handleChange, handleBlur, handleSubmit, setFieldValue }) => (
......
pages/api/auth/[...nextauth].js
......@@ -43,7 +43,7 @@ export default NextAuth({
});
// 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
......@@ -87,8 +87,8 @@ export default NextAuth({
],
callbacks: {
session: async ({ session, token }) => {
console.log("session 1", session);
console.log("session 2", token);
// console.log("session 1", session);
// console.log("session 2", token);
session.id = token.id;
session.jwt = token.jwt;
......@@ -98,8 +98,8 @@ export default NextAuth({
return Promise.resolve(session);
},
jwt: async ({ token, user }) => {
console.log("user 1", user);
console.log("token 1", token);
// console.log("user 1", user);
// console.log("token 1", token);
const isSignIn = user ? true : false;
if (isSignIn) {
......
pages/index.js
import Home from "../components/home/Home";
import Layout from "../components/layout/Layout";
import { loadUser } from "../redux/actions/userActions";
import { wrapper } from "../redux/store";
export default function IndexPage() {
......@@ -24,7 +25,7 @@ export const getServerSideProps = wrapper.getServerSideProps(store => async ({ r
// Get the menu data.
// get the locations data.
// await store.dispatch(loadUser())
return {
props: {},
......
pages/vendor/business-details/index.js
import React from "react";
import React, { useEffect } from "react";
import { useDispatch } from "react-redux";
import Layout from "../../../components/layout/Layout";
import BusinessDetails from "../../../components/vendor/BusinessDetails";
import { loadUser } from "../../../redux/actions/userActions";
import { getVendorDetails } from "../../../redux/actions/vendorActions";
import { wrapper } from "../../../redux/store";
// import { loadUser } from "../redux/actions/userActions";
// import { wrapper } from "../redux/store";
export default function BusinessDetailsPage () {
const dispatch = useDispatch()
useEffect(() => {
dispatch(getVendorDetails())
}, [])
return (
<Layout>
<BusinessDetails />
</Layout>
);
};
\ No newline at end of file
};
/** For server side rendering */
export const getServerSideProps = wrapper.getServerSideProps(store => async ({ req, query }) => {
// Get the menu data.
// get the locations data.
// await store.dispatch(getVendorDetails())
return {
props: {},
};
});
\ No newline at end of file
redux/actions/vendorActions.js
......@@ -5,6 +5,9 @@ import {
GET_LOGGED_IN_VENDOR_FAIL,
GET_LOGGED_IN_VENDOR_REQUEST,
GET_LOGGED_IN_VENDOR_SUCCESS,
GET_VENDOR_DETAILS_FAIL,
GET_VENDOR_DETAILS_REQUEST,
GET_VENDOR_DETAILS_SUCCESS,
UPDATE_VENDOR_DETAILS_FAIL,
UPDATE_VENDOR_DETAILS_REQUEST,
UPDATE_VENDOR_DETAILS_SUCCESS
......@@ -66,13 +69,14 @@ export const updateVendorBusinessDetails =
const response = await axios.put(
`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/vendors/${vendorId}`,
{
businessDetails
data: businessDetails
},
config
);
dispatch({
type: UPDATE_VENDOR_DETAILS_SUCCESS
});
return response.data;
} catch (error) {
dispatch({
type: UPDATE_VENDOR_DETAILS_FAIL
......@@ -103,7 +107,7 @@ export const getLoggedInVendor = () => async dispatch => {
const query = {
filters: {
user: {
$eq: session.id
id: { $eq: session.id }
}
}
};
......@@ -112,16 +116,65 @@ export const getLoggedInVendor = () => async dispatch => {
encodeValuesOnly: true
});
const response = await axios.get(
`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/vendors/${queryString}`, config
);
console.log("response", response.data);
const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/vendors/?${queryString}`, config);
console.log("response", response.data.data[0]);
dispatch({
type: GET_LOGGED_IN_VENDOR_SUCCESS
});
return response.data.data[0];
} catch (error) {
dispatch({
type: GET_LOGGED_IN_VENDOR_FAIL
});
}
};
export const getVendorDetails = () => async dispatch => {
const session = await getSession();
try {
dispatch({
type: GET_VENDOR_DETAILS_REQUEST
});
console.log("here 1", session);
const config = {
headers: {
"Content-Type": "Application/json",
Authorization: `Bearer ${session.jwt}`
}
};
console.log("here 2");
if (!session) {
return;
}
const query = {
filters: {
user: {
id: {
$eq: session.id
}
}
},
populate: ["user"]
};
console.log("here 3", query);
const queryString = qs.stringify(query, {
encodeValuesOnly: true
});
console.log("session", session, session.id);
const response = await axios.get(`${process.env.NEXT_PUBLIC_BACKEND_API_URL}/api/vendors/?${queryString}`, config);
console.log("response", response);
dispatch({
type: GET_VENDOR_DETAILS_SUCCESS,
payload: response.data.data[0]
});
return response.data.data[0];
} catch (error) {
dispatch({
type: GET_VENDOR_DETAILS_FAIL,
payload: error.response.data
});
}
};
redux/constants/vendorConstants.js
......@@ -6,4 +6,8 @@ export const UPDATE_VENDOR_DETAILS_REQUEST = "UPDATE_VENDOR_DETAILS_REQUEST"
export const UPDATE_VENDOR_DETAILS_SUCCESS = "UPDATE_VENDOR_DETAILS_SUCCESS"
export const UPDATE_VENDOR_DETAILS_FAIL = "UPDATE_VENDOR_DETAILS_FAIL"
export const GET_VENDOR_DETAILS_REQUEST = "GET_VENDOR_DETAILS_REQUEST"
export const GET_VENDOR_DETAILS_SUCCESS = "GET_VENDOR_DETAILS_SUCCESS"
export const GET_VENDOR_DETAILS_FAIL = "GET_VENDOR_DETAILS_FAIL"
export const CLEAR_ERRORS = "CLEAR_ERRORS";
\ No newline at end of file
redux/reducers/reducers.js
......@@ -4,6 +4,7 @@ import { townshipReducer, townshipsReducer } from "./townshipsReducer";
import { authReducer, forgotPasswordReducer, loadedUserReducer, resetPasswordReducer, userReducer } from "./userReducers";
import { enquiryReducer } from "./enquiryReducer";
import { displayEnquireNowReducer } from "./enquireNowModalReducer";
import { getVendorDetailsReducer, loggedInVendorReducer, updateVendorReducer } from "./vendorReducers";
const reducers = combineReducers({
townships: townshipsReducer,
......@@ -17,7 +18,10 @@ const reducers = combineReducers({
resetPassword: resetPasswordReducer,
similarProjects: similarProjectsReducer,
enquiry: enquiryReducer,
displayEnquireNow:displayEnquireNowReducer
displayEnquireNow:displayEnquireNowReducer,
loggedInVendor: loggedInVendorReducer,
updatedVendorData: updateVendorReducer,
vendorDetails: getVendorDetailsReducer,
});
export default reducers;
redux/reducers/vendorReducers.js
import { UPDATE_VENDOR_DETAILS_FAIL, UPDATE_VENDOR_DETAILS_REQUEST, UPDATE_VENDOR_DETAILS_SUCCESS, CLEAR_ERRORS } from "../constants/vendorConstants";
import { UPDATE_VENDOR_DETAILS_FAIL, UPDATE_VENDOR_DETAILS_REQUEST, UPDATE_VENDOR_DETAILS_SUCCESS, CLEAR_ERRORS, GET_LOGGED_IN_VENDOR_REQUEST, GET_LOGGED_IN_VENDOR_SUCCESS, GET_LOGGED_IN_VENDOR_FAIL, GET_VENDOR_DETAILS_FAIL, GET_VENDOR_DETAILS_SUCCESS, GET_VENDOR_DETAILS_REQUEST } from "../constants/vendorConstants";
// Load user reducer
export const loggedInVendorReducer = (state = { loading: true, success: false, loggedInVendor: null }, action) => {
switch (action.type) {
case GET_LOGGED_IN_VENDOR_REQUEST:
return {
loading: true,
isAuthenticated: false
};
case GET_LOGGED_IN_VENDOR_SUCCESS:
return {
loading: false,
isAuthenticated: true,
loggedInVendor: action.payload
};
case GET_LOGGED_IN_VENDOR_FAIL:
return {
loading: false,
isAuthenticated: true,
error: action.payload.error.message
};
case CLEAR_ERRORS:
return {
...state,
error: null
};
default:
return state;
}
};
export const updateVendorReducer = (state = {}, action) => {
switch (action.type) {
......@@ -27,3 +62,36 @@ export const updateVendorReducer = (state = {}, action) => {
return state;
}
};
export const getVendorDetailsReducer = (state = { loading: true, success: false, vendorDetails: null }, action) => {
switch (action.type) {
case GET_VENDOR_DETAILS_REQUEST:
return {
loading: true,
isAuthenticated: false
};
case GET_VENDOR_DETAILS_SUCCESS:
return {
loading: false,
isAuthenticated: true,
vendorDetails: action.payload
};
case GET_VENDOR_DETAILS_FAIL:
return {
loading: false,
isAuthenticated: true,
error: action.payload.error.message
};
case CLEAR_ERRORS:
return {
...state,
error: null
};
default:
return state;
}
};
\ No newline at end of file
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!