tbg-ecomm-nextjs/pages/sales/sales_detail.js

import React from "react";
import classNames from "classnames";
import { makeStyles } from "@material-ui/core/styles";

import HeaderMercy from "components/Header/HeaderMercy.js";
import Header from "components/Header/Header.js";
import Footer from "components/Footer/FooterSosmed.js";
import Parallax from "components/Parallax/Parallax.js";
import styles from "assets/jss/nextjs-material-kit/pages/components.js";

import GetSales from "api/sales/sales-mercy.js";
import DataSnackbarContent from "pages-sections/yamaha/snackbar.js";
import DataSales from "pages-sections/sales/sales_detail.js";
import Cookies from "cookies";
import stylecss from "pages/home.css";

const dashboardRoutes = [];
const useStyles = makeStyles(styles);

const detailSales = function ({ user, backend, sales, ...props }) {
    const classes = useStyles();
    const { ...rest } = props;
    <DataSales sales={props.sales} />
    return (
        <div>
            <Header color="white" routes={dashboardRoutes} leftLinks={<HeaderMercy />} fixed />
            <Parallax image={require("assets/img/merci.png")} width="200px" />
            <div className={classNames(classes.main, classes.mainRaised)}>
                <DataSales sales={sales} backend={backend} />
            </div>
            <br /><br />
            <Footer />
        </div>
    );
}

export default detailSales;

export async function getServerSideProps(context) {
    var { query } = context;
    var sales = [];
    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() == "YAMAHA"
            );
        });
        if (sessionId.length != 0) user = userObj["username"];
    }
    else if (userObj) {
        let sessionId = userObj["partners_login_states"].filter(function (i) {
            return (
                i.business_partner && i.business_partner.name.toUpperCase() == "YAMAHA"
            );
        });
        if (sessionId.length != 0) user = userObj["username"];
    }

    var res = await GetSales.GetDetailSalesMerci(query.s || 0);
    if (res["STATUS"] === 1) {
        sales = res["DATA"]["salesMercies"];
    }

    console.log("detail :", sales);

    return {
        props: { user, sales, backend }, // will be passed to the page component as props
    };
}