fix otr price

.next/build-manifest.json

@@ -29,10 +29,10 @@
       "static/chunks/main.js",
       "static/chunks/pages/_error.js"
     ],
-    "/yamaha/Shop/Cart": [
+    "/yamaha": [
       "static/chunks/webpack.js",
       "static/chunks/main.js",
-      "static/chunks/pages/yamaha/Shop/Cart.js"
+      "static/chunks/pages/yamaha.js"
     ]
   },
   "ampFirstPages": []

.next/react-loadable-manifest.json

@@ -1,10 +1,22 @@
 {
+  "..\\components\\Common\\PartnerStyleTwo.js -> react-owl-carousel3": {
+    "id": "./node_modules/react-owl-carousel3/lib/OwlCarousel.js",
+    "files": [
+      "static/chunks/vendors-node_modules_react-owl-carousel3_lib_OwlCarousel_js.js"
+    ]
+  },
   "..\\components\\Home\\Gallery.js -> react-owl-carousel3": {
     "id": "./node_modules/react-owl-carousel3/lib/OwlCarousel.js",
     "files": [
       "static/chunks/vendors-node_modules_react-owl-carousel3_lib_OwlCarousel_js.js"
     ]
   },
+  "..\\components\\Yamaha\\Home\\FeatureProduct.js -> react-owl-carousel3": {
+    "id": "./node_modules/react-owl-carousel3/lib/OwlCarousel.js",
+    "files": [
+      "static/chunks/vendors-node_modules_react-owl-carousel3_lib_OwlCarousel_js.js"
+    ]
+  },
   "..\\node_modules\\next\\dist\\client\\next-dev.js -> ./dev/noop": {
     "id": "./node_modules/next/dist/client/dev/noop.js",
     "files": [

.next/server/pages-manifest.json

@@ -2,6 +2,6 @@
   "/_app": "pages/_app.js",
   "/_document": "pages/_document.js",
   "/_error": "pages/_error.js",
-  "/yamaha/Shop/Cart": "pages/yamaha/Shop/Cart.js",
-  "/": "pages/index.js"
+  "/": "pages/index.js",
+  "/yamaha": "pages/yamaha.js"
 }

.next/server/pages/404.js

@@ -1,184 +0,0 @@
-(function() {
-var exports = {};
-exports.id = "pages/404";
-exports.ids = ["pages/404"];
-exports.modules = {
-
-/***/ "./pages/404.js":
-/*!**********************!*\
-  !*** ./pages/404.js ***!
-  \**********************/
-/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony import */ var react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-dev-runtime */ "react/jsx-dev-runtime");
-/* harmony import */ var react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! next/link */ "./node_modules/next/link.js");
-/* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(next_link__WEBPACK_IMPORTED_MODULE_2__);
-
-var _jsxFileName = "E:\\Project\\Templae\\tbg-company-ecomm-web\\pages\\404.js";
-
-
-
-const Custom404 = () => {
-  return /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("div", {
-    className: "error-area",
-    children: /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("div", {
-      className: "d-table",
-      children: /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("div", {
-        className: "d-table-cell",
-        children: /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("div", {
-          className: "container",
-          children: /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("div", {
-            className: "error-content",
-            children: [/*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("div", {
-              className: "notfound-404",
-              children: /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("h1", {
-                children: "Oops!"
-              }, void 0, false, {
-                fileName: _jsxFileName,
-                lineNumber: 12,
-                columnNumber: 9
-              }, undefined)
-            }, void 0, false, {
-              fileName: _jsxFileName,
-              lineNumber: 11,
-              columnNumber: 8
-            }, undefined), /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("h3", {
-              children: "404 - Page not found"
-            }, void 0, false, {
-              fileName: _jsxFileName,
-              lineNumber: 14,
-              columnNumber: 8
-            }, undefined), /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("p", {
-              children: "The page you are looking for might have been removed had its name changed or is temporarily unavailable."
-            }, void 0, false, {
-              fileName: _jsxFileName,
-              lineNumber: 15,
-              columnNumber: 8
-            }, undefined), /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)((next_link__WEBPACK_IMPORTED_MODULE_2___default()), {
-              href: "/",
-              children: /*#__PURE__*/(0,react_jsx_dev_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxDEV)("a", {
-                className: "btn btn-primary",
-                children: "Go to Homepage"
-              }, void 0, false, {
-                fileName: _jsxFileName,
-                lineNumber: 18,
-                columnNumber: 9
-              }, undefined)
-            }, void 0, false, {
-              fileName: _jsxFileName,
-              lineNumber: 17,
-              columnNumber: 8
-            }, undefined)]
-          }, void 0, true, {
-            fileName: _jsxFileName,
-            lineNumber: 10,
-            columnNumber: 7
-          }, undefined)
-        }, void 0, false, {
-          fileName: _jsxFileName,
-          lineNumber: 9,
-          columnNumber: 6
-        }, undefined)
-      }, void 0, false, {
-        fileName: _jsxFileName,
-        lineNumber: 8,
-        columnNumber: 5
-      }, undefined)
-    }, void 0, false, {
-      fileName: _jsxFileName,
-      lineNumber: 7,
-      columnNumber: 4
-    }, undefined)
-  }, void 0, false, {
-    fileName: _jsxFileName,
-    lineNumber: 6,
-    columnNumber: 3
-  }, undefined);
-};
-
-/* harmony default export */ __webpack_exports__["default"] = (Custom404);
-
-/***/ }),
-
-/***/ "../next-server/lib/router-context":
-/*!**************************************************************!*\
-  !*** external "next/dist/next-server/lib/router-context.js" ***!
-  \**************************************************************/
-/***/ (function(module) {
-
-"use strict";
-module.exports = require("next/dist/next-server/lib/router-context.js");;
-
-/***/ }),
-
-/***/ "../next-server/lib/router/utils/get-asset-path-from-route":
-/*!**************************************************************************************!*\
-  !*** external "next/dist/next-server/lib/router/utils/get-asset-path-from-route.js" ***!
-  \**************************************************************************************/
-/***/ (function(module) {
-
-"use strict";
-module.exports = require("next/dist/next-server/lib/router/utils/get-asset-path-from-route.js");;
-
-/***/ }),
-
-/***/ "react":
-/*!************************!*\
-  !*** external "react" ***!
-  \************************/
-/***/ (function(module) {
-
-"use strict";
-module.exports = require("react");;
-
-/***/ }),
-
-/***/ "react-is":
-/*!***************************!*\
-  !*** external "react-is" ***!
-  \***************************/
-/***/ (function(module) {
-
-"use strict";
-module.exports = require("react-is");;
-
-/***/ }),
-
-/***/ "react/jsx-dev-runtime":
-/*!****************************************!*\
-  !*** external "react/jsx-dev-runtime" ***!
-  \****************************************/
-/***/ (function(module) {
-
-"use strict";
-module.exports = require("react/jsx-dev-runtime");;
-
-/***/ }),
-
-/***/ "?ca47":
-/*!******************************************!*\
-  !*** ./utils/resolve-rewrites (ignored) ***!
-  \******************************************/
-/***/ (function() {
-
-/* (ignored) */
-
-/***/ })
-
-};
-;
-
-// load runtime
-var __webpack_require__ = require("../webpack-runtime.js");
-__webpack_require__.C(exports);
-var __webpack_exec__ = function(moduleId) { return __webpack_require__(__webpack_require__.s = moduleId); }
-var __webpack_exports__ = __webpack_require__.X(0, ["vendors-node_modules_next_link_js"], function() { return __webpack_exec__("./pages/404.js"); });
-module.exports = __webpack_exports__;
-
-})();
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly9zdGFydHAvLi9wYWdlcy80MDQuanMiLCJ3ZWJwYWNrOi8vc3RhcnRwL2V4dGVybmFsIFwibmV4dC9kaXN0L25leHQtc2VydmVyL2xpYi9yb3V0ZXItY29udGV4dC5qc1wiIiwid2VicGFjazovL3N0YXJ0cC9leHRlcm5hbCBcIm5leHQvZGlzdC9uZXh0LXNlcnZlci9saWIvcm91dGVyL3V0aWxzL2dldC1hc3NldC1wYXRoLWZyb20tcm91dGUuanNcIiIsIndlYnBhY2s6Ly9zdGFydHAvZXh0ZXJuYWwgXCJyZWFjdFwiIiwid2VicGFjazovL3N0YXJ0cC9leHRlcm5hbCBcInJlYWN0LWlzXCIiLCJ3ZWJwYWNrOi8vc3RhcnRwL2V4dGVybmFsIFwicmVhY3QvanN4LWRldi1ydW50aW1lXCIiLCJ3ZWJwYWNrOi8vc3RhcnRwL2lnbm9yZWR8RTpcXFByb2plY3RcXFRlbXBsYWVcXHRiZy1jb21wYW55LWVjb21tLXdlYlxcbm9kZV9tb2R1bGVzXFxuZXh0XFxkaXN0XFxuZXh0LXNlcnZlclxcbGliXFxyb3V0ZXJ8Li91dGlscy9yZXNvbHZlLXJld3JpdGVzIl0sIm5hbWVzIjpbIkN1c3RvbTQwNCJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBO0FBQ0E7O0FBRUEsTUFBTUEsU0FBUyxHQUFHLE1BQU07QUFDcEIsc0JBQ0Y7QUFBSyxhQUFTLEVBQUMsWUFBZjtBQUFBLDJCQUNDO0FBQUssZUFBUyxFQUFDLFNBQWY7QUFBQSw2QkFDQztBQUFLLGlCQUFTLEVBQUMsY0FBZjtBQUFBLCtCQUNDO0FBQUssbUJBQVMsRUFBQyxXQUFmO0FBQUEsaUNBQ0M7QUFBSyxxQkFBUyxFQUFDLGVBQWY7QUFBQSxvQ0FDQztBQUFLLHVCQUFTLEVBQUMsY0FBZjtBQUFBLHFDQUNDO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBREQ7QUFBQTtBQUFBO0FBQUE7QUFBQSx5QkFERCxlQUlDO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBLHlCQUpELGVBS0M7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUEseUJBTEQsZUFPQyw4REFBQyxrREFBRDtBQUFNLGtCQUFJLEVBQUMsR0FBWDtBQUFBLHFDQUNDO0FBQUcseUJBQVMsRUFBQyxpQkFBYjtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUREO0FBQUE7QUFBQTtBQUFBO0FBQUEseUJBUEQ7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBREQ7QUFBQTtBQUFBO0FBQUE7QUFBQTtBQUREO0FBQUE7QUFBQTtBQUFBO0FBQUE7QUFERDtBQUFBO0FBQUE7QUFBQTtBQUFBO0FBREQ7QUFBQTtBQUFBO0FBQUE7QUFBQSxlQURFO0FBcUJILENBdEJEOztBQXdCQSwrREFBZUEsU0FBZixFOzs7Ozs7Ozs7OztBQzNCQSx5RTs7Ozs7Ozs7Ozs7QUNBQSxpRzs7Ozs7Ozs7Ozs7QUNBQSxtQzs7Ozs7Ozs7Ozs7QUNBQSxzQzs7Ozs7Ozs7Ozs7QUNBQSxtRDs7Ozs7Ozs7OztBQ0FBLGUiLCJmaWxlIjoicGFnZXMvNDA0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IExpbmsgZnJvbSAnbmV4dC9saW5rJ1xuXG5jb25zdCBDdXN0b200MDQgPSAoKSA9PiB7XG4gICAgcmV0dXJuIChcblx0XHQ8ZGl2IGNsYXNzTmFtZT1cImVycm9yLWFyZWFcIj5cblx0XHRcdDxkaXYgY2xhc3NOYW1lPVwiZC10YWJsZVwiPlxuXHRcdFx0XHQ8ZGl2IGNsYXNzTmFtZT1cImQtdGFibGUtY2VsbFwiPlxuXHRcdFx0XHRcdDxkaXYgY2xhc3NOYW1lPVwiY29udGFpbmVyXCI+XG5cdFx0XHRcdFx0XHQ8ZGl2IGNsYXNzTmFtZT1cImVycm9yLWNvbnRlbnRcIj5cblx0XHRcdFx0XHRcdFx0PGRpdiBjbGFzc05hbWU9XCJub3Rmb3VuZC00MDRcIj5cblx0XHRcdFx0XHRcdFx0XHQ8aDE+T29wcyE8L2gxPlxuXHRcdFx0XHRcdFx0XHQ8L2Rpdj5cblx0XHRcdFx0XHRcdFx0PGgzPjQwNCAtIFBhZ2Ugbm90IGZvdW5kPC9oMz5cblx0XHRcdFx0XHRcdFx0PHA+VGhlIHBhZ2UgeW91IGFyZSBsb29raW5nIGZvciBtaWdodCBoYXZlIGJlZW4gcmVtb3ZlZCBoYWQgaXRzIG5hbWUgY2hhbmdlZCBvciBpcyB0ZW1wb3JhcmlseSB1bmF2YWlsYWJsZS48L3A+XG5cblx0XHRcdFx0XHRcdFx0PExpbmsgaHJlZj1cIi9cIj5cblx0XHRcdFx0XHRcdFx0XHQ8YSBjbGFzc05hbWU9XCJidG4gYnRuLXByaW1hcnlcIj5HbyB0byBIb21lcGFnZTwvYT5cblx0XHRcdFx0XHRcdFx0PC9MaW5rPlxuXHRcdFx0XHRcdFx0PC9kaXY+XG5cdFx0XHRcdFx0PC9kaXY+XG5cdFx0XHRcdDwvZGl2PlxuXHRcdFx0PC9kaXY+XG5cdFx0PC9kaXY+XG4gICAgKVxufVxuXG5leHBvcnQgZGVmYXVsdCBDdXN0b200MDQiLCJtb2R1bGUuZXhwb3J0cyA9IHJlcXVpcmUoXCJuZXh0L2Rpc3QvbmV4dC1zZXJ2ZXIvbGliL3JvdXRlci1jb250ZXh0LmpzXCIpOzsiLCJtb2R1bGUuZXhwb3J0cyA9IHJlcXVpcmUoXCJuZXh0L2Rpc3QvbmV4dC1zZXJ2ZXIvbGliL3JvdXRlci91dGlscy9nZXQtYXNzZXQtcGF0aC1mcm9tLXJvdXRlLmpzXCIpOzsiLCJtb2R1bGUuZXhwb3J0cyA9IHJlcXVpcmUoXCJyZWFjdFwiKTs7IiwibW9kdWxlLmV4cG9ydHMgPSByZXF1aXJlKFwicmVhY3QtaXNcIik7OyIsIm1vZHVsZS5leHBvcnRzID0gcmVxdWlyZShcInJlYWN0L2pzeC1kZXYtcnVudGltZVwiKTs7IiwiLyogKGlnbm9yZWQpICovIl0sInNvdXJjZVJvb3QiOiIifQ==

