text: import React from "react";
  // react plugin for creating charts
  import ChartistGraph from "react-chartist";
  // @material-ui/core
  import { makeStyles } from "@material-ui/core/styles";
  import Icon from "@material-ui/core/Icon";
  // @material-ui/icons
  import Store from "@material-ui/icons/Store";
  import Warning from "@material-ui/icons/Warning";
  import DateRange from "@material-ui/icons/DateRange";
  import LocalOffer from "@material-ui/icons/LocalOffer";
  import Update from "@material-ui/icons/Update";
  import ArrowUpward from "@material-ui/icons/ArrowUpward";
  import AccessTime from "@material-ui/icons/AccessTime";
  import Accessibility from "@material-ui/icons/Accessibility";
  import BugReport from "@material-ui/icons/BugReport";
  import Code from "@material-ui/icons/Code";
  import Cloud from "@material-ui/icons/Cloud";
  // core components
  import GridItem from "components/Grid/GridItem.js";
  import GridContainer from "components/Grid/GridContainer.js";
  import Table from "components/Table/Table.js";
  import Tasks from "components/Tasks/Tasks.js";
  import CustomTabs from "components/CustomTabs/CustomTabs.js";
  import Danger from "components/Typography/Danger.js";
  import Card from "components/Card/Card.js";
  import CardHeader from "components/Card/CardHeader.js";
  import CardIcon from "components/Card/CardIcon.js";
  import CardBody from "components/Card/CardBody.js";
  import CardFooter from "components/Card/CardFooter.js";
  
  import { bugs, website, server } from "variables/general.js";
  
  import axios from 'axios'
  
  
  import {
    dailySalesChart,
    emailsSubscriptionChart,
    completedTasksChart
  } from "variables/charts.js";
  
  import styles from "assets/jss/material-dashboard-react/views/dashboardStyle.js";
  
  import TabsForDashboard from "views/Dashboard/TabsForDashboard.js"
  
  const useStyles = makeStyles(styles);
  
  class DashboardRender extends React.Component {
      constructor(props){
        super(props)
        this.state = {
          websites: [],
          ids: []
        }
      }
    
      componentDidMount() {
        axios.get("/api/websites").then((res) => {
          if (res.data.numbers > 0) {
            let _websites = []
            let _ids = []
            res.data.websites.map((item, index) => {
              _websites[index] = [item.Url, item.Username,item.Password,item.Note,""]
              _ids[index] = item.ID
            })
      
            this.setState({websites: _websites, ids: _ids})
          }
          
        })
      }
    
      render() {
          if (this.state.websites.length > 0) {
              return <TabsForDashboard data={this.state.websites}/>
          } else {
              return <div>Not Found</div>
          }
      }
    }
  
  export default function Dashboard() {
    const classes = useStyles();
    return (
        <GridContainer>
          <DashboardRender width="100%" />
        </GridContainer>
    );
  }
  