text: import React from "react";
  // @material-ui/core components
  import { makeStyles } from "@material-ui/core/styles";
  import AppsIcon from '@material-ui/icons/Apps';
  import FastfoodOutlinedIcon from '@material-ui/icons/FastfoodOutlined';
  import LocalBarOutlinedIcon from '@material-ui/icons/LocalBarOutlined';
  // core components
  import GridItem from "components/Grid/GridItem.js";
  import GridContainer from "components/Grid/GridContainer.js";
  import Table from "components/Table/Table.js";
  import Card from "components/Card/Card.js";
  import CardHeader from "components/Card/CardHeader.js";
  import CardBody from "components/Card/CardBody.js";
  import Records from "components/Records/Records.js";
  import CustomTabs from "components/CustomTabs/CustomTabs.js";
  import { bugs, website, server } from "variables/general.js";
  
  const styles = {
    cardCategoryWhite: {
      "&,& a,& a:hover,& a:focus": {
        color: "rgba(255,255,255,.62)",
        margin: "0",
        fontSize: "14px",
        marginTop: "0",
        marginBottom: "0"
      },
      "& a,& a:hover,& a:focus": {
        color: "#FFFFFF"
      }
    },
    cardTitleWhite: {
      color: "#FFFFFF",
      marginTop: "0px",
      minHeight: "auto",
      fontWeight: "300",
      fontFamily: "'Roboto', 'Helvetica', 'Arial', sans-serif",
      marginBottom: "3px",
      textDecoration: "none",
      "& small": {
        color: "#777",
        fontSize: "65%",
        fontWeight: "400",
        lineHeight: "1"
      }
    }
  };
  
  const useStyles = makeStyles(styles);
  
  export default function Cashbook() {
    const classes = useStyles();
    return (
      <GridContainer>
          <GridItem xs={12} sm={12} md={12}>
            <CustomTabs
              title="Cash Book"
              headerColor="primary"
              tabs={[
                {
                  tabName: "All",
                  tabIcon: AppsIcon,
                  tabContent: (
                    <Records
                      checkedIndexes={[0, 3]}
                      recordsIndexes={[0, 1, 2, 3]}
                      records={bugs}
                    />
                  )
                },
                {
                  tabName: "Foods",
                  tabIcon: FastfoodOutlinedIcon,
                  tabContent: (
                    <Records
                      checkedIndexes={[0]}
                      recordsIndexes={[0, 1]}
                      records={website}
                    />
                  )
                },
                {
                  tabName: "Drinks",
                  tabIcon: LocalBarOutlinedIcon,
                  tabContent: (
                    <Records
                      checkedIndexes={[1]}
                      recordsIndexes={[0, 1, 2]}
                      records={server}
                    />
                  )
                }
              ]}
            />
          </GridItem>
        </GridContainer>
    );
  }
  