+ {!productDetailsLoading && !product && (
+
+ Failed to load product details
+
+ )}
+ {productDetailsLoading && (
+
+
+
Just a sec! We are almost there
+
+ )}
+ {toggleLoginOverlay && (
+
+
+
+ Error
+
+
setToggleLoginOverlay(false)}
+ />
+
+
+ Only logged in users are allowed to submit product reviews.
+ Please login or create an account if you do not have one
+
+
+
+
+ )}
+
+
+ Shop
+ {' '}
+ > {(!productDetailsLoading && product?.name) || 'Product Details'}
+
+ {!productDetailsLoading && product && (
+
+
+
+
+
+
+ {product.gallery.map((image) => (
+
+
+
+ ))}
+
+
+
+
+
+ {product.name.slice(0, 25)}
+ {product.name.length > 25 ? '...' : ''}
+
+ {isBestSeller(product, bestSellers) && (
+
+ )}
+
+
+
+
+
{product.averageRating}
+ {Array.from({
+ length: Math.floor(product.averageRating),
+ }).map((_, index) => {
+ return (
+
+ );
+ })}
+
+
+ {Array.from({
+ length: Math.floor(4 - product.averageRating),
+ }).map((_, index) => {
+ return (
+
+ );
+ })}
+
+
+
+
+
+ {product.reviews.length}
+ {' '}
+ Reviews
+
+
+
+ {product.totalQtySold}
+ {' '}
+ Products sold
+
+
+
+
+ ${product.salesPrice}
+
+
+ ${product.regularPrice}
+
+
+
+
Promotion
+
+ {Math.round(
+ (product.regularPrice - product.salesPrice) /
+ product.regularPrice /
+ 0.01
+ )}
+ % Off
+
+
+
+
+
+
+
+
+
Add to wishlist
+
+
+ Tags:
+ {product.tags.map((tag, i) => (
+
+ {i !== 0 && ', '}
+ {tag}
+
+ ))}
+
+
+
+ )}
+ {!productDetailsLoading && product && (
+
+
+
+
+
+
+ {isVisible.state && isVisible.name === 'details' && (
+
+
+
Short Description
+
{product.shortDesc}
+
+
+
Long Description
+
{product.longDesc}
+
+
+ )}
+ {isVisible.state && isVisible.name === 'about' && (
+
+
+
+
+
+
+
+
+
+ Vendor Name:
+
+ {`${product.vendor.firstName} ${product.vendor.lastName}`}
+
+
+
+ Vendor Email:
+
+ {product.vendor.email}
+
+
+
+ {`${product.vendor.firstName} ${product.vendor.lastName}`}
+
+
+ {product.vendor.email}
+
+
+
+
+ )}
+ {isVisible.state && isVisible.name === 'reviews' && (
+
+ {product?.reviews.length === 0 && (
+
No reviews found
+ )}
+ {product?.reviews.map((productReview) => (
+
+
+
+
+
+
+
{`${productReview.user.firstName} ${productReview.user.lastName}`}
+
+
+
{productReview.rating}
+ {Array.from({
+ length: Math.floor(productReview.rating),
+ }).map((_, index) => {
+ return (
+
+ );
+ })}
+
+
+ {Array.from({
+ length: Math.floor(4 - productReview.rating),
+ }).map((_, index) => {
+ return (
+
+ );
+ })}
+
+
+
+
{productReview.content}
+
+ ))}
+
+ )}
+
+ )}
+ {!productDetailsLoading && product && (
+
+
Add a review
+
+ Your rating *
+
+
+ {Array.from({ length: 5 }, (_, i) => (
+
+ setReview({ ...review, rating: i + 1, productId: product.id })
+ }
+ />
+ ))}
+
+
+ Your review *
+
+
+ {error &&
{error}
}
+
: undefined
+ }
+ styles="w-40"
+ onClick={submitReview}
+ />
+
+ )}
+ {!productDetailsLoading && product && (
+
+
Similar Products
+
+ Dont miss this opportunity at a special discount just for this week.
+
+
+ {product.similarProducts.map((item: Product) => {
+ if (item.id !== product.id) {
+ return (
+
+ );
+ }
+ return null;
+ })}
+
+
+ )}
+