merge

.next/build-manifest.json

@@ -28,21 +28,9 @@
       "static/runtime/webpack.js",
       "static/runtime/main.js"
     ],
-    "/suzuki/latest_news/latestnews_details": [
-      "static/runtime/webpack.js",
-      "static/runtime/main.js"
-    ],
-    "/suzuki/product/product": [
-      "static/runtime/webpack.js",
-      "static/runtime/main.js"
-    ],
     "/suzuki/product/product_detail": [
       "static/runtime/webpack.js",
       "static/runtime/main.js"
-    ],
-    "/yamaha/latest_news/latestnews": [
-      "static/runtime/webpack.js",
-      "static/runtime/main.js"
     ]
   }
 }

.next/server/pages-manifest.json

@@ -1 +1 @@
-{"/_app":"static/development/pages/_app.js","/_document":"static/development/pages/_document.js","/_error":"static/development/pages/_error.js","/suzuki/home":"static/development/pages/suzuki/home.js","/suzuki/latest_news/latestnews_details":"static/development/pages/suzuki/latest_news/latestnews_details.js","/suzuki/product/product":"static/development/pages/suzuki/product/product.js","/suzuki/product/product_detail":"static/development/pages/suzuki/product/product_detail.js","/yamaha/latest_news/latestnews":"static/development/pages/yamaha/latest_news/latestnews.js"}
+{"/_app":"static/development/pages/_app.js","/_document":"static/development/pages/_document.js","/_error":"static/development/pages/_error.js","/suzuki/home":"static/development/pages/suzuki/home.js","/suzuki/product/product_detail":"static/development/pages/suzuki/product/product_detail.js"}

api/auth/auth.js

@@ -0,0 +1,147 @@
+import apollo from "../../lib/apollo.js";
+import partners from "../partner/partner";
+
+async function register(username, email, password, token = "") {
+    var res = await apollo.mutation(
+        `
+        mutation($username: String! $email: String! $password: String!) {
+          register(input: { username: $username, email: $email, password: $password }) {
+            jwt
+            user {
+              username
+              email
+            }
+          }
+        }`,
+        token,
+        {
+            username: username,
+            email: email,
+            password: password,
+        }
+    );
+    return res;
+}
+
+async function login(partner, email, password, token = "") {
+    var cookiesData = {};
+    var res = await apollo.mutation(
+        `
+        mutation($email: String! $password: String!) {
+          login(input: { identifier: $email, password: $password }) {
+            user{
+              id
+              username
+            }
+            jwt
+          }
+        }`,
+        token,
+        {
+            email: email,
+            password: password,
+        }
+    );
+
+    if (res["STATUS"] == 1) {
+        token = res["DATA"]["login"]["jwt"];
+        res = await apollo.mutation(
+            `
+            query{
+              self{
+                id
+                username
+                email
+                    role{
+                  name
+                  description
+                }
+                partners_login_states{
+                  id
+                  business_partner{
+                    id
+                    name
+                  }
+                }
+              }
+            }
+            `,
+            token
+        );
+    }
+
+    if (res["STATUS"] == 1) {
+        var user = res["DATA"]["self"];
+        var sessions = [];
+        for (const i of user["partners_login_states"]) {
+            sessions.push(i.business_partner);
+        }
+        sessions = sessions.filter(
+            (i) =>
+                i.business_partner &&
+                i.business_partner.name.toUpperCase() == partner.toUpperCase()
+        );
+        if (sessions.length == 0) {
+            res = await partners.getID(partner, token);
+            if (res["STATUS"] == 1) {
+                res = await apollo.mutation(
+                    `
+                    mutation($input: PartnersLoginStateInput!) {
+                        createPartnersLoginState(input:{data:$input}){
+                            partnersLoginState{
+                              id
+                              business_partner{
+                                id
+                                name
+                              }
+                            }
+                        }
+                    }
+                    `,
+                    token,
+                    {
+                        input: {
+                            user: user["id"],
+                            business_partner:
+                                res["DATA"]["businessPartners"][0]["id"],
+                        },
+                    }
+                );
+                if (res["STATUS"] == 1) {
+                    user["partners_login_states"].push(
+                        res["DATA"]["createPartnersLoginState"][
+                            "partnersLoginState"
+                        ]
+                    );
+                }
+            }
+        }
+        cookiesData["user"] = user;
+        cookiesData["token"] = token;
+    }
+    return { res: res, cookies: cookiesData };
+}
+
+async function logout(id, token = "") {
+    var res = await apollo.mutation(
+        `
+        mutation($input: ID!) {
+            deletePartnersLoginState(input:{where:{id:$input}}){
+                partnersLoginState{
+                  id
+                }
+            }
+        }`,
+        token,
+        {
+            input: id,
+        }
+    );
+    return res;
+}
+
+module.exports = {
+    register: register,
+    login: login,
+    logout: logout,
+};

