From 1ca9cd55e4851d19d0f8d4516cd4f6a0931e14ee Mon Sep 17 00:00:00 2001
From: Katia Ghezali <ghezalikatia@hotmail.com>
Date: Sat, 18 Nov 2023 20:27:29 +0100
Subject: [PATCH] fix(single product page): fix getting data from firebase
 issue

fix #31
---
 package-lock.json                             |  2 +-
 .../ProductDetails/ProductDetails.jsx         | 91 +++++++++----------
 src/pages/singleproduct/[productId].jsx       |  2 +-
 3 files changed, 46 insertions(+), 49 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index c3ff1f5..254c6d9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -16167,4 +16167,4 @@
             }
         }
     }
-}
+}
\ No newline at end of file
diff --git a/src/components/ProductDetails/ProductDetails.jsx b/src/components/ProductDetails/ProductDetails.jsx
index 4f142bc..92a2273 100644
--- a/src/components/ProductDetails/ProductDetails.jsx
+++ b/src/components/ProductDetails/ProductDetails.jsx
@@ -133,12 +133,12 @@ const ProductDetails = ({ productId }) => {
 
                     <div className='flex mb-2'>
                         <p className='mr-20'>
-                            <span className='font-bold'>Condition:</span>
+                            <span className='font-bold'>Condition: </span>
                             {productData.condition}
                         </p>
 
                         <p className=''>
-                            <span className='font-bold'>Category:</span>
+                            <span className='font-bold'>Category: </span>
                             {productData.category}
                         </p>
                     </div>
@@ -154,56 +154,53 @@ const ProductDetails = ({ productId }) => {
 
                     {/* User Info */}
                     <div className='mt-2'>
-                        {userData && user ? (
-                            <div className='flex items-center mt-4 bg-gradient-to-r from-[#585785] to-[#FF8A57] rounded-l-full shadow-xl p-4'>
-                                <div className='rounded-full overflow-hidden'>
-                                    <Image
-                                        src={userData.photo}
-                                        width={40}
-                                        height={40}
-                                        className='object-cover w-full h-full'
-                                        alt='user picture'
-                                    />
-                                </div>
-                                <div className='ml-4 flex-1'>
-                                    <div className='flex flex-col'>
-                                        <h2 className='text-xl font-bold text-white'>
-                                            {userData.name} {userData.username}
-                                        </h2>
-                                        <div className='flex items-center'>
-                                            <p className='text-lg text-white mr-2'>
-                                                {userData.email}
+                        {/* {userData && user ? ( */}
+                        <div className='flex items-center mt-4 bg-gradient-to-r from-[#585785] to-[#FF8A57] rounded-l-full shadow-xl p-4'>
+                            <div className='rounded-full overflow-hidden'>
+                                <Image
+                                    src={userData?.photo}
+                                    width={65}
+                                    height={65}
+                                    className='object-cover w-full h-full'
+                                    alt='user picture'
+                                />
+                            </div>
+                            <div className='ml-4 flex-1'>
+                                <div className='flex flex-col'>
+                                    <h2 className='text-xl font-bold text-white'>
+                                        {userData?.name} {userData?.username}
+                                    </h2>
+                                    <div className='flex items-center'>
+                                        <p className='text-lg text-white mr-2'>
+                                            {userData?.email}
+                                        </p>
+                                        <div
+                                            className='text-center text-white ml-auto'
+                                            style={{ marginLeft: "35%" }}
+                                        >
+                                            <p className='text-4xl font-bold'>
+                                                {productData?.price}$
                                             </p>
-                                            <div
-                                                className='text-center text-white ml-auto'
-                                                style={{ marginLeft: "35%" }}
-                                            >
-                                                <p className='text-4xl font-bold'>
-                                                    {productData.price}$
-                                                </p>
-                                            </div>
                                         </div>
-                                        <p className='text-lg text-white'>
-                                            {productData.location.city},{" "}
-                                            {productData.location.country}
-                                        </p>
                                     </div>
+                                    <p className='text-lg text-white'>
+                                        {productData.location?.city},{" "}
+                                        {productData.location?.country}
+                                    </p>
                                 </div>
                             </div>
-                        ) : (
-                            <div className='flex items-center justify-center mt-4 text-center'>
-                                <p className='text-[#32314D] font-bold'>
-                                    Please log in to get in touch with the owner
-                                    of this product.{" "}
-                                    <Link
-                                        href='/login'
-                                        className='text-[#7874F2]'
-                                    >
-                                        Log in
-                                    </Link>
-                                </p>
-                            </div>
-                        )}
+                        </div>
+                        {/* ) : ( */}
+                        <div className='flex items-center justify-center mt-4 text-center'>
+                            <p className='text-[#32314D] font-bold'>
+                                Please log in to get in touch with the owner of
+                                this product.{" "}
+                                <Link href='/login' className='text-[#7874F2]'>
+                                    Log in
+                                </Link>
+                            </p>
+                        </div>
+                        {/* )} */}
                     </div>
                 </div>
             </div>
diff --git a/src/pages/singleproduct/[productId].jsx b/src/pages/singleproduct/[productId].jsx
index cf88c89..352a7bf 100644
--- a/src/pages/singleproduct/[productId].jsx
+++ b/src/pages/singleproduct/[productId].jsx
@@ -16,7 +16,7 @@ function SingleProduct() {
             {productId && (
                 <div className='hidden lg:block'>
                     {/* This will be visible on screens larger than or equal to lg (large) */}
-                    <MapComponent productId={productId} />
+                    {/* <MapComponent productId={productId} /> */}
                 </div>
             )}
         </div>