summaryrefslogtreecommitdiff
path: root/src2/components/products
diff options
context:
space:
mode:
authorRafi Zadanly <zadanlyr@gmail.com>2023-03-02 16:51:05 +0700
committerRafi Zadanly <zadanlyr@gmail.com>2023-03-02 16:51:05 +0700
commitd336735a91133cc3f1cf6f67ba2ac29f0985fd2e (patch)
treef64a5c6de6e0ea015952ae028dca115077cffa45 /src2/components/products
parent074edfe4e51efd3b4a44dc7fe6e1284c9c560501 (diff)
delete src2
Diffstat (limited to 'src2/components/products')
-rw-r--r--src2/components/products/ProductCard.js69
-rw-r--r--src2/components/products/ProductCategories.js62
-rw-r--r--src2/components/products/ProductSimilar.js25
-rw-r--r--src2/components/products/ProductSlider.js39
4 files changed, 0 insertions, 195 deletions
diff --git a/src2/components/products/ProductCard.js b/src2/components/products/ProductCard.js
deleted file mode 100644
index c79a4900..00000000
--- a/src2/components/products/ProductCard.js
+++ /dev/null
@@ -1,69 +0,0 @@
-import Link from "../elements/Link";
-import currencyFormat from "@/core/utils/currencyFormat";
-import { createSlug } from "@/core/utils/slug";
-import { ChevronRightIcon } from "@heroicons/react/20/solid";
-import Image from "../elements/Image";
-
-
-export default function ProductCard({
- data,
- simpleProductTitleLine = false
-}) {
- let product = data;
- return (
- <div className="product-card">
- <Link href={'/shop/product/' + createSlug(product.name, product.id)} className="block relative bg-white">
- <Image
- src={product.image}
- alt={product.name}
- className="product-card__image"
- />
- {product.variant_total > 1 ? (
- <div className="absolute bottom-2 left-2 badge-gray">{product.variant_total} Varian</div>
- ) : ''}
- </Link>
- <div className="product-card__content">
- <div>
- {typeof product.manufacture.name !== "undefined" ? (
- <Link href={'/shop/brands/' + createSlug(product.manufacture.name, product.manufacture.id)} className="product-card__brand">{product.manufacture.name}</Link>
- ) : (
- <span className="product-card__brand">-</span>
- )}
- <Link href={'/shop/product/' + createSlug(product.name, product.id)} className={`product-card__title ${simpleProductTitleLine ? 'wrap-line-ellipsis-2' : 'wrap-line-ellipsis-3'}`}>
- {product.name}
- </Link>
- </div>
- <div className="mt-2">
- {product.lowest_price.discount_percentage > 0 ? (
- <div className="flex gap-x-1 items-center mb-1">
- <p className="text-caption-2 text-gray_r-11 line-through">{currencyFormat(product.lowest_price.price)}</p>
- <span className="badge-solid-red">{product.lowest_price.discount_percentage}%</span>
- </div>
- ) : ''}
-
- {product.lowest_price.price_discount > 0 ? (
- <p className="text-caption-1 text-gray_r-12 font-bold">
- {currencyFormat(product.lowest_price.price_discount)}
- </p>
- ) : (
- <a
- href="https://wa.me"
- target="_blank"
- rel="noreferrer"
- className="flex items-center gap-x-1 text-caption-1"
- >
- Tanya Harga <ChevronRightIcon className="text-yellow_r-11 w-5 h-5" />
- </a>
- )}
-
- {product.stock_total > 0 ? (
- <div className="flex gap-x-1 mt-2">
- <div className="badge-solid-red">Ready Stock</div>
- <div className="badge-gray">{product.stock_total > 5 ? '> 5' : '< 5'}</div>
- </div>
- ) : ''}
- </div>
- </div>
- </div>
- )
-} \ No newline at end of file
diff --git a/src2/components/products/ProductCategories.js b/src2/components/products/ProductCategories.js
deleted file mode 100644
index 3b671f29..00000000
--- a/src2/components/products/ProductCategories.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import { useEffect, useState } from "react";
-import ProductSlider from "./ProductSlider";
-import apiOdoo from "@/core/utils/apiOdoo";
-import { LazyLoadComponent } from "react-lazy-load-image-component";
-import { SkeletonProduct } from "../elements/Skeleton";
-
-const ProductCategory = ({ id }) => {
- const [ content, setContent ] = useState(null);
-
- useEffect(() => {
- const loadContent = async () => {
- if (!content) {
- const dataContent = await apiOdoo('GET', `/api/v1/categories_homepage?id=${id}`);
- setContent(dataContent[0]);
- }
- }
- loadContent();
- }, [id, content]);
-
- return (
- <div className="p-4 relative bg-yellow_r-2">
- { content ? (
- <ProductSlider
- products={{
- products: content.products,
- banner: {
- image: content.image,
- name: content.name,
- url: `/shop/search?category=${content.name}`
- }
- }}
- simpleProductTitleLine
- bannerMode
- />
- ) : <SkeletonProduct /> }
- </div>
- );
-}
-
-export default function ProductCategories() {
- const [ contentIds, setContentIds ] = useState([]);
-
- useEffect(() => {
- const getContentIds = async () => {
- if (contentIds.length == 0) {
- const dataContentIds = await apiOdoo('GET', '/api/v1/categories_homepage/ids');
- setContentIds(dataContentIds);
- }
- }
- getContentIds();
- }, [ contentIds ]);
-
- return (
- <div className="flex flex-col gap-y-6">
- { contentIds.map((contentId) => (
- <LazyLoadComponent placeholder={<SkeletonProduct/>} key={contentId}>
- <ProductCategory id={contentId} />
- </LazyLoadComponent>
- )) }
- </div>
- )
-} \ No newline at end of file
diff --git a/src2/components/products/ProductSimilar.js b/src2/components/products/ProductSimilar.js
deleted file mode 100644
index 9e2292cb..00000000
--- a/src2/components/products/ProductSimilar.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import apiOdoo from '@/core/utils/apiOdoo';
-import { useEffect, useState } from 'react';
-import ProductSlider from './ProductSlider';
-
-export default function ProductSimilar({ productId }) {
- const [similarProducts, setSimilarProducts] = useState(null);
-
- useEffect(() => {
- const getSimilarProducts = async () => {
- if (productId && !similarProducts) {
- const dataSimilarProducts = await apiOdoo('GET', `/api/v1/product/${productId}/similar?limit=20`);
- setSimilarProducts(dataSimilarProducts);
- }
- }
- getSimilarProducts();
- }, [productId, similarProducts]);
-
-
- return (
- <div className="p-4">
- <h2 className="font-bold mb-4">Kamu Mungkin Juga Suka</h2>
- <ProductSlider products={similarProducts}/>
- </div>
- )
-} \ No newline at end of file
diff --git a/src2/components/products/ProductSlider.js b/src2/components/products/ProductSlider.js
deleted file mode 100644
index 662a6511..00000000
--- a/src2/components/products/ProductSlider.js
+++ /dev/null
@@ -1,39 +0,0 @@
-import { Swiper, SwiperSlide } from "swiper/react";
-import ProductCard from "./ProductCard";
-import "swiper/css";
-import Image from "../elements/Image";
-import Link from "../elements/Link";
-import { SkeletonProduct } from "../elements/Skeleton";
-import { useState } from "react";
-
-export default function ProductSlider({
- products,
- simpleProductTitleLine = false,
- bannerMode = false
-}) {
- const [ activeIndex, setActiveIndex ] = useState(0);
- const swiperSliderFirstMove = (swiper) => {
- setActiveIndex(swiper.activeIndex);
- };
-
- return (
- <>
- { bannerMode && (
- <Image src={products.banner.image} alt={products.banner.name} className={`absolute rounded-r top-0 left-0 h-full max-w-[52%] idt-transition border border-gray_r-6 ` + (activeIndex > 0 ? 'opacity-0' : 'opacity-100')} />
- ) }
- <Swiper freeMode={true} slidesPerView={2.2} spaceBetween={8} onSlideChange={swiperSliderFirstMove} prefix="product">
- { bannerMode && (
- <SwiperSlide>
- <Link href={products.banner.url} className="w-full h-full block"></Link>
- </SwiperSlide>
- ) }
- {products?.products?.map((product, index) => (
- <SwiperSlide key={index}>
- <ProductCard data={product} simpleProductTitleLine={simpleProductTitleLine} />
- </SwiperSlide>
- ))}
- </Swiper>
- { !products ? <SkeletonProduct /> : ''}
- </>
- )
-} \ No newline at end of file