api/partner/partner.js

@@ -0,0 +1,21 @@
+import apollo from "../../lib/apollo.js";
+
+async function getID(partner, token = "") {
+    var res = await apollo.query(
+        `
+        query($input : String!){
+          businessPartners(where:{name_contains:$input}){
+            id
+          }
+        }`,
+        token,
+        {
+            input: partner,
+        }
+    );
+    return res;
+}
+
+module.exports = {
+    getID: getID,
+};

assets/jss/nextjs-material-kit/pages/loginPage.js

@@ -7,11 +7,11 @@ const signupPageStyle = {
     position: "relative",
     paddingTop: "20vh",
     color: "#FFFFFF",
-    paddingBottom: "200px"
+    paddingBottom: "200px",
   },
   cardHidden: {
     opacity: "0",
-    transform: "translate3d(0, -60px, 0)"
+    transform: "translate3d(0, -60px, 0)",
   },
   pageHeader: {
     minHeight: "100vh",
@@ -23,7 +23,7 @@ const signupPageStyle = {
     border: "0",
     alignItems: "center",
     "&:before": {
-      background: "rgba(0, 0, 0, 0.5)"
+      background: "rgba(0, 0, 0, 0.5)",
     },
     "&:before,&:after": {
       position: "absolute",
@@ -33,19 +33,26 @@ const signupPageStyle = {
       display: "block",
       left: "0",
       top: "0",
-      content: '""'
+      content: '""',
     },
     "& footer li a,& footer li a:hover,& footer li a:active": {
-      color: "#FFFFFF"
+      color: "#FFFFFF",
     },
     "& footer": {
       position: "absolute",
       bottom: "0",
-      width: "100%"
-    }
+      width: "100%",
+    },
+  },
+  collapsible: {
+    position: "fixed",
+    bottom: "5px",
+    left: "2%",
+    width: "96%",
+    zIndex: "9999",
   },
   form: {
-    margin: "0"
+    margin: "0",
   },
   cardHeader: {
     width: "auto",
@@ -54,7 +61,7 @@ const signupPageStyle = {
     marginRight: "20px",
     marginTop: "-40px",
     padding: "20px 0",
-    marginBottom: "15px"
+    marginBottom: "15px",
   },
   socialIcons: {
     maxWidth: "24px",
@@ -65,27 +72,27 @@ const signupPageStyle = {
     top: "0",
     height: "100%",
     lineHeight: "41px",
-    fontSize: "20px"
+    fontSize: "20px",
   },
   divider: {
     marginTop: "30px",
     marginBottom: "0px",
-    textAlign: "center"
+    textAlign: "center",
   },
   cardFooter: {
     paddingTop: "0rem",
     border: "0",
     borderRadius: "6px",
-    justifyContent: "center !important"
+    justifyContent: "center !important",
   },
   socialLine: {
     marginTop: "1rem",
     textAlign: "center",
-    padding: "0"
+    padding: "0",
   },
   inputIconsColor: {
-    color: "info"
-  }
+    color: "info",
+  },
 };
 
 export default signupPageStyle;

lib/apollo.js

@@ -8,6 +8,16 @@ import {
 import ApolloConfig from "../config/apollo-config";
 import fetch from "cross-fetch";
 
+function errorHandler(object) {
+  return object.graphQLErrors.length != 0
+    ? object.graphQLErrors[0].message
+    : object.networkError && object.networkError.result
+    ? object.networkError.result.errors.join(" ; ")
+    : object.networkError
+    ? object.networkError[Object.keys(object.networkError)[0]].toString()
+    : "Fetch failed";
+}
+
 function initApollo(token) {
   const httpLink = createHttpLink({
     uri: ApolloConfig.graphql_uri,
@@ -41,7 +51,7 @@ async function query(query, token = "", variables = {}, cache = false) {
     });
     res = { STATUS: 1, DATA: sql.data };
   } catch (e) {
-    res = { STATUS: 0, DATA: e };
+    res = { STATUS: 0, DATA: errorHandler(e) };
   }
   return res;
 }
@@ -58,7 +68,7 @@ async function mutation(mutation, token = "", variables = {}) {
     });
     res = { STATUS: 1, DATA: sql.data };
   } catch (e) {
-    res = { STATUS: 0, DATA: e };
+    res = { STATUS: 0, DATA: errorHandler(e) };
   }
   return res;
 }

package.json

@@ -37,10 +37,12 @@
     "@material-ui/core": "^4.11.3",
     "@material-ui/data-grid": "^4.0.0-alpha.23",
     "@material-ui/icons": "4.9.1",
+    "@material-ui/lab": "^4.0.0-alpha.57",
     "@zeit/next-css": "^1.0.1",
     "@zeit/next-less": "^1.0.1",
     "@zeit/next-sass": "1.0.1",
     "classnames": "2.2.6",
