From f0badda8ba0c033f8fb8167869e26698da4355ea Mon Sep 17 00:00:00 2001 From: ahmedjadan Date: Sat, 4 Sep 2021 06:15:58 +0200 Subject: [PATCH] attaching products in the cart to the order schema --- next.config.js | 11 +++++++---- package-lock.json | 15 +++++++++++++++ package.json | 3 +++ pages/checkout.js | 11 +++++++++-- pages/confirm/[code].js | 4 ++-- pages/index.js | 21 +++++++++++---------- pages/order/[code].js | 3 +-- pages/product/[slug].js | 4 ++-- services/fetchData.js | 8 ++++++-- src/components/addToCartButton/AddToCart.js | 5 +---- src/components/context/CartContext.js | 2 +- 11 files changed, 58 insertions(+), 29 deletions(-) diff --git a/next.config.js b/next.config.js index dccb6d3..394bf78 100644 --- a/next.config.js +++ b/next.config.js @@ -2,8 +2,11 @@ module.exports = { images: { domains: ['res.cloudinary.com'] }, - // publicRuntimeConfig: { - // // Will be available on both server and client - // backendUrl: process.env.NEXT_PUBLIC_STRAPI_API_URL, - // }, + // images: { + // domains: ['http://localhost:1337/'] + // }, + publicRuntimeConfig: { + // Will be available on both server and client + backendUrl: process.env.NEXT_PUBLIC_STRAPI_API_URL, + }, } \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index bd5b093..10b7395 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1639,6 +1639,21 @@ } } }, + "js-cookie": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.1.tgz", + "integrity": "sha512-+0rgsUXZu4ncpPxRL+lNEptWMOWl9etvPHc/koSRp6MPwpRYAhmk0dUG00J4bxVV3r9uUzfo24wW0knS07SKSw==" + }, + "js-cookie-fg": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/js-cookie-fg/-/js-cookie-fg-2.1.0.tgz", + "integrity": "sha1-fKFsdGQjHnDgXcvTPs19B5QK9Ac=" + }, + "js-cookies": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/js-cookies/-/js-cookies-1.0.4.tgz", + "integrity": "sha1-1G5XbEIP9tVULA9SttTvfWN+dU4=" + }, "js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", diff --git a/package.json b/package.json index 8d72da6..7fba295 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,9 @@ "formik": "^2.2.9", "graphql": "^15.5.1", "graphql-request": "^3.4.0", + "js-cookie": "^3.0.1", + "js-cookie-fg": "^2.1.0", + "js-cookies": "^1.0.4", "next": "^11.1.0", "nprogress": "^0.2.0", "react": "17.0.2", diff --git a/pages/checkout.js b/pages/checkout.js index 9e08959..fc714c6 100644 --- a/pages/checkout.js +++ b/pages/checkout.js @@ -2,7 +2,7 @@ import { useContext } from 'react' import Head from 'next/head' import { useRouter } from 'next/router'; import { useFormik } from 'formik'; -import { fetchProducts, createOrder } from '@/services/fetchData' +import { fetchProducts, createOrder, createCartOrder } from '@/services/fetchData' import * as Yup from 'yup'; import Layout from '@/src/Layout/Layout' import { CartContext } from '@/src/components/context/CartContext' @@ -30,9 +30,12 @@ export default function checkout({ item }) { onSubmit: async values => { console.log("checkout ~ values", values) const { items = [] } = cart + console.log("checkout ~ items", items) const productId = items?.map((item) => `id_in=${item.id}`) const query = productId.join('&') + + try { const products = await fetchProducts(query) @@ -41,9 +44,13 @@ export default function checkout({ item }) { const product = products?.find((p) => p.id === item.id) total += item.qty * product.price.toFixed(2) }) + + const product_cart = items?.map((item) => { + return { product_name: item.name, quantity: item.qty } + }) const order = await createOrder({ - ...values, total: String(total), products, + ...values, total: String(total), products: product_cart }) console.log("checkout ~ order", order) router.push(`/order/${order.code}`) diff --git a/pages/confirm/[code].js b/pages/confirm/[code].js index af57132..ecf7e27 100644 --- a/pages/confirm/[code].js +++ b/pages/confirm/[code].js @@ -3,8 +3,8 @@ import Layout from '@/src/Layout/Layout' import { fetchOrder } from '@/services/fetchData' export default function confirm({ orders }) { -// console.log("confirm ~ orders", orders) - + // console.log("confirm ~ orders", orders) + return (
diff --git a/pages/index.js b/pages/index.js index f1445bd..e3a994e 100644 --- a/pages/index.js +++ b/pages/index.js @@ -3,7 +3,7 @@ import Layout from '@/src/Layout/Layout' import ProductItem from '@/src/components/ProductItem' import useSWR from 'swr' -export default function index() { +export default function index({ products }) { const { data, error } = useSWR('https://dry-plateau-13030.herokuapp.com/products?_limit=5') @@ -31,17 +31,18 @@ export default function index() { //with REST API -// export async function getServerSideProps() { -// const data = await fetch(`https://dry-plateau-13030.herokuapp.com/products`) -// console.log("getServerSideProps ~ data", data) +export async function getServerSideProps() { + const data = await fetch(`https://dry-plateau-13030.herokuapp.com/products`) + console.log("getServerSideProps ~ data", data) -// const products = await data.json() -// //const products = await fetchAllProducts('/products') + const products = await data.json() + //const products = await fetchAllProducts('/products') + + return { + props: { products }, + } +} -// return { -// props: { products }, -// } -// } // export async function getStaticProps() { // const graphcms = new GraphQLClient('https://dry-plateau-13030.herokuapp.com/graphql'); // const { products } = await graphcms.request( diff --git a/pages/order/[code].js b/pages/order/[code].js index a524983..1c19b23 100644 --- a/pages/order/[code].js +++ b/pages/order/[code].js @@ -66,7 +66,7 @@ export default function orders() {
- {/*

{item.qty}

*/} +

{item.qty}

@@ -75,7 +75,6 @@ export default function orders() {
{/*

${' '}{(item.price * item.qty).toFixed(2)}

*/}
-
))} diff --git a/pages/product/[slug].js b/pages/product/[slug].js index 99ad1b0..b11aeb9 100644 --- a/pages/product/[slug].js +++ b/pages/product/[slug].js @@ -5,8 +5,8 @@ import ProductLayout from '@/src/Layout/ProductLayout' import Layout from '@/src/Layout/Layout' import Images from '@/src/components/Images' -export default function products({products}) { - +export default function products({ products }) { + const { data: products_attach, error } = useSWR('https://dry-plateau-13030.herokuapp.com/products') const product = products?.map(({ name }) => name) diff --git a/services/fetchData.js b/services/fetchData.js index ac40a31..547ede2 100644 --- a/services/fetchData.js +++ b/services/fetchData.js @@ -5,7 +5,7 @@ const fetcher = url => axios.patch(url).then(res => res.data) const createAxios = () => { const params = { - baseURL: process.env.NEXT_PUBLIC_STRAPI_API_URL, + baseURL: process.env.NEXT_PUBLIC_STRAPI_API_URL }; return axios.create(params); }; @@ -20,6 +20,10 @@ export const createOrder = async order => { const { data } = await createAxios().post('/orders', order); return data; } +export const createCartOrder = async order => { + const { data } = await createAxios().post('/cart-products', order); + return data; +} //fetch all products to the main index.js export const fetchAllProducts = async products => { const { data } = await createAxios().get(products); @@ -33,7 +37,7 @@ export const fetchOrder = async order => { } export const patchOrder = async (code) => { const { data } = await createAxios().patch(`/orders/${code}`); - + // console.log("patchOrder ~ data", data) return data } diff --git a/src/components/addToCartButton/AddToCart.js b/src/components/addToCartButton/AddToCart.js index 3be92e3..e105620 100644 --- a/src/components/addToCartButton/AddToCart.js +++ b/src/components/addToCartButton/AddToCart.js @@ -4,13 +4,11 @@ import { CartContext } from '@/components/context/CartContext' export default function AddToCartButton() { - const { addToCart, cart, DecrementCartQnty, IncrementCartQnty } = useContext(CartContext) - + const { addToCart, cart } = useContext(CartContext) return (
{cart.items.map((item) => ( -
))} - ) diff --git a/src/components/context/CartContext.js b/src/components/context/CartContext.js index 24db855..51cfa79 100644 --- a/src/components/context/CartContext.js +++ b/src/components/context/CartContext.js @@ -96,4 +96,4 @@ export const CaretProvider = ({ children }) => { {children} ) -} +} \ No newline at end of file