From 595836524cc890c132fa0f7a3b98146085c0a3c4 Mon Sep 17 00:00:00 2001
From: G-Wang12 <gordonwang0608@gmail.com>
Date: Wed, 6 Sep 2023 22:25:21 -0400
Subject: [PATCH] saving current changes

---
 src/@types/products.d.ts                      | 9 ++++++---
 src/api/products.ts                           | 2 +-
 src/components/ProductCard/ProductDetails.tsx | 5 ++++-
 src/hooks/product-details.ts                  | 1 +
 src/state/products/reducer.ts                 | 1 +
 5 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/@types/products.d.ts b/src/@types/products.d.ts
index cb9cd5553..91394caf4 100644
--- a/src/@types/products.d.ts
+++ b/src/@types/products.d.ts
@@ -8,11 +8,14 @@ declare module "products" {
         picture: string;
     }
     export interface ProductDetails extends Product {
-        variation_name: string;
+        id: number;
         product_id: number;
+        name: string;
+        description: string;
+        category: string;
         price: number;
-        stock: number;
         picture: string;
-        last_updated: string;
+        related_product_ids: string;
+        order_link: string;
     }
 }
\ No newline at end of file
diff --git a/src/api/products.ts b/src/api/products.ts
index dd88cfcbd..fc5070865 100644
--- a/src/api/products.ts
+++ b/src/api/products.ts
@@ -3,7 +3,7 @@ import { Product, ProductDetails } from 'products';
 import { Server } from 'server';
 
 const getProducts = (server: Server) => (): Promise<AxiosResponse<Product[]>> => server.get(`/api/products`);
-const getProductDetails = (server: Server) => (id: number): Promise<AxiosResponse<ProductDetails>> => server.get(`/api/products/${id}`);
+const getProductDetails = (server: Server) => (id: number): Promise<AxiosResponse<ProductDetails>> => server.get(`/api/products/details/${id}`);
 
 export default (server: Server) => ({
     getProducts: getProducts(server),
diff --git a/src/components/ProductCard/ProductDetails.tsx b/src/components/ProductCard/ProductDetails.tsx
index 16e01114a..0df3791c8 100644
--- a/src/components/ProductCard/ProductDetails.tsx
+++ b/src/components/ProductCard/ProductDetails.tsx
@@ -3,6 +3,7 @@ import '../../theme/styles.scss';
 import { ProductDetailsProperty } from 'pages/Shop/Shop';
 import { useParams } from 'react-router';
 import sizeIcon from '../../static/img/merchStore/size-icon.svg';
+import useProductDetails from 'hooks/product-details';
 
 interface ProductDetailsProps {
     data?: ProductDetailsProperty;
@@ -12,7 +13,9 @@ const ProductDetails: React.FC<ProductDetailsProps> = ({
     data
 }) => {
     const { id } = useParams();
-    console.log(id);
+    console.log("id: ", id);
+    const {productDetails} = useProductDetails(id);
+    console.log("product details: ", productDetails);
     return (
         <div className='productDetailsContainer'>
             <div className='productDetailsTop'>
diff --git a/src/hooks/product-details.ts b/src/hooks/product-details.ts
index 88603845c..7049d9461 100644
--- a/src/hooks/product-details.ts
+++ b/src/hooks/product-details.ts
@@ -12,6 +12,7 @@ const useProductDetails = (id: number) => {
           try {
             const response = await api.products.getProductDetails(id);
             const productDetails = response.data;
+            console.log('data here: ', response.data);
             return productDetails;
 
         } catch (err) {
diff --git a/src/state/products/reducer.ts b/src/state/products/reducer.ts
index 7deb378c9..344faa916 100644
--- a/src/state/products/reducer.ts
+++ b/src/state/products/reducer.ts
@@ -36,6 +36,7 @@ export default (state = initialState, action: ProductsAction) => {
           list: action.payload.products,
         };
       case actionTypes.PRODUCTS_SET_PRODUCTDETAILS:
+        console.log('reducer', action.payload?.productDetails)
         return {
           ...state,
           productDetails: action.payload.productDetails,