.next/server/pages/next/dist/pages/_error.js

@@ -1,40 +0,0 @@
-(function() {
-var exports = {};
-exports.id = "pages/next/dist/pages/_error";
-exports.ids = ["pages/next/dist/pages/_error"];
-exports.modules = {
-
-/***/ "../next-server/lib/head":
-/*!****************************************************!*\
-  !*** external "next/dist/next-server/lib/head.js" ***!
-  \****************************************************/
-/***/ (function(module) {
-
-"use strict";
-module.exports = require("next/dist/next-server/lib/head.js");;
-
-/***/ }),
-
-/***/ "react":
-/*!************************!*\
-  !*** external "react" ***!
-  \************************/
-/***/ (function(module) {
-
-"use strict";
-module.exports = require("react");;
-
-/***/ })
-
-};
-;
-
-// load runtime
-var __webpack_require__ = require("../../../../webpack-runtime.js");
-__webpack_require__.C(exports);
-var __webpack_exec__ = function(moduleId) { return __webpack_require__(__webpack_require__.s = moduleId); }
-var __webpack_exports__ = __webpack_require__.X(0, ["vendors-node_modules_next_dist_pages__error_js"], function() { return __webpack_exec__("./node_modules/next/dist/pages/_error.js"); });
-module.exports = __webpack_exports__;
-
-})();
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly9zdGFydHAvZXh0ZXJuYWwgXCJuZXh0L2Rpc3QvbmV4dC1zZXJ2ZXIvbGliL2hlYWQuanNcIiIsIndlYnBhY2s6Ly9zdGFydHAvZXh0ZXJuYWwgXCJyZWFjdFwiIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7QUFBQSwrRDs7Ozs7Ozs7Ozs7QUNBQSxtQyIsImZpbGUiOiJwYWdlcy9uZXh0L2Rpc3QvcGFnZXMvX2Vycm9yLmpzIiwic291cmNlc0NvbnRlbnQiOlsibW9kdWxlLmV4cG9ydHMgPSByZXF1aXJlKFwibmV4dC9kaXN0L25leHQtc2VydmVyL2xpYi9oZWFkLmpzXCIpOzsiLCJtb2R1bGUuZXhwb3J0cyA9IHJlcXVpcmUoXCJyZWFjdFwiKTs7Il0sInNvdXJjZVJvb3QiOiIifQ==

