challenge-vtex-io-samuelcon.../react/imagempix.tsx

32 lines
936 B
TypeScript
Raw Normal View History

2023-01-30 18:01:27 +00:00
import React from 'react'
import { useProduct } from 'vtex.product-context'
import { useCssHandles } from 'vtex.css-handles'
import "./imagempix.css"
const piximgacademy = () => {
const CSS_HANDLES = [
"pixwrapper",
"priceandp"
]
const handles = useCssHandles(CSS_HANDLES)
const product = useProduct()
const productPrice = product?.selectedItem?.sellers[0].commertialOffer.Price
const discount = Number(productPrice) * 0.1
const pixprice = Number(productPrice) - discount
return (
<>
<section className={handles.handles.pixwrapper}>
<div>
<img src="https://agenciamagma.vteximg.com.br/arquivos/pix-samuelcondack.svg" alt="imagem pix" />
</div>
<div className={handles.handles.priceandp}>
R$&nbsp;{pixprice.toFixed(2).toString().replace(".",",")}
<p>10 % de desconto</p>
</div>
</section>
</>
)
}
export default piximgacademy;