Replace Folder Tree with MUI implementation.

pages/index.js

@@ -1,16 +1,13 @@
-import Head from "next/head";
 import Layout, {siteTitle} from "../components/layout";
-import {getSinglePost, getGraphData, getDirectoryData} from "../lib/post";
+import {getSinglePost, getGraphData, getDirectoryData, convertObject} from "../lib/post";
+import FolderTree from "../components/FolderTree";
 
-import dynamic from 'next/dynamic'
+export default function Home({content, graphdata, filenames, tree, ...props}) {
-const BasicTree = dynamic(() => import('../components/FileNavBar'));
-
-export default function Home({content, graphdata, filenames, directoryTree, ...props}) {
 
     return (
         <Layout home>
             <section>
-                {/*<BasicTree directoryTree/>*/}
+                <FolderTree tree={tree}/>
                 <div dangerouslySetInnerHTML={{__html: content.data}}/>
             </section>
         </Layout>
@@ -19,24 +16,14 @@ export default function Home({content, graphdata, filenames, directoryTree, ...p
 }
 
 export function getStaticProps() {
-
+    const tree = convertObject(getDirectoryData());
-    console.log("getStaticProps")
-
-    // const abc =
-    const convertedData = {name: "Test", children:[
-            {name: "Test", children:[
-                    {name: "Test", children:[
-
-                        ]}
-                ]}
-        ]}
     const contentData = getSinglePost("index");
     const graphdata = getGraphData();
     return {
         props: {
             content: contentData,
             graphdata: graphdata,
-            directoryTree: convertedData,
+            tree: tree
         },
     };
 }