summaryrefslogtreecommitdiff
path: root/src-migrate/modules/product-detail/components/Image.tsx
diff options
context:
space:
mode:
authortrisusilo48 <tri.susilo@altama.co.id>2024-07-02 14:33:25 +0700
committertrisusilo48 <tri.susilo@altama.co.id>2024-07-02 14:33:25 +0700
commite8ad23dbad5e96dddcd6b10bdc46400c6721e80b (patch)
treefafea81669ea00f824260ecb4a0acc9e1096499f /src-migrate/modules/product-detail/components/Image.tsx
parentc6eec1fcd70c878f9fa4911ae4ebf1a1c97a18b7 (diff)
parent66d787499d0751365c1cda9d79b31e9f3c3c28bc (diff)
Merge branch 'release' into feature/generate_recomendation
Diffstat (limited to 'src-migrate/modules/product-detail/components/Image.tsx')
-rw-r--r--src-migrate/modules/product-detail/components/Image.tsx53
1 files changed, 41 insertions, 12 deletions
diff --git a/src-migrate/modules/product-detail/components/Image.tsx b/src-migrate/modules/product-detail/components/Image.tsx
index b69cc87f..30ca0d34 100644
--- a/src-migrate/modules/product-detail/components/Image.tsx
+++ b/src-migrate/modules/product-detail/components/Image.tsx
@@ -1,5 +1,5 @@
import style from '../styles/image.module.css';
-
+import ImageNext from 'next/image';
import React, { useEffect, useMemo, useState } from 'react'
import { InfoIcon } from 'lucide-react'
import { Tooltip } from '@chakra-ui/react'
@@ -14,9 +14,10 @@ type Props = {
const Image = ({ product }: Props) => {
const flashSale = product.flash_sale
-
const [count, setCount] = useState(flashSale?.remaining_time || 0);
+
+
useEffect(() => {
let interval: NodeJS.Timeout;
@@ -42,15 +43,43 @@ const Image = ({ product }: Props) => {
return (
<div className={style['wrapper']}>
- <ImageUI
- src={image}
- alt={product.name}
- width={256}
- height={256}
- className={style['image']}
- loading='eager'
- priority
- />
+ {/* <div className="relative"> */}
+ <ImageUI
+ src={image}
+ alt={product.name}
+ width={256}
+ height={256}
+ className={style['image']}
+ loading='eager'
+ priority
+ />
+ <div className="absolute top-4 right-10 flex ">
+ <div className="gambarB ">
+ {product.isSni && (
+ <ImageNext
+ src="/images/sni-logo.png"
+ alt="SNI Logo"
+ className="w-12 h-8 object-contain object-top sm:h-6"
+ width={50}
+ height={50}
+ />
+ )}
+ </div>
+ <div className="gambarC ">
+ {product.isTkdn && (
+ <ImageNext
+ src="/images/TKDN.png"
+ alt="TKDN"
+ className="w-16 h-8 object-contain object-top ml-1 mr-1 sm:h-6"
+ width={50}
+ height={50}
+ />
+ )}
+ </div>
+ </div>
+ {/* </div> */}
+
+
<div className={style['absolute-info']}>
<Tooltip
@@ -67,7 +96,7 @@ const Image = ({ product }: Props) => {
<div className='absolute bottom-0 w-full h-14'>
<div className="relative w-full h-full">
<ImageUI
- src='/images/GAMBAR-BG-FLASH-SALE.jpg'
+ src='/images/BG-FLASH-SALE.jpg'
alt='Flash Sale Indoteknik'
width={200}
height={100}