import * as React from 'react';
import {Tree} from 'rsuite';
import 'rsuite/Tree/styles/index.css';

export default function Test() {
  const MUI_X_PRODUCTS = [
    {
      value: 'grid',
      label: 'Data Grid',
      children: [
        { value: 'grid-community', label: '@mui/x-data-grid' },
        { value: 'grid-pro', label: '@mui/x-data-grid-pro' },
        { value: 'grid-premium', label: '@mui/x-data-grid-premium' },
      ],
    },
    {
      value: 'pickers',
      label: 'Date and Time Pickers',
      children: [
        { value: 'pickers-community', label: '@mui/x-date-pickers' },
        { value: 'pickers-pro', label: '@mui/x-date-pickers-pro' },
      ],
    },
    {
      value: 'charts',
      label: 'Charts',
      children: [
        { value: 'charts-community', label: '@mui/x-charts' },
        { value: 'charts-pro', label: '@mui/charts-pro' },
      ],
    },
    {
      value: 'tree-view',
      label: 'Tree View',
      children: [
        { value: 'tree-view-community', label: '@mui/x-tree-view' },
        { value: 'tree-view-pro', label: '@mui/x-tree-view-pro' },
      ],
    },
  ];
   
    return (
      <Tree data ={ MUI_X_PRODUCTS} height="20vh">

      </Tree>



    );
}