diff --git a/components/Yamaha/Shop/Checkout.js b/components/Yamaha/Shop/Checkout.js
index 172934e..3dba4ea 100644
--- a/components/Yamaha/Shop/Checkout.js
+++ b/components/Yamaha/Shop/Checkout.js
@@ -12,15 +12,17 @@ import {
 //library yarn
 import NumberFormat from 'react-number-format';
 
-const CheckoutContent = function ({ backend, checkout_product, user, ...props }) {
-
-    console.log(user);
-
-    // const Checkout = checkout_product.map((data) => {
-    //     return (
-
-    //     )
-    // })
+const CheckoutContent = function ({ backend, checkout_product, user, provinces, ...props }) {
+    console.log(provinces);
+
+    const [formValue, setFormValue] = React.useState({
+        transaction_id: "",
+        product_img: "",
+        product_name: "",
+        product_color: "",
+        product_quantity: "",
+        product_total: "",
+    });
 
     return (
         <>
@@ -65,14 +67,8 @@ const CheckoutContent = function ({ backend, checkout_product, user, ...props })
 
                                         <div className="col-lg-6 col-md-6">
                                             <div className="form-group">
-                                                <label>Alamat Sebagai <span className="required">*</span></label>
-
-                                                <div className="select-box">
-                                                    <select className="form-select">
-                                                        <option value="1">Rumah</option>
-                                                        <option value="2">Kantor</option>
-                                                    </select>
-                                                </div>
+                                                <label>Kode Pos <span className="required">*</span></label>
+                                                <input type="text" className="form-control" />
                                             </div>
                                         </div>
 
@@ -111,19 +107,14 @@ const CheckoutContent = function ({ backend, checkout_product, user, ...props })
 
                                                 <div className="select-box">
                                                     <select className="form-select">
-                                                        <option value="1">Indonesia</option>
+                                                        {/* {provinces["provinsi"].map((option) => (
+                                                            <option value={option.id}>{option.nama}</option>
+                                                        ))} */}
                                                     </select>
                                                 </div>
                                             </div>
                                         </div>
 
-                                        <div className="col-lg-6 col-md-6">
-                                            <div className="form-group">
-                                                <label>Postcode / Zip <span className="required">*</span></label>
-                                                <input type="text" className="form-control" />
-                                            </div>
-                                        </div>
-
                                         {/* <div className="col-lg-12 col-md-12">
                                             <div className="form-check">
                                                 <input type="checkbox" className="form-check-input" id="create-an-account" />
@@ -155,7 +146,7 @@ const CheckoutContent = function ({ backend, checkout_product, user, ...props })
                                         <div className="services-details">
                                             <div className="services-details-desc">
                                                 <div className="services-details-accordion">
-                                                    <Accordion allowZeroExpanded preExpanded={['a']}>
+                                                    <Accordion>
                                                         <AccordionItem uuid="a">
                                                             <AccordionItemHeading>
                                                                 <AccordionItemButton>
@@ -198,7 +189,7 @@ const CheckoutContent = function ({ backend, checkout_product, user, ...props })
 
                                                         <AccordionItem uuid="c">
                                                             <AccordionItemHeading>
-                                                            <AccordionItemButton>
+                                                                <AccordionItemButton>
                                                                     <span> Next Day </span><br />
                                                                     <p style={{ marginLeft: "25px" }}>
                                                                         Akan diterima pada tanggal 13 - 14 Nov <br />                                                                    </p>
diff --git a/pages/yamaha/Shop/Checkout.js b/pages/yamaha/Shop/Checkout.js
index 75b3260..c8e7ee1 100644
--- a/pages/yamaha/Shop/Checkout.js
+++ b/pages/yamaha/Shop/Checkout.js
@@ -9,14 +9,14 @@ import CheckoutProduct from "api/shop/checkout";
 
 import Cookies from "cookies";
 
-const Checkout = function ({ backend, checkout_product, user, ...props }) {
+const Checkout = function ({ backend, checkout_product, user, provinces, ...props }) {
     return (
         <>
             <Navbar username={user} />
 
             <PageBanner pageTitle="Checkout" />
 
-            <CheckoutContent user={user} checkout_product={checkout_product} backend={backend} />
+            <CheckoutContent user={user} checkout_product={checkout_product} backend={backend} provinces={provinces}/>
 
             <Footer />
         </>
@@ -38,7 +38,8 @@ export async function getServerSideProps(context) {
     if (userObj) {
         let sessionId = userObj["partners_login_states"].filter(function (i) {
             return (
-                i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA"
+                i.business_partner &&
+                i.business_partner.name.toUpperCase() == "YAMAHA"
             );
         });
         if (sessionId.length != 0) user = userObj["username"];
@@ -50,21 +51,26 @@ export async function getServerSideProps(context) {
     }
 
     var provinces = [];
-    const request = require('request');
-    let options = {
-        method: 'GET',
-        url: 'https://api.rajaongkir.com/starter/province',
-        headers: { key: 'f4ac703bb25ada32478d52ef2e1cab7a' }
-    };
+    var cities = [];
+    var districts = [];
+    var villages = [];
+
+    var request = require("request-promise");
 
-    // var res = request(options, function (error, response, body) {
-    //     provinces = body;
-    //     console.log(body);
-    // });
+    var provinsi = {
+        method: "GET",
+        url: "https://api.rajaongkir.com/starter/province",
+        headers: { key: "f4ac703bb25ada32478d52ef2e1cab7a" },
+    };
+    var provinces = await request(provinsi);
 
-    console.log("tes :", provinces);
+    var kota = {
+        method: "GET",
+        url: "https://api.rajaongkir.com/starter/city",
+        headers: { key:"f4ac703bb25ada32478d52ef2e1cab7a" },
+    }
 
     return {
-        props: { checkout_product, backend, user }, // will be passed to the page component as props
+        props: { checkout_product, backend, user, provinces }, // will be passed to the page component as props
     };
 }
\ No newline at end of file