+    "cookies": "^0.8.0",
     "cross-fetch": "^3.0.6",
     "graphql": "^15.3.0",
     "less": "^4.1.1",
@@ -68,4 +70,4 @@
     "styled-components": "5.1.0",
     "webpack": "4.43.0"
   }
-}
+}

pages/api/auth/login.js

@@ -0,0 +1,41 @@
+import auth from "../../../api/auth/auth";
+import Cookies from "cookies";
+
+export default async function handler(req, res) {
+    if (req.method == "POST") {
+        const cookies = new Cookies(req, res);
+        var email = req.body.email;
+        var pass = req.body.pass;
+        var partner = req.body.partner;
+        var resp = await auth.login(partner, email, pass);
+        var login = resp["res"];
+        // console.log(login["DATA"]);
+        if (login["STATUS"] == 0) {
+            return res
+                .status(400)
+                .send(login["DATA"] + ". Check user and password again.");
+        }
+        var userObj = resp["cookies"]["user"];
+        await cookies.set("myToken", resp["cookies"]["token"], {
+            httpOnly: true, // true by default
+        });
+        await cookies.set("user", JSON.stringify(userObj), {
+            httpOnly: true, // true by default
+        });
+        let sessionId = userObj["partners_login_states"].filter(
+            (i) =>
+                i.business_partner &&
+                i.business_partner.name.toUpperCase() == partner.toUpperCase()
+        );
+        if (sessionId.length == 0) return res.status(400).send("Login Failed");
+        return res.status(200).send("Success Login");
+        // res.status(200).json(login);
+        // res.writeHead(200, {
+        //     Location: "../home",
+        //     //add other headers here...
+        // });
+        // res.end();
+    } else {
+        return res.status(400).send("NOT FOUND");
+    }
+}

pages/api/auth/logout.js

@@ -0,0 +1,37 @@
+import auth from "../../../api/auth/auth";
+import Cookies from "cookies";
+
+export default async function handler(req, res) {
+    if (req.method == "POST") {
+        const cookies = new Cookies(req, res);
+        const partner = req.body.p;
+        var user = await cookies.get("user");
+        var token = await cookies.get("myToken");
+        var userObj = user ? JSON.parse(user) : null;
+        // console.log("user", userObj);
+        let sessionId = userObj["partners_login_states"].filter(
+            (i) =>
+                i.business_partner &&
+                i.business_partner.name.toUpperCase() == partner.toUpperCase()
+        );
+        sessionId.forEach(async (i) => {
+            var resp = await auth.logout(i.id, token);
+            if (resp["STATUS"] == 0) {
+                return res.status(400).send(resp["DATA"]);
+            }
+        });
+        userObj["partners_login_states"] = userObj[
+            "partners_login_states"
+        ].filter(
+            (i) =>
+                i.business_partner &&
+                i.business_partner.name.toUpperCase() != partner.toUpperCase()
+        );
+        await cookies.set("user", JSON.stringify(userObj), {
+            httpOnly: true, // true by default
+        });
+        return res.status(200).send("Success Logout");
+    } else {
+        return res.status(400).send("NOT FOUND");
+    }
+}

pages/api/product/get.js

@@ -1,27 +0,0 @@
-import DetailProduct from "../../../api/product/product";
-
-export default async function handler(req, res) {
-    console.log("masuk");
-    if (req.method == "POST") {
-        var id = req.body.id;
-            var detailproduct = await DetailProduct.GetDetailProduct(id);
-            if (detailproduct["STATUS"] == 0) {
-                res.status(200).json(detailproduct);
-            } else if (detailproduct["DATA"]["products"] == null) {
-                res
-                    .status(200)
-                    .json({
-                        STATUS: 0,
-                        DATA: "Product Tidak Ditemukan"
-                    });
-            } else {
-                res.status(200).json({
-                    STATUS: 1,
-                    DATA: detailproduct["DATA"]["products"],
-                });
-            }
-    } else {
-        console.log("masukas");
-        res.status(200).send("NOT FOUND");
-    }
-}

pages/suzuki/home.js

@@ -8,9 +8,9 @@ import Parallax from "components/Parallax/Parallax.js";
 import styles from "assets/jss/nextjs-material-kit/pages/components.js";
 import FooterSuzuki from "components/Footer/FooterSuzuki.js";
 
-import Getservices from "../../api/home/service.js";
-import Getcarousels from "../../api/home/carousel.js";
-
+import GetbusinessPartners from "../../api/suzuki/home/businessPartner.js";
+import Getservices from "../../api/suzuki/home/service.js";
+import Getcarousels from "../../api/suzuki/home/carousel.js";
 import DataSnackbarContent from "../../pages-sections/suzuki/snackbar.js";
 import DataCarousel from "../../pages-sections/suzuki/home/carousel.js";
 import DataService from "../../pages-sections/suzuki/home/service.js";
