tbg-company-ecomm-web/pages/yamaha/Product/Sparepart.js

import React from 'react';
import Navbar from "@/components/_App/NavbarYamaha";
import Footer from "@/components/_App/FooterYamaha";
import PageBanner from '@/components/Common/PageBanner';
import SparepartCard from '@/components/Yamaha/Product/Sparepart';

import GetSparepart from "api/sparepart/sparepart.js";

import Cookies from "cookies";

const Shop = function ({ ygp, yamalube, helmet, apparel, accessories, backend, ...props }) {
    return (
        <>
            <Navbar />

            <PageBanner pageTitle="Sparepart" />

            <SparepartCard
                ygp={ygp}
                yamalube={yamalube}
                helmet={helmet}
                apparel={apparel}
                accessories={accessories}
                backend={backend}
            />

            <Footer />
        </>
    )
}

export default Shop;

export async function getServerSideProps(context) {
    var ygp = [];
    var yamalube = [];
    var helmet = [];
    var apparel = [];
    var accessories = [];

    const backend = process.env.BACKEND_SERVER_URI;

    var res = await GetSparepart.GetSparepartYGP();
    if (res["STATUS"] === 1) {
        ygp = res["DATA"]["ygParts"];
    }

    var res = await GetSparepart.GetSparepartYamalube();
    if (res["STATUS"] === 1) {
        yamalube = res["DATA"]["yamalubes"];
    }

    var res = await GetSparepart.GetHelmet();
    if (res["STATUS"] === 1) {
        helmet = res["DATA"]["helmets"];
    }

    var res = await GetSparepart.GetApparel();
    if (res["STATUS"] === 1) {
        apparel = res["DATA"]["apparels"];
    }

    var res = await GetSparepart.GetAcc();
    if (res["STATUS"] === 1) {
        accessories = res["DATA"]["accessories"];
    }

    return {
        props: {
            ygp,
            yamalube,
            helmet,
            apparel,
            accessories,
            backend,
        }, // will be passed to the page component as props
    };
}