tbg-ecomm-nextjs/pages-sections/Components-Sections/SectionChart.js

import React from "react";
// nodejs library that concatenates classes
import classNames from "classnames";
// @material-ui/core components
import { makeStyles } from "@material-ui/core/styles";
// @material-ui/icons
import Dashboard from "@material-ui/icons/Dashboard";
import LocalGroceryStoreIcon from "@material-ui/icons/LocalGroceryStore";

import GridContainer from "components/Grid/GridContainer.js";
import GridItem from "components/Grid/GridItem.js";
import NavPills from "components/NavPills/NavPills.js";
import Card from "components/Card/Card.js";
import CardBody from "components/Card/CardBody.js";
import CardHeader from "components/Card/CardHeader.js";
import CardFooter from "components/Card/CardFooter.js";

import styles from "assets/jss/nextjs-material-kit/pages/profilePage.js";

const useStyles = makeStyles(styles);

export default function ProfilePage(props) {
  const classes = useStyles();
  const { ...rest } = props;
  const imageClasses = classNames(
    classes.imgRaised,
    classes.imgRoundedCircle,
    classes.imgFluid
  );
  const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
  return (
    <Card className={classes.textCenter}>
      <div align="center">
        <CardHeader color="info">Home</CardHeader>
      </div>
      <CardBody>
        <div align="center">
          <h2>Dashboard</h2>
        </div>
      </CardBody>
      <CardFooter className={classes.textMuted} textAlign="center">
        © 2020 , All Right Reserved by @Thamrin Brother Company
      </CardFooter>
    </Card>
  );
}