diff --git a/api/product/product.js b/api/product/product.js
index cf147e7..708d7d6 100644
--- a/api/product/product.js
+++ b/api/product/product.js
@@ -11,6 +11,7 @@ async function GetDetailProduct(id, token = "") {
         price
         price1
         price2
+        discount
         img{
           url
         }
@@ -72,6 +73,7 @@ async function GetProduct(token = "") {
         price
         price1
         price2
+        discount
         img {
           url
         }
diff --git a/api/sparepart/sparepart.js b/api/sparepart/sparepart.js
index f577f86..fbeea34 100644
--- a/api/sparepart/sparepart.js
+++ b/api/sparepart/sparepart.js
@@ -12,6 +12,7 @@ async function GetSparepartYGP(token="") {
 					}
 					price1
 					price2
+                    discount
 					ygp_units{
 						name
 						part_code
@@ -36,6 +37,7 @@ async function GetSparepartYamalube(token="") {
                     price
                     description
                     stock
+                    discount
                     img{
                         url
                     }
@@ -55,6 +57,7 @@ async function GetHelmet(token="") {
                 id
                 name
                 price
+                discount
                 img {
                     url
                 }
@@ -73,6 +76,7 @@ async function GetApparel(token="") {
                 id
                 name
                 price
+                discount
                 img {
                     url
                 }
@@ -91,6 +95,7 @@ async function GetAcc(token="") {
                 id
                 name
                 price
+                discount
                 img {
                     url
                 }
@@ -112,6 +117,7 @@ async function GetYGPDetail(id, token="") {
 							img{
 								url
 							}
+                            discount
 							description
 							price1
 							price2
@@ -142,6 +148,7 @@ async function GetYamalubeDetail(id, token="") {
                 description
                 price
                 part_code
+                discount
                 img {
                     url
                 }
@@ -167,6 +174,7 @@ async function GetHelmetDetail(id, token="") {
                 description
                 price
                 part_code
+                discount
                 img {
                     url
                 }
@@ -192,6 +200,7 @@ async function GetApparelDetail(id, token="") {
                 description
                 price
                 part_code
+                discount
                 img {
                     url
                 }
@@ -217,6 +226,7 @@ async function GetAccDetail(id, token="") {
                 description
                 price
                 part_code
+                discount
                 img {
                     url
                 }
diff --git a/components/Yamaha/Product/Accessories_Detail.js b/components/Yamaha/Product/Accessories_Detail.js
index 42923de..d35d503 100644
--- a/components/Yamaha/Product/Accessories_Detail.js
+++ b/components/Yamaha/Product/Accessories_Detail.js
@@ -67,8 +67,20 @@ const ProductDetails = function ({ detailaccessories, backend, user, ...props })
                                 <div className="products-details">
                                     <h3>{data.name}</h3>
                                     <h3>
-                                        <NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
                                     </h3>
+                                    <h5>
+                                        <div className="price" style={{marginTop:"20px"}}>
+                                            <NumberFormat
+                                                style={{ color: "#EB1928" }}
+                                                displayType={'text'}
+                                                prefix={'%'}
+                                                decimalScale={2}
+                                                value={data.discount * 100}
+                                            />
+                                            <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        </div>
+                                    </h5>
 
                                     <ul className="rating">
                                         <li><i className="flaticon-star-1"></i></li>
diff --git a/components/Yamaha/Product/Apparel_Detail.js b/components/Yamaha/Product/Apparel_Detail.js
index 5b41ccd..3d661cc 100644
--- a/components/Yamaha/Product/Apparel_Detail.js
+++ b/components/Yamaha/Product/Apparel_Detail.js
@@ -67,8 +67,20 @@ const ProductDetails = function ({ detailapparel, backend, user, ...props }) {
                                 <div className="products-details">
                                     <h3>{data.name}</h3>
                                     <h3>
-                                        <NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
                                     </h3>
+                                    <h5>
+                                        <div className="price" style={{marginTop:"20px"}}>
+                                            <NumberFormat
+                                                style={{ color: "#EB1928" }}
+                                                displayType={'text'}
+                                                prefix={'%'}
+                                                decimalScale={2}
+                                                value={data.discount * 100}
+                                            />
+                                            <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        </div>
+                                    </h5>
 
                                     <ul className="rating">
                                         <li><i className="flaticon-star-1"></i></li>
diff --git a/components/Yamaha/Product/Helmet_Detail.js b/components/Yamaha/Product/Helmet_Detail.js
index 851cc29..dfd27e1 100644
--- a/components/Yamaha/Product/Helmet_Detail.js
+++ b/components/Yamaha/Product/Helmet_Detail.js
@@ -67,8 +67,20 @@ const ProductDetails = function ({ detailhelmet, backend, user, ...props }) {
                                 <div className="products-details">
                                     <h3>{data.name}</h3>
                                     <h3>
-                                        <NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
                                     </h3>
+                                    <h5>
+                                        <div className="price" style={{marginTop:"20px"}}>
+                                            <NumberFormat
+                                                style={{ color: "#EB1928" }}
+                                                displayType={'text'}
+                                                prefix={'%'}
+                                                decimalScale={2}
+                                                value={data.discount * 100}
+                                            />
+                                            <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        </div>
+                                    </h5>
 
                                     <ul className="rating">
                                         <li><i className="flaticon-star-1"></i></li>
diff --git a/components/Yamaha/Product/Motor_Detail.js b/components/Yamaha/Product/Motor_Detail.js
index e37dc14..773ddf0 100644
--- a/components/Yamaha/Product/Motor_Detail.js
+++ b/components/Yamaha/Product/Motor_Detail.js
@@ -55,6 +55,8 @@ const ProductDetails = function ({ detailproduct, backend, user, ...props }) {
         //     });
         // }
 
+
+
         return (
             <div>
                 <PageBanner pageTitle={data.name} />
@@ -79,8 +81,20 @@ const ProductDetails = function ({ detailproduct, backend, user, ...props }) {
                             <div className="col-lg-7">
                                 <div className="products-details">
                                     <h3>
-                                        <NumberFormat value={data.product_otrs[0].price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        <NumberFormat value={data.product_otrs[0].price - data.product_otrs[0].price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
                                     </h3>
+                                    <h5>
+                                        <div className="price" style={{marginTop:"20px"}}>
+                                            <NumberFormat
+                                                style={{ color: "#EB1928" }}
+                                                displayType={'text'}
+                                                prefix={'%'}
+                                                decimalScale={2}
+                                                value={data.discount * 100}
+                                            />
+                                            <NumberFormat value={data.product_otrs[0].price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        </div>
+                                    </h5>
 
                                     {/* <p>{this.state.selectedOption}</p> */}
 
diff --git a/components/Yamaha/Product/Sparepart.js b/components/Yamaha/Product/Sparepart.js
index 34021e5..c0a2b3a 100644
--- a/components/Yamaha/Product/Sparepart.js
+++ b/components/Yamaha/Product/Sparepart.js
@@ -50,7 +50,24 @@ const ProductCard = function ({ ygp, yamalube, helmet, apparel, accessories, bac
                                 <a>{data.name}</a>
                             </Link>
                         </h3>
-                        <span><NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} /></span>
+                        <span>
+                            <NumberFormat value={data.price1 - data.price1 * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                        </span><br />
+                        <span></span>
+                        <span>
+                            <div className="products-details">
+                                <div className="price">
+                                    <NumberFormat
+                                        style={{ color: "#EB1928" }}
+                                        displayType={'text'}
+                                        prefix={'%'}
+                                        decimalScale={2}
+                                        value={data.discount * 100}
+                                    />
+                                    <NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                </div>
+                            </div>
+                        </span>
                         <ul>
                             <li><i className="flaticon-star-1"></i></li>
                             <li><i className="flaticon-star-1"></i></li>
@@ -102,7 +119,24 @@ const ProductCard = function ({ ygp, yamalube, helmet, apparel, accessories, bac
                                 <a>{data.name}</a>
                             </Link>
                         </h3>
-                        <span><NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} /></span>
+                        <span>
+                            <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                        </span><br />
+                        <span></span>
+                        <span>
+                            <div className="products-details">
+                                <div className="price">
+                                    <NumberFormat
+                                        style={{ color: "#EB1928" }}
+                                        displayType={'text'}
+                                        prefix={'%'}
+                                        decimalScale={2}
+                                        value={data.discount * 100}
+                                    />
+                                    <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                </div>
+                            </div>
+                        </span>
                         <ul>
                             <li><i className="flaticon-star-1"></i></li>
                             <li><i className="flaticon-star-1"></i></li>
@@ -154,7 +188,24 @@ const ProductCard = function ({ ygp, yamalube, helmet, apparel, accessories, bac
                                 <a>{data.name}</a>
                             </Link>
                         </h3>
-                        <span><NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} /></span>
+                        <span>
+                            <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                        </span><br />
+                        <span></span>
+                        <span>
+                            <div className="products-details">
+                                <div className="price">
+                                    <NumberFormat
+                                        style={{ color: "#EB1928" }}
+                                        displayType={'text'}
+                                        prefix={'%'}
+                                        decimalScale={2}
+                                        value={data.discount * 100}
+                                    />
+                                    <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                </div>
+                            </div>
+                        </span>
                         <ul>
                             <li><i className="flaticon-star-1"></i></li>
                             <li><i className="flaticon-star-1"></i></li>
@@ -206,7 +257,24 @@ const ProductCard = function ({ ygp, yamalube, helmet, apparel, accessories, bac
                                 <a>{data.name}</a>
                             </Link>
                         </h3>
-                        <span><NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} /></span>
+                        <span>
+                            <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                        </span><br />
+                        <span></span>
+                        <span>
+                            <div className="products-details">
+                                <div className="price">
+                                    <NumberFormat
+                                        style={{ color: "#EB1928" }}
+                                        displayType={'text'}
+                                        prefix={'%'}
+                                        decimalScale={2}
+                                        value={data.discount * 100}
+                                    />
+                                    <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                </div>
+                            </div>
+                        </span>
                         <ul>
                             <li><i className="flaticon-star-1"></i></li>
                             <li><i className="flaticon-star-1"></i></li>
@@ -258,7 +326,24 @@ const ProductCard = function ({ ygp, yamalube, helmet, apparel, accessories, bac
                                 <a>{data.name}</a>
                             </Link>
                         </h3>
-                        <span><NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} /></span>
+                        <span>
+                            <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                        </span><br />
+                        <span></span>
+                        <span>
+                            <div className="products-details">
+                                <div className="price">
+                                    <NumberFormat
+                                        style={{ color: "#EB1928" }}
+                                        displayType={'text'}
+                                        prefix={'%'}
+                                        decimalScale={2}
+                                        value={data.discount * 100}
+                                    />
+                                    <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                </div>
+                            </div>
+                        </span>
                         <ul>
                             <li><i className="flaticon-star-1"></i></li>
                             <li><i className="flaticon-star-1"></i></li>
diff --git a/components/Yamaha/Product/Yamalube_Detail.js b/components/Yamaha/Product/Yamalube_Detail.js
index 7808f98..97d0fc4 100644
--- a/components/Yamaha/Product/Yamalube_Detail.js
+++ b/components/Yamaha/Product/Yamalube_Detail.js
@@ -67,8 +67,20 @@ const ProductDetails = function ({ detailyamalube, backend, user, ...props }) {
                                 <div className="products-details">
                                     <h3>{data.name}</h3>
                                     <h3>
-                                        <NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        <NumberFormat value={data.price - data.price * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
                                     </h3>
+                                    <h5>
+                                        <div className="price" style={{marginTop:"20px"}}>
+                                            <NumberFormat
+                                                style={{ color: "#EB1928" }}
+                                                displayType={'text'}
+                                                prefix={'%'}
+                                                decimalScale={2}
+                                                value={data.discount * 100}
+                                            />
+                                            <NumberFormat value={data.price} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        </div>
+                                    </h5>
 
                                     <ul className="rating">
                                         <li><i className="flaticon-star-1"></i></li>
diff --git a/components/Yamaha/Product/Ygp_Detail.js b/components/Yamaha/Product/Ygp_Detail.js
index a7ba890..edc98ea 100644
--- a/components/Yamaha/Product/Ygp_Detail.js
+++ b/components/Yamaha/Product/Ygp_Detail.js
@@ -68,8 +68,20 @@ const ProductDetails = function ({ detailygp, backend, user, ...props }) {
                                 <div className="products-details">
                                     <h3>{data.name}</h3>
                                     <h3>
-                                        <NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        <NumberFormat value={data.price1 - data.price1 * data.discount} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
                                     </h3>
+                                    <h5>
+                                        <div className="price" style={{marginTop:"20px"}}>
+                                            <NumberFormat
+                                                style={{ color: "#EB1928" }}
+                                                displayType={'text'}
+                                                prefix={'%'}
+                                                decimalScale={2}
+                                                value={data.discount * 100}
+                                            />
+                                            <NumberFormat value={data.price1} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} />
+                                        </div>
+                                    </h5>
 
                                     <ul className="rating">
                                         <li><i className="flaticon-star-1"></i></li>