- designing the dashboard

- resume preview
- create resume modal

src/pages/404.js

@@ -1,7 +1,7 @@
 import { navigate } from "gatsby";
 import { useEffect } from "react";
 
-const NotFoundPage = () => {
+const NotFound = () => {
   useEffect(() => {
     navigate("/");
   }, []);
@@ -9,4 +9,4 @@ const NotFoundPage = () => {
   return null;
 };
 
-export default NotFoundPage;
+export default NotFound;

src/pages/app.js

@@ -0,0 +1,17 @@
+import React from "react";
+import { Router, Redirect } from "@reach/router";
+import Wrapper from "../components/shared/Wrapper";
+import Dashboard from "./app/dashboard";
+import PrivateRoute from "../components/router/PrivateRoute";
+import NotFound from "./404";
+
+const App = () => (
+  <Wrapper>
+    <Router>
+      <Redirect noThrow from="/app" to="/app/dashboard" exact />
+      <PrivateRoute path="/app/dashboard" component={Dashboard} />
+      <NotFound default />
+    </Router>
+  </Wrapper>
+);
+export default App;

src/pages/app/dashboard.js

@@ -0,0 +1,25 @@
+import React from "react";
+import Wrapper from "../../components/shared/Wrapper";
+import CreateResume from "../../components/dashboard/CreateResume";
+import ResumePreview from "../../components/dashboard/ResumePreview";
+import TopNavbar from "../../components/dashboard/TopNavbar";
+
+const Dashboard = () => {
+  return (
+    <Wrapper>
+      <TopNavbar />
+
+      <div className="container mt-12">
+        <div className="grid grid-cols-6 gap-8">
+          <CreateResume />
+          <ResumePreview
+            title="Full Stack Developer"
+            subtitle="Last updated 6 days ago"
+          />
+        </div>
+      </div>
+    </Wrapper>
+  );
+};
+
+export default Dashboard;