added get started view

AceTheCreator · AceTheCreator · commit 039218efebcb · 2021-06-02T15:24:44.000+01:00
diff --git a/src/components/NavBar/navbar.js b/src/components/NavBar/navbar.js
@@ -16,7 +16,7 @@ import logo from "../../static/logo.svg";
 const links = [
   {
     title: "Getting Started",
-    link: "/getting-started",
+    link: "/",
   },
   {
     title: "Demo",
@@ -36,14 +36,14 @@ export default function NavBar() {
   const history = useHistory();
   const { pathname } = history.location;
   const [openDrawer, setOpenDrawer] = useState(false);
-  const [active, setActive] = useState("/getting-started");
+  const [active, setActive] = useState("/");
 
   const handleDrawer = () => {
     setOpenDrawer(() => !openDrawer);
   };
   useEffect(() => {
-    if (pathname.includes("getting-started" || pathname === "/")) {
-      setActive("/getting-started");
+    if (pathname === "/") {
+      setActive("/");
     }
     if (pathname.includes("demo")) {
       setActive("/demo");
diff --git a/src/pages/home/home.js b/src/pages/home/home.js
@@ -0,0 +1,36 @@
+import React, { useState, useReducer } from "react";
+import Cell from "../../Cell";
+import { reducer } from "../../reducer";
+import { downLoad_notebook, load_notebook } from "../../utils";
+import Header from "../../components/header/header";
+
+const defaultState = {
+  cells: [{ id: "cell_1", input: "", output: "", type: "code" }],
+};
+
+export default function Home() {
+  const [state, dispatch] = useReducer(reducer, defaultState);
+  const [currentCell, setCurrentCell] = useState(null);
+  const [activeCell, setActiveCell] = useState(1);
+  const load = () => load_notebook(dispatch);
+  const download = (name) => downLoad_notebook(state, name);
+  return (
+    <div>
+      <Header download={download} load={load} />
+      {state.cells.map((cell, index) => {
+        return (
+          <Cell
+            key={cell.id}
+            cell={cell}
+            dispatch={dispatch}
+            currentCell={currentCell}
+            setCurrentCell={setCurrentCell}
+            cellId={index + 1}
+            activeCell={activeCell}
+            setActiveCell={setActiveCell}
+          />
+        );
+      })}
+    </div>
+  );
+}
diff --git a/src/routes/routes.js b/src/routes/routes.js
@@ -3,11 +3,13 @@ import { Route, Switch } from "react-router-dom";
 
 const Demo = lazy(() => import("../pages/demo/demo"));
 const About = lazy(() => import("../pages/about/about"));
+const Home = lazy(() => import("../pages/home/home"));
 
 export default function Routes() {
   return (
     <Suspense fallback={<div>loading</div>}>
       <Switch>
+        <Route exact component={Home} path="/" />
         <Route exact component={Demo} path="/demo" />
         <Route exact component={About} path="/about" />
       </Switch>