.next/static/development/_buildManifest.js

@@ -1 +1 @@
-self.__BUILD_MANIFEST = {__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":["static\u002Fchunks\u002Fpages\u002Findex.js"],"/_error":["static\u002Fchunks\u002Fpages\u002F_error.js"],"/yamaha/Shop/Cart":["static\u002Fchunks\u002Fpages\u002Fyamaha\u002FShop\u002FCart.js"],sortedPages:["\u002F","\u002F_app","\u002F_error","\u002Fyamaha\u002FShop\u002FCart"]};self.__BUILD_MANIFEST_CB && self.__BUILD_MANIFEST_CB()
+self.__BUILD_MANIFEST = {__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":["static\u002Fchunks\u002Fpages\u002Findex.js"],"/_error":["static\u002Fchunks\u002Fpages\u002F_error.js"],"/yamaha":["static\u002Fchunks\u002Fpages\u002Fyamaha.js"],sortedPages:["\u002F","\u002F_app","\u002F_error","\u002Fyamaha"]};self.__BUILD_MANIFEST_CB && self.__BUILD_MANIFEST_CB()

api/product/product.js

@@ -19,6 +19,13 @@ async function GetDetailProduct(id, token = "") {
           name
           price
         }
+        product_image_colors{
+          id
+          name
+          img{
+            url
+          }
+        }
         description
         spesifikasi_mesin
         spesifikasi_dimensi
@@ -75,245 +82,11 @@ async function GetProduct(token = "") {
   return res;
 }
 
-async function GetProductMatic(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "matic" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductMaxi(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "maxi" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductNaked(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "naked" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductSport(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "sport" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductOffRoad(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "offroad" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductMoped(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "moped" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductMonsterEnergy(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "monsterenergy" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductCBU(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "cbu" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductATV(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "atv" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductPowerProduct(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { categories: "powerproduct" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductHonda(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { business_partner: "3" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
-async function GetProductHino(token = "") {
-  var res = await apollo.query(
-    `
-    query {
-      products(where: { business_partner: "4" }) {
-        id
-        name
-        price
-        img {
-          url
-        }
-      }
-    }`,
-    token
-  );
-  return res;
-}
-
 module.exports = {
 
   GetProductImgColor: GetProductImgColor,
   GetProduct: GetProduct,
 
-  //yamaha
-  GetProductMatic: GetProductMatic,
-  GetProductMaxi: GetProductMaxi,
-  GetProductNaked: GetProductNaked,
-  GetProductSport: GetProductSport,
-  GetProductOffRoad: GetProductOffRoad,
-  GetProductMoped: GetProductMoped,
-  GetProductMonsterEnergy: GetProductMonsterEnergy,
-  GetProductCBU: GetProductCBU,
-  GetProductATV: GetProductATV,
-  GetProductPowerProduct: GetProductPowerProduct,
-
-  //honda
-  GetProductHonda:GetProductHonda,
-
-  //hino
-  GetProductHino:GetProductHino,
-
   //detail
   GetDetailProduct: GetDetailProduct,
 };

components/Yamaha/Product/Motor_Detail.js

@@ -42,10 +42,8 @@ const ProductDetails = function ({ detailproduct, backend, user, ...props }) {
         product_name: "",
         product_color: "",
         product_price: "",
-        product_otr: "",
     });
 
-
     const MotorDetail = detailproduct.map((data) => {
 
         return (
@@ -90,10 +88,7 @@ const ProductDetails = function ({ detailproduct, backend, user, ...props }) {
                                             e.preventDefault();
                                             var newformValue = {
                                                 ...formValue,
-
-                                                product_img: detailproduct.img,
                                                 product_name: detailproduct[0].name,
-                                                product_price: detailproduct[0].price,
                                             }
                                             setFormValue(newformValue)
                                             console.log(JSON.stringify(newformValue));
@@ -132,15 +127,20 @@ const ProductDetails = function ({ detailproduct, backend, user, ...props }) {
                                                 onInput={(e) => {
                                                     setFormValue({
                                                         ...formValue,
-                                                        product_otr: e.target.value.toString()
+                                                        product_price: e.target.value.toString(),
                                                     })
                                                 }}
-
                                             >
                                                 <option value="0">- Pilih Product OTR -</option>
-                                                <option value={"Palembang"}>OTR Palembang</option>
-                                                <option value={"Sumsel"}>OTR Sumatera Selatan</option>
-                                                <option value={"Bengkulu"}>OTR Bengkulu</option>
+                                                {detailproduct.map((option) => (
+                                                    <option value={option.product_otrs[0].price}>{option.product_otrs[0].name}</option>
+                                                ))}
+                                                {detailproduct.map((option) => (
+                                                    <option value={option.product_otrs[1].price}>{option.product_otrs[1].name}</option>
+                                                ))}
+                                                {detailproduct.map((option) => (
+                                                    <option value={option.product_otrs[2].price}>{option.product_otrs[2].name}</option>
+                                                ))}
                                             </select>
                                         </div>
                                         <br />
@@ -157,10 +157,15 @@ const ProductDetails = function ({ detailproduct, backend, user, ...props }) {
                                                 }}
                                             >
                                                 <option value="0">- Pilih Product Color -</option>
-                                                <option value="Putih">Putih</option>
-                                                <option value="Merah">Merah</option>
-                                                <option value="Hitam">Hitam</option>
-                                                <option value="Abu-Abu">Abu - Abu</option>
+                                                {detailproduct.map((option) => (
+                                                    <option value={option.product_image_colors[0].name}>{option.product_image_colors[0].name}</option>
+                                                ))}
+                                                {detailproduct.map((option) => (
+                                                    <option value={option.product_image_colors[1].name}>{option.product_image_colors[1].name}</option>
+                                                ))}
+                                                {detailproduct.map((option) => (
+                                                    <option value={option.product_image_colors[2].name}>{option.product_image_colors[2].name}</option>
+                                                ))}
                                             </select>
                                         </div>
                                         <br />

components/Yamaha/Shop/Cart.js

@@ -80,7 +80,7 @@ const CartContent = function ({ backend, cart_product, ...props }) {
                                 </td>
 
                                 <td className="product-subtotal">
-                                    <span className="subtotal-amount">${(data.quantity * data.product_price).toFixed(2)}</span>
+                                    <span className="subtotal-amount"><NumberFormat value={(2 * data.product_price).toFixed(2)} displayType={'text'} thousandSeparator={true} prefix={'Rp.'} /></span>
 
                                     <a href="#" className="remove" onClick={() => {removeItem(data.id)}}>
                                         <Icon.Trash2 />
@@ -89,7 +89,7 @@ const CartContent = function ({ backend, cart_product, ...props }) {
                             </tr>
                         )) : (
                             <tr>
-                                <td colSpan="5" className="text-center">Empty</td>
+                                <td colSpan="5" className="text-center">Tidak Ada Product di Keranjang</td>
                             </tr>
                         )}
                         
@@ -116,11 +116,12 @@ const CartContent = function ({ backend, cart_product, ...props }) {
                     <li>Total <span><b>${(total + 10).toFixed(2)}</b></span></li>
                 </ul>
                 
-                <Link href="#">
-                    <a onClick={e => {
+                <Link href="/yamaha/Shop/Checkout">
+                    {/* <a onClick={e => {
                         e.preventDefault();
                         reset()
-                    }} className="btn btn-primary">Proceed to Checkout</a>
+                    }} className="btn btn-primary">Proceed to Checkout</a> */}
+                    <a className="btn btn-primary">Proceed to Checkout</a>
                 </Link>
             </div>
         </>

components/Yamaha/Shop/Checkout.js

@@ -0,0 +1,256 @@
+import React from 'react';
+import * as Icon from 'react-feather';
+ 
+const CheckoutContent = () => {
+    return (
+        <>
+            <div className="checkout-area ptb-80">
+                <div className="container">
+                    <div className="row">
+                        <div className="col-lg-12 col-md-12">
+                            <div className="user-actions">
+                                <Icon.Edit />
+                                <span>Returning customer? <a href="#">Click here to login</a></span>
+                            </div>
+                        </div>
+                    </div>
+
+                    <form>
+                        <div className="row">
+                            <div className="col-lg-6 col-md-12">
+                                <div className="billing-details">
+                                    <h3 className="title">Billing Details</h3>
+
+                                    <div className="row">
+                                        <div className="col-lg-12 col-md-12">
+                                            <div className="form-group">
+                                                <label>Country <span className="required">*</span></label>
+                                            
+                                                <div className="select-box">
+                                                    <select className="form-select">
+                                                        <option value="1">United Arab Emirates</option>
+                                                        <option value="2">China</option>
+                                                        <option value="3">United Kingdom</option>
+                                                        <option value="4">Germany</option>
+                                                        <option value="5">France</option>
+                                                        <option value="6">Japan</option>
+                                                    </select>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-6 col-md-6">
+                                            <div className="form-group">
+                                                <label>First Name <span className="required">*</span></label>
+                                                <input type="text" className="form-control" />
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-6 col-md-6">
+                                            <div className="form-group">
+                                                <label>Last Name <span className="required">*</span></label>
+                                                <input type="text" className="form-control" />
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-12 col-md-12">
+                                            <div className="form-group">
+                                                <label>Company Name</label>
+                                                <input type="text" className="form-control" />
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-12 col-md-6">
+                                            <div className="form-group">
+                                                <label>Address <span className="required">*</span></label>
+                                                <input type="text" className="form-control" />
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-12 col-md-6">
+                                            <div className="form-group">
+                                                <label>Town / City <span className="required">*</span></label>
+                                                <input type="text" className="form-control" />
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-6 col-md-6">
+                                            <div className="form-group">
+                                                <label>State / County <span className="required">*</span></label>
+                                                <input type="text" className="form-control" />
+                                            </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-6 col-md-6">
+                                            <div className="form-group">
+                                                <label>Email Address <span className="required">*</span></label>
+                                                <input type="email" className="form-control" />
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-6 col-md-6">
+                                            <div className="form-group">
+                                                <label>Phone <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" />
+                                                <label className="form-check-label" htmlFor="create-an-account">Create an account?</label>
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-12 col-md-12">
+                                            <div className="form-check">
+                                                <input type="checkbox" className="form-check-input" id="ship-different-address" />
+                                                <label className="form-check-label" htmlFor="ship-different-address">Ship to a different address?</label>
+                                            </div>
+                                        </div>
+
+                                        <div className="col-lg-12 col-md-12">
+                                            <div className="form-group">
+                                                <textarea name="notes" id="notes" cols="30" rows="4" placeholder="Order Notes" className="form-control"></textarea>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div className="col-lg-6 col-md-12">
+                                <div className="order-details">
+                                    <h3 className="title">Your Order</h3>
+
+                                    <div className="order-table table-responsive">
+                                        <table className="table table-bordered">
+                                            <thead>
+                                                <tr>
+                                                    <th scope="col">Product Name</th>
+                                                    <th scope="col">Total</th>
+                                                </tr>
+                                            </thead>
+
+                                            <tbody>
+                                                <tr>
+                                                    <td className="product-name">
+                                                        <a href="#">Smart Watch</a>
+                                                    </td>
+
+                                                    <td className="product-total">
+                                                        <span className="subtotal-amount">$30.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="product-name">
+                                                        <a href="#">TV</a>
+                                                    </td>
+
+                                                    <td className="product-total">
+                                                        <span className="subtotal-amount">$30.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="product-name">
+                                                        <a href="#">Book</a>
+                                                    </td>
+
+                                                    <td className="product-total">
+                                                        <span className="subtotal-amount">$30.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="product-name">
+                                                        <a href="#">Smart Watch</a>
+                                                    </td>
+
+                                                    <td className="product-total">
+                                                        <span className="subtotal-amount">$30.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="product-name">
+                                                        <a href="#">TV</a>
+                                                    </td>
+
+                                                    <td className="product-total">
+                                                        <span className="subtotal-amount">$30.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="product-name">
+                                                        <a href="#">Book</a>
+                                                    </td>
+
+                                                    <td className="product-total">
+                                                        <span className="subtotal-amount">$30.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="order-subtotal">
+                                                        <span>Cart Subtotal</span>
+                                                    </td>
+
+                                                    <td className="order-subtotal-price">
+                                                        <span className="order-subtotal-amount">$210.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="order-shipping">
+                                                        <span>Shipping</span>
+                                                    </td>
+
+                                                    <td className="shipping-price">
+                                                        <span>$5.00</span>
+                                                    </td>
+                                                </tr>
+                                                <tr>
+                                                    <td className="total-price">
+                                                        <span>Order Total</span>
+                                                    </td>
+
+                                                    <td className="product-subtotal">
+                                                        <span className="subtotal-amount">$215.00</span>
+                                                    </td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+
+                                    <div className="payment-method">
+                                        <p>
+                                            <input type="radio" id="direct-bank-transfer" name="radio-group" defaultChecked />
+                                            <label htmlFor="direct-bank-transfer">Direct Bank Transfer</label>
+
+                                            Make your payment directly into our bank account. Please use your Order ID as the payment reference. Your order will not be shipped until the funds have cleared in our account.
+                                        </p>
+                                        <p>
+                                            <input type="radio" id="paypal" name="radio-group" />
+                                            <label htmlFor="paypal">PayPal</label>
+                                        </p>
+                                        <p>
+                                            <input type="radio" id="cash-on-delivery" name="radio-group" />
+                                            <label htmlFor="cash-on-delivery">Cash on Delivery</label>
+                                        </p>
+                                    </div>
+
+                                    <a href="#" className="btn btn-primary order-btn">Place Order</a>
+                                </div>
+                            </div>
+                        </div>
+                    </form>
+                </div>
+            </div>
+
+        </>
+    )
+}
+
+export default CheckoutContent;

components/Yamaha/Shop/QtyForm.js

@@ -33,7 +33,8 @@ const QtyForm = ({ id, quantity}) => {
             <input 
                 type="text" 
                 min="1" 
-                value={quantity}
+                // value={quantity}
+                value="1"
                 readOnly={true}
                 onChange={e => (e)}
             />

components/_App/NavbarYamaha.js

@@ -2,9 +2,9 @@ import React, { useState } from "react";
 import Link from '@/utils/ActiveLink';
 import * as Icon from 'react-feather';
 
-const NavbarStyleTwo = () => {
+export default function NavbarYamaha({ username, ...props }) {
     const [menu, setMenu] = React.useState(true)
- 
+
     const toggleNavbar = () => {
         setMenu(!menu)
     }
@@ -18,9 +18,9 @@ const NavbarStyleTwo = () => {
                 elementId.classList.remove("is-sticky");
             }
         });
-        window.scrollTo(0, 0); 
+        window.scrollTo(0, 0);
     })
- 
+
     const classOne = menu ? 'collapse navbar-collapse' : 'collapse navbar-collapse show';
     const classTwo = menu ? 'navbar-toggler navbar-toggler-right collapsed' : 'navbar-toggler navbar-toggler-right';
 
@@ -35,13 +35,13 @@ const NavbarStyleTwo = () => {
                             </a>
                         </Link>
 
-                        <button 
-                            onClick={toggleNavbar} 
+                        <button
+                            onClick={toggleNavbar}
                             className={classTwo}
-                            type="button" 
-                            data-toggle="collapse" 
-                            data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" 
-                            aria-expanded="false" 
+                            type="button"
+                            data-toggle="collapse"
+                            data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
+                            aria-expanded="false"
                             aria-label="Toggle navigation"
                         >
                             <span className="icon-bar top-bar"></span>
@@ -64,7 +64,7 @@ const NavbarStyleTwo = () => {
                                         <a onClick={e => e.preventDefault()} className="nav-link">
                                             Product <Icon.ChevronDown />
                                         </a>
-                                    </Link> 
+                                    </Link>
 
                                     <ul className="dropdown-menu">
                                         <li className="nav-item">
@@ -123,19 +123,70 @@ const NavbarStyleTwo = () => {
                         <div className="others-option">
                             <Link href="/yamaha/Shop/Cart">
                                 <a className="cart-wrapper-btn">
-                                    <Icon.ShoppingCart /> 
+                                    <Icon.ShoppingCart />
                                 </a>
                             </Link>
 
                             <Link href="/yamaha/login">
-							    <a className="btn btn-primary">Login</a>
+                                {!username || username == "" ? (
+                                    <Link href="/yamaha/login">
+                                        <a className="btn btn-primary">Login</a>
+                                    </Link>
+                                ) : (
+                                    <CustomDropdown
+                                        noLiPadding
+                                        navDropdown
+                                        buttonText={
+                                            username.length > 12 ? username.substring(0, 9) + ".." : username
+                                        }
+                                        buttonProps={{
+                                            className: classes.navLink,
+                                            color: "transparent",
+                                        }}
+                                        buttonIcon={Person}
+                                        dropdownList={[
+                                            <div
+                                                onClick={async (e) => {
+                                                    e.preventDefault();
+                                                    fetch("/api/auth/logout", {
+                                                        method: "POST",
+                                                        headers: {
+                                                            "Content-Type": "application/json",
+                                                        },
+                                                        body: JSON.stringify({ p: "YAMAHA" }),
+                                                    }).then((res) => {
+                                                        //if (res.ok) {
+                                                        window.location.href = "../yamaha/home";
+                                                        /*}
+                                                                            else{
+                                    
+                                                                            }*/
+                                                    });
+                                                }}
+                                            >
+                                                <Link href="/yamaha/login">
+                                                    <a className="btn btn-primary">Logout</a>
+                                                </Link>
+                                            </div>,
+                                            <div>
+                                                <Link href="/yamaha/login">
+                                                    <a className="btn btn-primary">Profile</a>
+                                                </Link>
+                                            </div>,
+                                            <div>
+                                                <Link href="/yamaha/login">
+                                                    <a className="btn btn-primary">Pesanan Saya</a>
+                                                </Link>
+                                            </div>
+                                            // <a href="/yamaha/profile/profile" className={classes.dropdownLink}>Profile</a>,
+                                        ]}
+                                    />
+                                )}
                             </Link>
-						</div>
+                        </div>
                     </nav>
                 </div>
             </div>
         </header>
     );
-}
-
-export default NavbarStyleTwo;
+}

package.json

@@ -16,6 +16,7 @@
         "cookies": "^0.8.0",
         "cross-fetch": "^3.1.4",
         "graphql": "^15.6.1",
+        "midtrans-client": "^1.2.5",
         "next": "^10.0.7",
         "nodemailer": "^6.5.0",
         "nodemailer-sendgrid-transport": "^0.2.0",

pages/api/auth/login.js

@@ -1,4 +1,4 @@
-import auth from "auth/auth";
+import auth from "api/auth/auth";
 import Cookies from "cookies";
 
 export default async function handler(req, res) {

pages/yamaha/Shop/Checkout.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import Navbar from "@/components/_App/NavbarYamaha";
+import Footer from "@/components/_App/FooterYamaha";
+import PageBanner from '@/components/Common/PageBanner'; 
+import CheckoutContent from '@/components/Yamaha/Shop/Checkout';
+import * as Icon from 'react-feather';
+ 
+const Checkout = () => {
+    return (
+        <>
+            <Navbar />
+
+            <PageBanner pageTitle="Checkout" />
+
+            <CheckoutContent />
+ 
+            <Footer />
+        </>
+    )
+}
+
+export default Checkout;

pages/yamaha/login.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import Link from 'next/link';
 import * as Icon from 'react-feather';
+import { useRouter } from "next/router";
 
 const Login = () => {
 
@@ -8,7 +9,8 @@ const Login = () => {
     const [pass, setPass] = React.useState("");
     const [open, setOpen] = React.useState(false);
     const [error, setError] = React.useState("");
-
+    const router = useRouter();
+    
     const submitHandler = async (event) => {
         event.preventDefault();
         setEmail(event.target.email.value);
@@ -44,7 +46,7 @@ const Login = () => {
                             <p>Tidak Punya Akun ? Silahkan <Link href="/yamaha/Register">Register</Link></p>
                         </div>
 
-                        <form onSubmit={submitHandler} onClick={e => e.preventDefault()}>
+                        <form onSubmit={submitHandler}>
                             <div className="mb-3">
                                 <label className="form-label">Email</label>
                                 <input type="email" className="form-control" id="email"

public/css/style.css

@@ -289,7 +289,7 @@ textarea.form-control {
   width: 0;
   -webkit-transition: 0.5s;
   transition: 0.5s;
-  background: #c679e3;
+  background: #EB1928;
   z-index: -1;
 }
 
@@ -323,12 +323,12 @@ textarea.form-control {
 
 .btn.btn-secondary::before {
   border-radius: 0;
-  background: #c679e3;
+  background: #EB1928;
 }
 
 .btn.btn-secondary::after {
   border-radius: 0;
-  background: #c679e3;
+  background: #EB1928;
 }
 
 .btn.btn-secondary:not(:disabled):not(.disabled).active, .btn.btn-secondary:not(:disabled):not(.disabled):active, .show > .btn.btn-secondary.dropdown-toggle {
@@ -431,7 +431,7 @@ label {
 
 .section-title .sub-title {
   display: inline-block;
-  color: #c679e3;
+  color: #EB1928;
   background-color: #f5dffd;
   margin-bottom: 18px;
   border-radius: 30px;
@@ -780,7 +780,7 @@ Navbar CSS
 }
 
 .navbar-color-white .startp-nav nav .others-option .btn.btn-primary {
-  background: #c679e3;
+  background: #EB1928;
   -webkit-box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
           box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
 }
@@ -1453,12 +1453,12 @@ Boxes CSS
   background: rgba(247, 138, 203, 0.3);
 }
 
-.single-box.bg-c679e3 {
+.single-box.bg-EB1928 {
   border-color: #edc3fc;
 }
 
-.single-box.bg-c679e3 .icon {
-  color: #c679e3;
+.single-box.bg-EB1928 .icon {
+  color: #EB1928;
   background: #edc3fc;
 }
 
@@ -1495,8 +1495,8 @@ Boxes CSS
   color: #f78acb;
 }
 
-.single-box:hover.bg-c679e3 .icon {
-  color: #c679e3;
+.single-box:hover.bg-EB1928 .icon {
+  color: #EB1928;
 }
 
 .single-box:hover.bg-eb6b3d .icon {
@@ -1982,8 +1982,8 @@ Services CSS
   transition: 0.5s;
 }
 
-.single-services-box .icon.bg-c679e3 {
-  color: #c679e3;
+.single-services-box .icon.bg-EB1928 {
+  color: #EB1928;
   background: #edc3fc;
 }
 
@@ -2025,8 +2025,8 @@ Services CSS
   color: #ffffff;
 }
 
-.single-services-box:hover .icon.bg-c679e3 {
-  background: #c679e3;
+.single-services-box:hover .icon.bg-EB1928 {
+  background: #EB1928;
 }
 
 .single-services-box:hover .icon.bg-eb6b3d {
@@ -2265,8 +2265,8 @@ Features CSS
   transition: 0.5s;
 }
 
-.single-features .icon.bg-c679e3 {
-  color: #c679e3;
+.single-features .icon.bg-EB1928 {
+  color: #EB1928;
   background: #edc3fc;
 }
 
@@ -2287,8 +2287,8 @@ Features CSS
   color: #ffffff;
 }
 
-.single-features:hover .icon.bg-c679e3 {
-  background: #c679e3;
+.single-features:hover .icon.bg-EB1928 {
+  background: #EB1928;
 }
 
 .single-features:hover .icon.bg-eb6b3d {
@@ -2328,8 +2328,8 @@ Features CSS
   transition: 0.5s;
 }
 
-.single-hosting-features .icon.bg-c679e3 {
-  color: #c679e3;
+.single-hosting-features .icon.bg-EB1928 {
+  color: #EB1928;
   background: #edc3fc;
 }
 
@@ -2371,8 +2371,8 @@ Features CSS
   color: #ffffff;
 }
 
-.single-hosting-features:hover .icon.bg-c679e3 {
-  background: #c679e3;
+.single-hosting-features:hover .icon.bg-EB1928 {
+  background: #EB1928;
 }
 
 .single-hosting-features:hover .icon.bg-eb6b3d {
@@ -2552,7 +2552,7 @@ Team CSS
 }
 
 .single-team .team-content ul li a {
-  color: #c679e3;
+  color: #EB1928;
 }
 
 .single-team .team-content ul li a:hover {
@@ -2969,7 +2969,7 @@ Pricing CSS
 }
 
 .pricing-table.active-plan .btn-primary {
-  background: #c679e3;
+  background: #EB1928;
   -webkit-box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
           box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
 }
@@ -3047,7 +3047,7 @@ Pricing CSS
 }
 
 .single-pricing-table.active-plan .btn-primary {
-  background: #c679e3;
+  background: #EB1928;
   -webkit-box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
           box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
 }
@@ -3300,7 +3300,7 @@ Domain Search CSS
 }
 
 .domain-search-content form button:hover, .domain-search-content form button:focus {
-  background-color: #c679e3;
+  background-color: #EB1928;
 }
 
 .domain-search-content ul {
@@ -3380,7 +3380,7 @@ Feedback CSS
   display: block;
   margin-top: 8px;
   margin-bottom: 15px;
-  color: #c679e3;
+  color: #EB1928;
 }
 
 .feedback-slides .client-feedback .single-feedback p {
@@ -3598,7 +3598,7 @@ Feedback CSS
 .single-feedback-item .client-info .title span {
   display: block;
   margin-top: 8px;
-  color: #c679e3;
+  color: #EB1928;
 }
 
 .single-feedback-item p {
@@ -3943,13 +3943,13 @@ Big Data Analytics Banner CSS
 }
 
 .col-lg-4:nth-child(3) .single-banner-boxes .icon {
-  color: #c679e3;
+  color: #EB1928;
   background: #edc3fc;
 }
 
 .col-lg-4:nth-child(3) .single-banner-boxes:hover .icon {
   background-color: #ffffff;
-  color: #c679e3;
+  color: #EB1928;
 }
 
 /*=============================
@@ -4947,7 +4947,7 @@ Shop CSS
 }
 
 #productsModalCenter .modal-content .products-content form button:hover, #productsModalCenter .modal-content .products-content form button:focus {
-  background-color: #c679e3;
+  background-color: #EB1928;
   color: #ffffff;
 }
 
@@ -5168,7 +5168,7 @@ Shop Details CSS
 }
 
 .products-details form .buy-btn .btn-primary {
-  background: #c679e3;
+  background: #EB1928;
   -webkit-box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
           box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
 }
@@ -5605,18 +5605,18 @@ Checkout CSS
   background: #ffffff;
   padding: 18px 25px 15px;
   margin-bottom: 35px;
-  border-top: 3px solid #44ce6f;
+  border-top: 3px solid #EB1928;
 }
 
 .user-actions svg {
-  color: #44ce6f;
+  color: #EB1928;
   margin-right: 4px;
   width: 16px;
 }
 
 .user-actions span {
   display: inline-block;
-  color: #44ce6f;
+  color: #EB1928;
 }
 
 .user-actions span a {
@@ -5626,7 +5626,7 @@ Checkout CSS
 }
 
 .user-actions span a:hover, .user-actions span a:focus {
-  color: #44ce6f;
+  color: #EB1928;
 }
 
 .checkout-area .title {
@@ -5985,7 +5985,7 @@ Blog Details CSS
 }
 
 .blog-details-desc .article-content .entry-meta ul li svg {
-  color: #c679e3;
+  color: #EB1928;
   margin-right: 2px;
   position: relative;
   top: -1px;
@@ -6095,7 +6095,7 @@ Blog Details CSS
 .blog-details-desc .article-footer .article-tags a {
   display: inline-block;
   color: #ffffff;
-  background-color: #c679e3;
+  background-color: #EB1928;
   padding: 4px 12px;
   border-radius: 5px;
   margin-right: 3px;
@@ -6324,7 +6324,7 @@ Blog Details CSS
 
 .comments-area .comment-respond .form-submit input:hover, .comments-area .comment-respond .form-submit input:focus {
   color: #ffffff;
-  background-color: #c679e3;
+  background-color: #EB1928;
   -webkit-transform: translateY(-5px);
           transform: translateY(-5px);
 }
@@ -7285,7 +7285,7 @@ Coming Soon CSS
 }
 
 .coming-soon-content form .submit-btn:hover, .coming-soon-content form .submit-btn:focus {
-  background-color: #c679e3;
+  background-color: #EB1928;
 }
 
 .coming-soon-content #timer div {
@@ -7294,7 +7294,7 @@ Coming Soon CSS
   border-radius: 50%;
   width: 110px;
   height: 110px;
-  color: #c679e3;
+  color: #EB1928;
   -webkit-box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.5);
           box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.5);
   margin: 0 10px;
@@ -8022,7 +8022,7 @@ Repair Feedback CSS
 
 .single-repair-feedback .client-img span {
   display: block;
-  color: #c679e3;
+  color: #EB1928;
   margin-top: 8px;
 }
 
@@ -8779,7 +8779,7 @@ ML About CSS
 
 .ml-about-content .sub-title {
   display: inline-block;
-  color: #c679e3;
+  color: #EB1928;
   background-color: #f5dffd;
   margin-bottom: 18px;
   border-radius: 30px;
@@ -8934,7 +8934,7 @@ ML Feedback CSS
 
 .single-ml-feedback-item .client-info span {
   display: block;
-  color: #c679e3;
+  color: #EB1928;
   margin-top: 5px;
   font-size: 13px;
 }
@@ -9397,7 +9397,7 @@ ML Projects CSS
 }
 
 .single-ml-projects-box .plus-icon a:hover {
-  background-color: #c679e3;
+  background-color: #EB1928;
 }
 
 .single-ml-projects-box:hover .plus-icon a {
@@ -9626,7 +9626,7 @@ Agency About CSS
 
 .agency-about-content .sub-title {
   display: inline-block;
-  color: #c679e3;
+  color: #EB1928;
   background-color: #f5dffd;
   margin-bottom: 18px;
   border-radius: 30px;
@@ -9832,7 +9832,7 @@ Testimonials CSS
 
 .single-testimonials-item .client-info span {
   display: block;
-  color: #c679e3;
+  color: #EB1928;
   margin-top: 5px;
   font-size: 13px;
 }

public/css/style.scss

@@ -5229,7 +5229,7 @@ Checkout CSS
     background: $white-color;
     padding: 18px 25px 15px;
     margin-bottom: 35px;
-    border-top: 3px solid $light-green-color;
+    border-top: 3px solid #024273;
 
     svg {
         color: $light-green-color;

yarn.lock

@@ -449,7 +449,7 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.11.0.tgz#d61f46d83b2519250e2784daf5b09479a8b41c59"
   integrity sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==
 
-axios@^0.21.1:
+axios@^0.21.1, axios@^0.21.4:
   version "0.21.4"
   resolved "https://registry.yarnpkg.com/axios/-/axios-0.21.4.tgz#c67b90dc0568e5c1cf2b0b858c43ba28e2eda575"
   integrity sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==
@@ -2193,7 +2193,7 @@ lodash.throttle@^4.1.1:
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
   integrity sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y=
 
-lodash@^4.1.0, lodash@^4.15.0, lodash@^4.17.13, lodash@^4.17.4, lodash@^4.2.1:
+lodash@^4.1.0, lodash@^4.15.0, lodash@^4.17.13, lodash@^4.17.21, lodash@^4.17.4, lodash@^4.2.1:
   version "4.17.21"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
@@ -2239,6 +2239,14 @@ merge-stream@^2.0.0:
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
   integrity sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==
 
+midtrans-client@^1.2.5:
+  version "1.2.5"
+  resolved "https://registry.yarnpkg.com/midtrans-client/-/midtrans-client-1.2.5.tgz#16b70736603b935a7645e1eca0f166002742ad02"
+  integrity sha512-thX8xN8NrNq9obkD7kiSglIzmO7AVKTAvZsMUYk3r5nfYHOOfc2damdGC9+98cp8CFaBZx16BON6hkhKyBUmlQ==
+  dependencies:
+    axios "^0.21.4"
+    lodash "^4.17.21"
+
 miller-rabin@^4.0.0:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/miller-rabin/-/miller-rabin-4.0.1.tgz#f080351c865b0dc562a8462966daa53543c78a4d"