@@ -18,10 +18,12 @@ import DataBusinessPartner from "../../pages-sections/suzuki/home/business_partn
 import DataSosmed from "../../pages-sections/suzuki/home/sosmed.js";
 import CoreValue from "../../pages-sections/suzuki/home/core_value.js";
 import DataFeature from "../../pages-sections/suzuki/home/feature.js";
+import Cookies from "cookies";
 
 const useStyles = makeStyles(styles);
 const Home = function ({
   backend,
+  businessPartners,
   service,
   carousels,
   ...props
@@ -29,11 +31,10 @@ const Home = function ({
   const classes = useStyles();
   const { ...rest } = props;
   <DataService service={props.service} />;
-
   return (
     <div>
       <Header
-        rightLinks={<HeaderSuzuki/>}
+        rightLinks={<HeaderSuzuki username={props.user} />}
         fixed
         color="info"
         changeColorOnScroll={{
@@ -42,7 +43,10 @@ const Home = function ({
         }}
         {...rest}
       />
-      <Parallax image={require("assets/img/dekstop_pandemi.jpg")}styles={{ marginTop: "50px" }}/>
+      <Parallax
+        image={require("assets/img/dekstop_pandemi.jpg")}
+        styles={{ marginTop: "50px" }}
+      />
       <div className={classNames(classes.main, classes.mainRaised)}>
         <DataSnackbarContent />
         <CoreValue />
@@ -61,19 +65,37 @@ export async function getServerSideProps(context) {
   var service = [];
   var carousels = [];
   const backend = process.env.BACKEND_SERVER_URI;
+  var { req, resp } = context;
+  const cookies = new Cookies(req, resp);
+  var user = "";
+  var userObj = (await cookies.get("user"))
+    ? JSON.parse(await cookies.get("user"))
+    : null;
+  if (userObj) {
+    let sessionId = userObj["partners_login_states"].filter(function (i) {
+      return (
+        i.business_partner && i.business_partner.name.toUpperCase() == "SUZUKI"
+      );
+    });
+    if (sessionId.length != 0) user = userObj["username"];
+  }
+  var res = await GetbusinessPartners.GetbusinessPartners();
+  if (res["STATUS"] === 1) {
+    businessPartners = res["DATA"]["businessPartners"];
+  }
 
-  var res = await Getservices.GetservicesSuzuki();
+  var res = await Getservices.Getservices();
   if (res["STATUS"] === 1) {
     service = res["DATA"]["services"];
   }
 
-  var res = await Getcarousels.GetCarouselsSuzuki();
+  var res = await Getcarousels.GetCarousels();
   if (res["STATUS"] === 1) {
     carousels = res["DATA"]["carousels"];
   }
 
   return {
-    props: { service, carousels, backend }, // will be passed to the page component as props
+    props: { businessPartners, service, carousels, backend, user }, // will be passed to the page component as props
   };
 }
 

pages/suzuki/login.js

@@ -2,6 +2,10 @@ import React from "react";
 // @material-ui/core components
 import { makeStyles } from "@material-ui/core/styles";
 import InputAdornment from "@material-ui/core/InputAdornment";
+import Collapse from "@material-ui/core/Collapse";
+import Alert from "@material-ui/lab/Alert";
+import IconButton from "@material-ui/core/IconButton";
+import CloseIcon from "@material-ui/icons/Close";
 import Icon from "@material-ui/core/Icon";
 // @material-ui/icons
 import Email from "@material-ui/icons/Email";
@@ -23,116 +27,169 @@ import styles from "assets/jss/nextjs-material-kit/pages/loginPage.js";
 
 import image from "assets/img/bgtbg.jpg";
 
+import { useRouter } from "next/router";
+
 const useStyles = makeStyles(styles);
 
 export default function LoginPage(props) {
   const [cardAnimaton, setCardAnimation] = React.useState("cardHidden");
-  setTimeout(function() {
+  const [email, setEmail] = React.useState("");
+  const [pass, setPass] = React.useState("");
+  const [open, setOpen] = React.useState(false);
+  const [error, setError] = React.useState("");
+  const router = useRouter();
+  setTimeout(function () {
     setCardAnimation("");
   }, 700);
   const classes = useStyles();
   const { ...rest } = props;
+
+  const submitHandler = async (event) => {
+    event.preventDefault();
+    const res = await fetch("../api/auth/login", {
+      body: JSON.stringify({
+        partner: "suzuki",
+        email: email,
+        pass: pass,
+      }),
+      headers: {
+        "Content-Type": "application/json",
+      },
+      method: "POST",
+    });
+    // console.log("res", res.S);
+    if (res.ok) {
+      router.push("/suzuki/home");
+    } else {
+      setError(await res.text());
+      setOpen(true);
+    }
+  };
+
   return (
-    <div>
-      <Header
-        absolute
-        color="info"
-        rightLinks={<HeaderLinks />}
-        {...rest}
-      />
-      <div
-        className={classes.pageHeader}
-        style={{
-          backgroundImage: "url(" + image + ")",
-          backgroundSize: "cover",
-          backgroundPosition: "top center"
-        }}
-      >
-        <div className={classes.container}>
-          <GridContainer justify="center">
-            <GridItem xs={12} sm={6} md={4}>
-              <Card className={classes[cardAnimaton]}>
-                <form className={classes.form}>
-                  <CardHeader color="info" className={classes.cardHeader}>
-                    <h4>Login</h4>
-                    <div className={classes.socialLine}>
-                      <Button
-                        justIcon
-                        href="#pablo"
-                        target="_blank"
-                        color="transparent"
-                        onClick={e => e.preventDefault()}
-                      >
-                        <i className={"fab fa-twitter"} />
-                      </Button>
-                      <Button
-                        justIcon
-                        href="#pablo"
-                        target="_blank"
-                        color="transparent"
-                        onClick={e => e.preventDefault()}
-                      >
-                        <i className={"fab fa-facebook"} />
-                      </Button>
-                      <Button
-                        justIcon
-                        href="#pablo"
-                        target="_blank"
-                        color="transparent"
-                        onClick={e => e.preventDefault()}
-                      >
-                        <i className={"fab fa-google-plus-g"} />
+    <>
+      <Collapse className={classes.collapsible} in={open}>
+        <Alert
+          severity="error"
+          action={
+            <IconButton
+              aria-label="close"
+              color="inherit"
+              size="small"
+              onClick={() => {
+                setOpen(false);
+              }}
+            >
+              <CloseIcon fontSize="inherit" />
+            </IconButton>
+          }
+        >
+          {error}
+        </Alert>
+      </Collapse>
+      <div>
+        <Header absolute color="info" rightLinks={<HeaderLinks />} {...rest} />
+        <div
+          className={classes.pageHeader}
+          style={{
+            backgroundImage: "url(" + image + ")",
+            backgroundSize: "cover",
+            backgroundPosition: "top center",
+          }}
+        >
+          <div className={classes.container}>
+            <GridContainer justify="center">
+              <GridItem xs={12} sm={6} md={4}>
+                <Card className={classes[cardAnimaton]}>
+                  <form onSubmit={submitHandler} className={classes.form}>
+                    <CardHeader color="info" className={classes.cardHeader}>
+                      <h4>Login</h4>
+                      <div className={classes.socialLine}>
+                        <Button
+                          justIcon
+                          href="#pablo"
+                          target="_blank"
+                          color="transparent"
+                          onClick={(e) => e.preventDefault()}
+                        >
+                          <i className={"fab fa-twitter"} />
+                        </Button>
+                        <Button
+                          justIcon
+                          href="#pablo"
+                          target="_blank"
+                          color="transparent"
+                          onClick={(e) => e.preventDefault()}
+                        >
+                          <i className={"fab fa-facebook"} />
+                        </Button>
+                        <Button
+                          justIcon
+                          href="#pablo"
+                          target="_blank"
+                          color="transparent"
+                          onClick={(e) => e.preventDefault()}
+                        >
+                          <i className={"fab fa-google-plus-g"} />
+                        </Button>
+                      </div>
+                    </CardHeader>
+                    <p className={classes.divider}>
+                      Welcome to Thamrin Brothers
+                    </p>
+                    <CardBody>
+                      <input type="hidden" name="partner" value="YAMAHA" />
+                      <CustomInput
+                        labelText="Email..."
+                        id="email"
+                        value={email}
+                        formControlProps={{
+                          fullWidth: true,
+                        }}
+                        inputProps={{
+                          type: "email",
+                          onChange: (event) => setEmail(event.target.value),
+                          endAdornment: (
+                            <InputAdornment position="end">
+                              <Email className={classes.inputIconsColor} />
+                            </InputAdornment>
+                          ),
+                        }}
+                      />
+                      <CustomInput
+                        labelText="Password"
+                        id="pass"
+                        value={pass}
+                        formControlProps={{
+                          fullWidth: true,
+                        }}
+                        inputProps={{
+                          onChange: (event) => setPass(event.target.value),
+                          type: "password",
+                          endAdornment: (
+                            <InputAdornment position="end">
+                              <Icon className={classes.inputIconsColor}>
+                                lock_outline
+                              </Icon>
+                            </InputAdornment>
+                          ),
+                          autoComplete: "off",
+                        }}
+                      />
+                    </CardBody>
+                    <CardFooter className={classes.cardFooter}>
+                      <Button type="submit" color="info" size="lg">
+                        Login
                       </Button>
-                    </div>
-                  </CardHeader>
-                  <p className={classes.divider}>Welcome to Thamrin Brothers</p>
-                  <CardBody>
-                    <CustomInput
-                      labelText="Email..."
-                      id="email"
-                      formControlProps={{
-                        fullWidth: true
-                      }}
-                      inputProps={{
-                        type: "email",
-                        endAdornment: (
-                          <InputAdornment position="end">
-                            <Email className={classes.inputIconsColor} />
-                          </InputAdornment>
-                        )
-                      }}
-                    />
-                    <CustomInput
-                      labelText="Password"
-                      id="pass"
-                      formControlProps={{
-                        fullWidth: true
-                      }}
-                      inputProps={{
-                        type: "password",
-                        endAdornment: (
-                          <InputAdornment position="end">
-                            <Icon className={classes.inputIconsColor}>
-                              lock_outline
-                            </Icon>
-                          </InputAdornment>
-                        ),
-                        autoComplete: "off"
-                      }}
-                    />
-                  </CardBody>
-                  <CardFooter className={classes.cardFooter}>
-                    <Button color="info" size="lg">
-                      Login
-                    </Button>
-                  </CardFooter>
-                </form>
-              </Card>
-            </GridItem>
-          </GridContainer>
+                    </CardFooter>
+                  </form>
+                </Card>
+              </GridItem>
+            </GridContainer>
+          </div>
+          <Footer whiteFont />
         </div>
-        <Footer whiteFont />
       </div>
-    </div>
+    </>
   );
 }

pages/yamaha/home.js

@@ -11,7 +11,6 @@ import Footer from "components/Footer/Footer.js";
 import GetbusinessPartners from "../../api/home/businessPartner.js";
 import Getservices from "../../api/home/service.js";
 import Getcarousels from "../../api/home/carousel.js";
-
 import DataSnackbarContent from "../../pages-sections/yamaha/snackbar.js";
 import DataCarousel from "../../pages-sections/yamaha/home/carousel.js";
 import DataService from "../../pages-sections/yamaha/home/service.js";
@@ -19,6 +18,7 @@ import DataBusinessPartner from "../../pages-sections/yamaha/home/business_partn
 import DataSosmed from "../../pages-sections/yamaha/home/sosmed.js";
 import CoreValue from "../../pages-sections/yamaha/home/core_value.js";
 import DataFeature from "../../pages-sections/yamaha/home/feature.js";
+import Cookies from "cookies";
 
 const useStyles = makeStyles(styles);
 const Home = function ({
@@ -35,7 +35,7 @@ const Home = function ({
   return (
     <div>
       <Header
-        rightLinks={<HeaderLinks/>}
+        rightLinks={<HeaderLinks username={props.user} />}
         fixed
         color="info"
         changeColorOnScroll={{
@@ -44,15 +44,21 @@ const Home = function ({
         }}
         {...rest}
       />
-      <Parallax image={require("assets/img/Promotion_2-1.jpg")}styles={{ marginTop: "50px" }}/>
+      <Parallax
+        image={require("assets/img/Promotion_2-1.jpg")}
+        styles={{ marginTop: "50px" }}
+      />
       <div className={classNames(classes.main, classes.mainRaised)}>
         <DataSnackbarContent />
         <CoreValue />
         <DataCarousel carousel={carousel} backend={backend} />
         <DataService service={service} backend={backend} />
         <DataFeature />
-        <DataBusinessPartner businessPartners={businessPartners} backend={backend} />
-        <DataSosmed/>
+        <DataBusinessPartner
+          businessPartners={businessPartners}
+          backend={backend}
+        />
+        <DataSosmed />
       </div>
       <Footer />
     </div>
@@ -65,23 +71,38 @@ export async function getServerSideProps(context) {
   var carousel = [];
   const backend = process.env.BACKEND_SERVER_URI;
 
+  var { req, resp } = context;
+  const cookies = new Cookies(req, resp);
+  var user = "";
+  var userObj = (await cookies.get("user"))
+    ? JSON.parse(await cookies.get("user"))
+    : null;
+  if (userObj) {
+    let sessionId = userObj["partners_login_states"].filter(function (i) {
+      return (
+        i.business_partner && i.business_partner.name.toUpperCase() == "SUZUKI"
+      );
+    });
+    if (sessionId.length != 0) user = userObj["username"];
+  }
+
   var res = await GetbusinessPartners.GetbusinessPartners();
   if (res["STATUS"] === 1) {
     businessPartners = res["DATA"]["businessPartners"];
   }
 
-  var res = await Getservices.GetservicesYamaha();
+  var res = await Getservices.Getservices();
   if (res["STATUS"] === 1) {
     service = res["DATA"]["services"];
   }
 
-  var res = await Getcarousels.GetCarouselsYamaha();
+  var res = await Getcarousels.GetCarousels();
   if (res["STATUS"] === 1) {
     carousel = res["DATA"]["carousels"];
   }
 
   return {
-    props: { businessPartners, service, carousel, backend }, // will be passed to the page component as props
+    props: { businessPartners, service, carousel, backend, user }, // will be passed to the page component as props
   };
 }
 

pages/yamaha/login.js

@@ -23,36 +23,83 @@ import styles from "assets/jss/nextjs-material-kit/pages/loginPage.js";
 
 import image from "assets/img/bgtbg.jpg";
 
+import Collapse from "@material-ui/core/Collapse";
+import Alert from "@material-ui/lab/Alert";
+import IconButton from "@material-ui/core/IconButton";
+import CloseIcon from "@material-ui/icons/Close";
+import { useRouter } from "next/router";
 const useStyles = makeStyles(styles);
 
 export default function LoginPage(props) {
   const [cardAnimaton, setCardAnimation] = React.useState("cardHidden");
-  setTimeout(function() {
+  const [email, setEmail] = React.useState("");
+  const [pass, setPass] = React.useState("");
+  const [open, setOpen] = React.useState(false);
+  const [error, setError] = React.useState("");
+  const router = useRouter();
+  setTimeout(function () {
     setCardAnimation("");
   }, 700);
   const classes = useStyles();
   const { ...rest } = props;
+
+  const submitHandler = async (event) => {
+    event.preventDefault();
+    const res = await fetch("../api/auth/login", {
+      body: JSON.stringify({
+        partner: "yamaha",
+        email: email,
+        pass: pass,
+      }),
+      headers: {
+        "Content-Type": "application/json",
+      },
+      method: "POST",
+    });
+    // console.log("res", res.S);
+    if (res.ok) {
+      router.push("/yamaha/home");
+    } else {
+      setError(await res.text());
+      setOpen(true);
+    }
+  };
+
   return (
     <div>
-      <Header
-        absolute
-        color="info"
-        rightLinks={<HeaderLinks />}
-        {...rest}
-      />
+      <Collapse className={classes.collapsible} in={open}>
+        <Alert
+          severity="error"
+          action={
+            <IconButton
+              aria-label="close"
+              color="inherit"
+              size="small"
+              onClick={() => {
+                setOpen(false);
+              }}
+            >
+              <CloseIcon fontSize="inherit" />
+            </IconButton>
+          }
+        >
+          {error}
+        </Alert>
+      </Collapse>
+      <Header absolute color="info" rightLinks={<HeaderLinks />} {...rest} />
       <div
         className={classes.pageHeader}
         style={{
           backgroundImage: "url(" + image + ")",
           backgroundSize: "cover",
-          backgroundPosition: "top center"
+          backgroundPosition: "top center",
         }}
       >
         <div className={classes.container}>
           <GridContainer justify="center">
             <GridItem xs={12} sm={6} md={4}>
               <Card className={classes[cardAnimaton]}>
-                <form className={classes.form}>
+                <form onSubmit={submitHandler} className={classes.form}>
                   <CardHeader color="info" className={classes.cardHeader}>
                     <h4>Login</h4>
                     <div className={classes.socialLine}>
@@ -61,7 +108,7 @@ export default function LoginPage(props) {
                         href="#pablo"
                         target="_blank"
                         color="transparent"
-                        onClick={e => e.preventDefault()}
+                        onClick={(e) => e.preventDefault()}
                       >
                         <i className={"fab fa-twitter"} />
                       </Button>
@@ -70,7 +117,7 @@ export default function LoginPage(props) {
                         href="#pablo"
                         target="_blank"
                         color="transparent"
-                        onClick={e => e.preventDefault()}
+                        onClick={(e) => e.preventDefault()}
                       >
                         <i className={"fab fa-facebook"} />
                       </Button>
@@ -79,7 +126,7 @@ export default function LoginPage(props) {
                         href="#pablo"
                         target="_blank"
                         color="transparent"
-                        onClick={e => e.preventDefault()}
+                        onClick={(e) => e.preventDefault()}
                       >
                         <i className={"fab fa-google-plus-g"} />
                       </Button>
@@ -90,25 +137,29 @@ export default function LoginPage(props) {
                     <CustomInput
                       labelText="Email..."
                       id="email"
+                      value={email}
                       formControlProps={{
-                        fullWidth: true
+                        fullWidth: true,
                       }}
                       inputProps={{
                         type: "email",
+                        onChange: (event) => setEmail(event.target.value),
                         endAdornment: (
                           <InputAdornment position="end">
                             <Email className={classes.inputIconsColor} />
                           </InputAdornment>
-                        )
+                        ),
                       }}
                     />
                     <CustomInput
                       labelText="Password"
                       id="pass"
+                      value={pass}
                       formControlProps={{
-                        fullWidth: true
+                        fullWidth: true,
                       }}
                       inputProps={{
+                        onChange: (event) => setPass(event.target.value),
                         type: "password",
                         endAdornment: (
                           <InputAdornment position="end">
@@ -117,12 +168,12 @@ export default function LoginPage(props) {
                             </Icon>
                           </InputAdornment>
                         ),
-                        autoComplete: "off"
+                        autoComplete: "off",
                       }}
                     />
                   </CardBody>
                   <CardFooter className={classes.cardFooter}>
-                    <Button color="info" size="lg">
+                    <Button type="submit" color="info" size="lg">
                       Login
                     </Button>
                   </CardFooter>

yarn.lock

@@ -1098,6 +1098,17 @@
   dependencies:
     "@babel/runtime" "^7.4.4"
 
+"@material-ui/lab@^4.0.0-alpha.57":
+  version "4.0.0-alpha.57"
+  resolved "https://registry.yarnpkg.com/@material-ui/lab/-/lab-4.0.0-alpha.57.tgz#e8961bcf6449e8a8dabe84f2700daacfcafbf83a"
+  integrity sha512-qo/IuIQOmEKtzmRD2E4Aa6DB4A87kmY6h0uYhjUmrrgmEAgbbw9etXpWPVXuRK6AGIQCjFzV6WO2i21m1R4FCw==
+  dependencies:
+    "@babel/runtime" "^7.4.4"
+    "@material-ui/utils" "^4.11.2"
+    clsx "^1.0.4"
+    prop-types "^15.7.2"
+    react-is "^16.8.0 || ^17.0.0"
+
 "@material-ui/styles@^4.11.3":
   version "4.11.3"
   resolved "https://registry.yarnpkg.com/@material-ui/styles/-/styles-4.11.3.tgz#1b8d97775a4a643b53478c895e3f2a464e8916f2"
@@ -2374,6 +2385,14 @@ convert-source-map@^0.3.3:
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-0.3.5.tgz#f1d802950af7dd2631a1febe0596550c86ab3190"
   integrity sha1-8dgClQr33SYxof6+BZZVDIarMZA=
 
+cookies@^0.8.0:
+  version "0.8.0"
+  resolved "https://registry.yarnpkg.com/cookies/-/cookies-0.8.0.tgz#1293ce4b391740a8406e3c9870e828c4b54f3f90"
+  integrity sha512-8aPsApQfebXnuI+537McwYsDtjVxGm8gTIzQI3FDW6t5t/DAhERxtnbEPN/8RX+uZthoz4eCOgloXaE5cYyNow==
+  dependencies:
+    depd "~2.0.0"
+    keygrip "~1.1.0"
+
 copy-anything@^2.0.1:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/copy-anything/-/copy-anything-2.0.3.tgz#842407ba02466b0df844819bbe3baebbe5d45d87"
@@ -2852,6 +2871,11 @@ delegates@^1.0.0:
   resolved "https://registry.yarnpkg.com/delegates/-/delegates-1.0.0.tgz#84c6e159b81904fdca59a0ef44cd870d31250f9a"
   integrity sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=
 
+depd@~2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/depd/-/depd-2.0.0.tgz#b696163cc757560d09cf22cc8fad1571b79e76df"
+  integrity sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==
+
 des.js@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/des.js/-/des.js-1.0.1.tgz#5382142e1bdc53f85d86d53e5f4aa7deb91e0843"
@@ -4521,6 +4545,13 @@ keycode@^2.1.7:
   resolved "https://registry.yarnpkg.com/keycode/-/keycode-2.2.0.tgz#3d0af56dc7b8b8e5cba8d0a97f107204eec22b04"
   integrity sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ=
 
+keygrip@~1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/keygrip/-/keygrip-1.1.0.tgz#871b1681d5e159c62a445b0c74b615e0917e7226"
+  integrity sha512-iYSchDJ+liQ8iwbSI2QqsQOvqv58eJCEanyJPJi+Khyu8smkcKSFUCbPwzFcL7YVtZ6eONjqRX/38caJ7QjRAQ==
+  dependencies:
+    tsscmp "1.0.6"
+
 kind-of@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-2.0.1.tgz#018ec7a4ce7e3a86cb9141be519d24c8faa981b5"
@@ -7750,6 +7781,11 @@ tslib@^1.10.0, tslib@^1.14.1, tslib@^1.9.0, tslib@^1.9.3:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
+tsscmp@1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/tsscmp/-/tsscmp-1.0.6.tgz#85b99583ac3589ec4bfef825b5000aa911d605eb"
+  integrity sha512-LxhtAkPDTkVCMQjt2h6eBVY28KCjikZqZfMcC15YBeNjkgUpdCfBu5HoiOTDu86v6smE8yOjyEktJ8hlbANHQA==
+
 tty-browserify@0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"