[example][m] - changed styling and added octokit

examples/simple-example/pages/@org/[org]/[project]/[...slug].tsx

@@ -0,0 +1,44 @@
+import DRD from "../../../components/drd/DRD";
+import MDLayout from "../../../components/MDLayout";
+import parse from "../../../lib/markdown";
+import Project from "../../../lib/project";
+import { NextSeo } from "next-seo";
+
+export default function ProjectFile({ mdxSource, frontMatter, project }) {
+  return (
+    <>
+      <NextSeo title={`DataHub - @${project.owner}/${project.name}`} />
+      <MDLayout layout={frontMatter.layout} {...frontMatter}>
+        <DRD source={mdxSource} />
+      </MDLayout>
+    </>
+  );
+}
+
+export async function getServerSideProps({ params }) {
+  const { org: orgName, project: projectName, slug } = params;
+
+  const project = await Project.getFromGitHub(orgName, projectName);
+
+  let content = null;
+
+  try {
+    content = await project.getFileContent(slug.join("/") + ".md");
+  } catch (e) {
+    return {
+      notFound: true,
+    };
+  }
+
+  const { mdxSource, frontMatter } = await parse(content, ".mdx");
+
+  return {
+    props: {
+      mdxSource,
+      frontMatter,
+      project: project.serialize(),
+      slug: slug || [],
+    },
+  };
+}
+

examples/simple-example/pages/@org/[org]/[project]/index.tsx

@@ -1,9 +1,9 @@
 import Head from 'next/head';
 import { useRouter } from 'next/router';
 
-import DRD from '../../../components/drd/DRD';
-import parse from '../../../lib/markdown';
-import Project from '../../../lib/project';
+import DRD from '../../../../components/drd/DRD';
+import parse from '../../../../lib/markdown';
+import Project from '../../../../lib/project';
 import { NextSeo } from 'next-seo';
 import MDLayout from 'examples/simple-example/components/MDLayout';
 import { promises as fs } from 'fs';