](https://www.creative-tim.com/product/material-kit?ref=njsmk-readme)[
](https://www.creative-tim.com/product/nextjs-material-kit?ref=njsmk-readme)[
](https://www.creative-tim.com/product/vue-material-kit?ref=njsmk-readme)[
](https://www.creative-tim.com/product/material-kit-react?ref=njsmk-readme)[
](https://www.creative-tim.com/product/material-kit-react-native?ref=njsmk-readme)[
](https://demos.creative-tim.com/material-kit-figma/presentation.html?ref=njsmk-readme)[
](https://themeisle.com/themes/hestia/?ref=creativetim)[
](https://github.com/creativetimofficial/material-kit/tree/photoshop)[
](https://github.com/creativetimofficial/material-kit/tree/sketch)
-
-
-
-| React Native | Figma | WordPress | NextJS |
-| --- | --- | --- | --- |
-| [](https://www.creative-tim.com/product/material-kit-react-native?ref=njsmk-readme) | [](https://demos.creative-tim.com/material-kit-figma/presentation.html?ref=njsmk-readme) | [](https://themeisle.com/themes/hestia/?ref=creativetim) | [](https://www.creative-tim.com/product/nextjs-material-kit?ref=njsmk-readme)
-
-
-| HTML | React | Vue |
-| --- | --- | --- |
-| [](https://www.creative-tim.com/product/material-kit?ref=njsmk-readme) | [](https://www.creative-tim.com/product/material-kit-react?ref=njsmk-readme) | [](https://www.creative-tim.com/product/vue-material-kit?ref=njsmk-readme)
-
-## Demo
-
-| Buttons | Inputs | Navbars |
-| --- | --- | --- |
-| [](https://demos.creative-tim.com/nextjs-material-kit/?ref=njsmk-readme) | [](https://demos.creative-tim.com/nextjs-material-kit/?ref=njsmk-readme) | [](https://demos.creative-tim.com/nextjs-material-kit/?ref=njsmk-readme)
-
-| Login Page | Landing Page | Profile Page |
-| --- | --- | --- |
-| [](https://demos.creative-tim.com/nextjs-material-kit/login?ref=njsmk-readme) | [](https://demos.creative-tim.com/nextjs-material-kit/landing?ref=njsmk-readme) | [](https://demos.creative-tim.com/nextjs-material-kit/profile?ref=njsmk-readme)
-
-[View More](https://demos.creative-tim.com/nextjs-material-kit/?ref=njsmk-readme)
-
-
-## Quick start
-
-- [Download from Github](https://github.com/creativetimofficial/nextjs-material-kit/archive/master.zip).
-- [Download from Creative Tim](https://www.creative-tim.com/product/nextjs-material-kit?ref=njsmk-readme).
-- Clone the repo: `git clone https://github.com/creativetimofficial/nextjs-material-kit.git`.
-- `npm i nextjs-material-kit`
-- Install with [Bower](https://bower.io/?ref=creativetim): ```bower install nextjs-material-kit```.
-
-
-## Documentation
-The documentation for the NextJS Material Kit is hosted at our [website](https://demos.creative-tim.com/nextjs-material-kit/documentation/tutorial?ref=njsmk-readme).
-
-
-## File Structure
-Within the download you'll find the following directories and files:
-
-```
-nextjs-material-kit
-.
-├── CHANGELOG.md
-├── ISSUE_TEMPLATE.md
-├── LICENSE.md
-├── README.md
-├── next.config.js
-├── package.json
-├── Documentation
-│ ├── assets
-│ └── tutorial-components.html
-├── assets
-│ ├── css
-│ ├── img
-│ │ ├── examples
-│ │ └── faces
-│ ├── jss
-│ │ ├── nextjs-material-kit
-│ │ │ ├── components
-│ │ │ └── pages
-│ │ │ ├── componentsSections
-│ │ │ └── landingPageSections
-│ │ └── nextjs-material-kit.js
-│ └── scss
-│ ├── core
-│ │ ├── mixins
-│ │ └── variables
-│ ├── plugins
-│ └── nextjs-material-kit.scss
-├── pages
-│ ├── _app.js
-│ ├── _document.js
-│ ├── _error.js
-│ ├── components.js
-│ ├── index.js
-│ ├── landingpage.js
-│ ├── loginpage.js
-│ └── profilepage.js
-├── components
-│ ├── Badge
-│ │ └── Badge.js
-│ ├── Card
-│ │ ├── Card.js
-│ │ ├── CardBody.js
-│ │ ├── CardFooter.js
-│ │ └── CardHeader.js
-│ ├── Clearfix
-│ │ └── Clearfix.js
-│ ├── CustomButtons
-│ │ └── Button.js
-│ ├── CustomDropdown
-│ │ └── CustomDropdown.js
-│ ├── CustomInput
-│ │ └── CustomInput.js
-│ ├── CustomLinearProgress
-│ │ └── CustomLinearProgress.js
-│ ├── CustomTabs
-│ │ └── CustomTabs.js
-│ ├── Footer
-│ │ └── Footer.js
-│ ├── Grid
-│ │ ├── GridContainer.js
-│ │ └── GridItem.js
-│ ├── Header
-│ │ ├── Header.js
-│ │ └── HeaderLinks.js
-│ ├── InfoArea
-│ │ └── InfoArea.js
-│ ├── NavPills
-│ │ └── NavPills.js
-│ ├── PageChange
-│ │ └── PageChange.js
-│ ├── Pagination
-│ │ └── Pagination.js
-│ ├── Parallax
-│ │ └── Parallax.js
-│ ├── Snackbar
-│ │ └── SnackbarContent.js
-│ └── Typography
-│ ├── Danger.js
-│ ├── Info.js
-│ ├── Muted.js
-│ ├── Primary.js
-│ ├── Quote.js
-│ ├── Small.js
-│ ├── Success.js
-│ └── Warning.js
-└── pages-sections
- ├── Components-Sections
- │ ├── SectionBasics.js
- │ ├── SectionCarousel.js
- │ ├── SectionCompletedExamples.js
- │ ├── SectionDownload.js
- │ ├── SectionExamples.js
- │ ├── SectionJavascript.js
- │ ├── SectionLogin.js
- │ ├── SectionNavbars.js
- │ ├── SectionNotifications.js
- │ ├── SectionPills.js
- │ ├── SectionTabs.js
- │ └── SectionTypography.js
- └── LandingPage-Sections
- ├── ProductSection.js
- ├── TeamSection.js
- └── WorkSection.js
-```
-
-
-## Browser Support
-
-At present, we officially aim to support the last two versions of the following browsers:
-
-
-
-
-
-## Resources
-- Demo:
+ ![...]({`${backend}${data.img["url"]}`})
+
+ );
+ })
+ return (
+
+
+ {data.name}
+Rp.{data.price}
+ +
+
+
+
+
+
+ );
+}
+
+export default DataAccessories;
\ No newline at end of file
diff --git a/pages-sections/product/accessories_details.js b/pages-sections/product/accessories_details.js
new file mode 100644
index 0000000..e69de29
diff --git a/pages-sections/product/apparel.js b/pages-sections/product/apparel.js
new file mode 100644
index 0000000..c7ecb05
--- /dev/null
+++ b/pages-sections/product/apparel.js
@@ -0,0 +1,64 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Button from "components/CustomButtons/Button.js";
+import Icon from "@material-ui/core/Icon";
+import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
+import Card from "components/Card/Card.js";
+import CardBody from "components/Card/CardBody.js";
+import GridContainer from "components/Grid/GridContainer.js";
+import GridItem from "components/Grid/GridItem.js";
+
+const useStyles = makeStyles(styles);
+
+const DataApparel = function ({ backend, apparel, ...props }) {
+ const classes = useStyles();
+ const { ...rest } = props;
+ const imageClasses = classNames(
+ classes.imgRaised,
+ classes.imgRoundedCircle,
+ classes.imgFluid
+ );
+ const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
+ const ProductApparel = apparel.map((data) => {
+ return (
+
+
+ {ProductAccessories}
+ {ProductAccessories}
+
+
+ Yamaha Accessories
+
+
+
+ );
+ })
+ return (
+
+
+ {data.name}
+Rp.{data.price}
+ +
+
+
+
+
+
+ );
+}
+
+export default DataApparel;
\ No newline at end of file
diff --git a/pages-sections/product/apparel_details.js b/pages-sections/product/apparel_details.js
new file mode 100644
index 0000000..e69de29
diff --git a/pages-sections/product/helmet.js b/pages-sections/product/helmet.js
new file mode 100644
index 0000000..22f0b3a
--- /dev/null
+++ b/pages-sections/product/helmet.js
@@ -0,0 +1,62 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Button from "components/CustomButtons/Button.js";
+import Icon from "@material-ui/core/Icon";
+import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
+import Card from "components/Card/Card.js";
+import CardBody from "components/Card/CardBody.js";
+import GridContainer from "components/Grid/GridContainer.js";
+import GridItem from "components/Grid/GridItem.js";
+
+const useStyles = makeStyles(styles);
+
+const DataHelmet = function ({ backend, helmet, ...props }) {
+ const classes = useStyles();
+ const { ...rest } = props;
+ const imageClasses = classNames(
+ classes.imgRaised,
+ classes.imgRoundedCircle,
+ classes.imgFluid
+ );
+ const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
+ const ProductHelmet = helmet.map((data) => {
+ return (
+
+
+ {ProductApparel}
+ {ProductApparel}
+ {ProductApparel}
+
+
+ Yamaha Apparel
+
+
+
+ );
+ })
+ return (
+
+
+ {data.name}
+Rp.{data.price}
+ +
+
+
+
+
+
+ );
+}
+
+export default DataHelmet;
\ No newline at end of file
diff --git a/pages-sections/product/helmet_details.js b/pages-sections/product/helmet_details.js
new file mode 100644
index 0000000..e69de29
diff --git a/pages-sections/product/product.js b/pages-sections/product/product.js
index 01baf04..b583e67 100644
--- a/pages-sections/product/product.js
+++ b/pages-sections/product/product.js
@@ -39,7 +39,7 @@ const DataProduct = function ({ backend, yamaha, suzuki, honda, hino, mercedes,
+
+ {ProductHelmet}{ProductHelmet}{ProductHelmet}
+
+
+ Yamaha Helmet
+Rp.{data.price}
diff --git a/pages-sections/product/yamalube.js b/pages-sections/product/yamalube.js new file mode 100644 index 0000000..74e032d --- /dev/null +++ b/pages-sections/product/yamalube.js @@ -0,0 +1,62 @@ +import React from "react"; +import classNames from "classnames"; +import { makeStyles } from "@material-ui/core/styles"; + +import Button from "components/CustomButtons/Button.js"; +import Icon from "@material-ui/core/Icon"; +import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js"; +import Card from "components/Card/Card.js"; +import CardBody from "components/Card/CardBody.js"; +import GridContainer from "components/Grid/GridContainer.js"; +import GridItem from "components/Grid/GridItem.js"; + +const useStyles = makeStyles(styles); + +const DataYamalube = function ({ backend, yamalube, ...props }) { + const classes = useStyles(); + const { ...rest } = props; + const imageClasses = classNames( + classes.imgRaised, + classes.imgRoundedCircle, + classes.imgFluid + ); + const navImageClasses = classNames(classes.imgRounded, classes.imgGallery); + const ProductYamalube = yamalube.map((data) => { + return ( +
+
+
+ );
+ })
+ return (
+
+
+ {data.name}
+Rp.{data.price}
+ +
+
+
+
+
+
+ );
+}
+
+export default DataYamalube;
\ No newline at end of file
diff --git a/pages-sections/product/yamalube_details.js b/pages-sections/product/yamalube_details.js
new file mode 100644
index 0000000..e69de29
diff --git a/pages-sections/product/ygp.js b/pages-sections/product/ygp.js
index a9916fc5..f1d7774 100644
--- a/pages-sections/product/ygp.js
+++ b/pages-sections/product/ygp.js
@@ -1,25 +1,58 @@
import React from "react";
+import classNames from "classnames";
import { makeStyles } from "@material-ui/core/styles";
+import Button from "components/CustomButtons/Button.js";
+import Icon from "@material-ui/core/Icon";
import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
import Card from "components/Card/Card.js";
import CardBody from "components/Card/CardBody.js";
-import CardHeader from "components/Card/CardHeader.js";
+import GridContainer from "components/Grid/GridContainer.js";
+import GridItem from "components/Grid/GridItem.js";
const useStyles = makeStyles(styles);
const DataYGP = function ({ backend, ygp, ...props }) {
const classes = useStyles();
+ const { ...rest } = props;
+ const imageClasses = classNames(
+ classes.imgRaised,
+ classes.imgRoundedCircle,
+ classes.imgFluid
+ );
+ const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
+ const ProductYGP = ygp.map((data) => {
+ return (
+
+
+ {ProductYamalube}
+
+
+ Yamalube Oil
+
+
+
+ );
+ })
return (
+
+ {data.name}
+Rp.{data.price}
+ +
-
-
-
Yamaha Geniue Part
-Yamaha Geniue Part
+
+
+ );
+};
+
+export default Accessories;
+
+export async function getServerSideProps(context) {
+ var accessories = [];
+ const backend = process.env.BACKEND_SERVER_URI;
+
+ var res = await GetDataAccessories.GetAccessories();
+ if (res["STATUS"] === 1) {
+ accessories = res["DATA"]["accessories"];
+ }
+
+ return {
+ props: { accessories, backend }, // will be passed to the page component as props
+ };
+}
\ No newline at end of file
diff --git a/pages/product/apparel.js b/pages/product/apparel.js
new file mode 100644
index 0000000..46e26c8
--- /dev/null
+++ b/pages/product/apparel.js
@@ -0,0 +1,56 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Header from "components/Header/Header.js";
+import HeaderLinks from "components/Header/HeaderLinks.js";
+import Footer from "components/Footer/Footer.js";
+import Parallax from "components/Parallax/Parallax.js";
+import styles from "assets/jss/nextjs-material-kit/pages/components.js";
+
+import GetDataApparel from "../../api/product/accessories.js";
+import DataApparel from "../../pages-sections/product/apparel.js";
+import DataSnackbarContent from "../../pages-sections/snackbar.js";
+
+const useStyles = makeStyles(styles);
+
+const Apparel = function ({ apparel, backend, ...props }) {
+ const classes = useStyles();
+ const { ...rest } = props;
+ return (
+
+
+
+
+
+ );
+};
+
+export default Apparel;
+
+export async function getServerSideProps(context) {
+ var apparel = [];
+ const backend = process.env.BACKEND_SERVER_URI;
+
+ var res = await GetDataApparel.GetApparel();
+ if (res["STATUS"] === 1) {
+ apparel = res["DATA"]["accessories"];
+ }
+
+ return {
+ props: { apparel, backend }, // will be passed to the page component as props
+ };
+}
\ No newline at end of file
diff --git a/pages/product/helmet.js b/pages/product/helmet.js
new file mode 100644
index 0000000..4006029
--- /dev/null
+++ b/pages/product/helmet.js
@@ -0,0 +1,56 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Header from "components/Header/Header.js";
+import HeaderLinks from "components/Header/HeaderLinks.js";
+import Footer from "components/Footer/Footer.js";
+import Parallax from "components/Parallax/Parallax.js";
+import styles from "assets/jss/nextjs-material-kit/pages/components.js";
+
+import GetDataHelmet from "../../api/product/accessories.js";
+import DataHelmet from "../../pages-sections/product/helmet.js";
+import DataSnackbarContent from "../../pages-sections/snackbar.js";
+
+const useStyles = makeStyles(styles);
+
+const Helmet = function ({ helmet, backend, ...props }) {
+ const classes = useStyles();
+ const { ...rest } = props;
+ return (
+
+
+
+
+
+ );
+};
+
+export default Helmet;
+
+export async function getServerSideProps(context) {
+ var helmet = [];
+ const backend = process.env.BACKEND_SERVER_URI;
+
+ var res = await GetDataHelmet.GetHelmet();
+ if (res["STATUS"] === 1) {
+ helmet = res["DATA"]["accessories"];
+ }
+
+ return {
+ props: { helmet, backend }, // will be passed to the page component as props
+ };
+}
\ No newline at end of file
diff --git a/pages/product/yamalube.js b/pages/product/yamalube.js
new file mode 100644
index 0000000..8110ed6
--- /dev/null
+++ b/pages/product/yamalube.js
@@ -0,0 +1,58 @@
+import React from "react";
+import classNames from "classnames";
+import { makeStyles } from "@material-ui/core/styles";
+
+import Header from "components/Header/Header.js";
+import HeaderLinks from "components/Header/HeaderLinks.js";
+import Footer from "components/Footer/Footer.js";
+import Parallax from "components/Parallax/Parallax.js";
+import styles from "assets/jss/nextjs-material-kit/pages/components.js";
+
+import GetDataYamalube from "../../api/product/accessories.js";
+import DataYamalube from "../../pages-sections/product/yamalube.js";
+import DataSnackbarContent from "../../pages-sections/snackbar.js";
+
+const useStyles = makeStyles(styles);
+
+const Yamalube = function ({ yamalube, backend, ...props }) {
+ const classes = useStyles();
+ const { ...rest } = props;
+ return (
+
+
+
+
+
+ );
+};
+
+export default Yamalube;
+
+export async function getServerSideProps(context) {
+ var yamalube = [];
+ const backend = process.env.BACKEND_SERVER_URI;
+
+ var res = await GetDataYamalube.GetYamalube();
+ console.log(res);
+
+ if (res["STATUS"] === 1) {
+ yamalube = res["DATA"]["accessories"];
+ }
+
+ return {
+ props: { yamalube, backend }, // will be passed to the page component as props
+ };
+}
\ No newline at end of file
diff --git a/pages/product/ygp.js b/pages/product/ygp.js
index b624e6e..1428a79 100644
--- a/pages/product/ygp.js
+++ b/pages/product/ygp.js
@@ -5,15 +5,16 @@ import { makeStyles } from "@material-ui/core/styles";
import Header from "components/Header/Header.js";
import HeaderLinks from "components/Header/HeaderLinks.js";
import Footer from "components/Footer/Footer.js";
-import DataYGP from "pages-sections/product/ygp.js";
import Parallax from "components/Parallax/Parallax.js";
import styles from "assets/jss/nextjs-material-kit/pages/components.js";
-import GetAccessories from "../../api/product/accessories.js";
+import GetDataYGP from "../../api/product/accessories.js";
+import DataYGP from "../../pages-sections/product/ygp.js";
+import DataSnackbarContent from "../../pages-sections/snackbar.js";
const useStyles = makeStyles(styles);
-const Product = function ({ backend, ygp, ...props }) {
+const YGP = function ({ ygp, backend, ...props }) {
const classes = useStyles();
const { ...rest } = props;
return (
@@ -28,27 +29,30 @@ const Product = function ({ backend, ygp, ...props }) {
}}
{...rest}
/>
-
+
+
+
-
);
};
-export default Product;
+export default YGP;
export async function getServerSideProps(context) {
var ygp = [];
const backend = process.env.BACKEND_SERVER_URI;
- var res = await GetAccessories.GetYGP();
+ var res = await GetDataYGP.GetYGP();
+ console.log(res);
+
if (res["STATUS"] === 1) {
ygp = res["DATA"]["accessories"];
}
return {
- props: { backend, ygp, }, // will be passed to the page component as props
+ props: { ygp, backend }, // will be passed to the page component as props
};
-}
+}
\ No newline at end of file