From f1fbe8e3ee371e3a60bbeb55ee36a4bb0f5cc925 Mon Sep 17 00:00:00 2001
From: Yoan VALLET <ext.sopra.yvallet@grandlyon.com>
Date: Thu, 22 Jul 2021 16:37:27 +0200
Subject: [PATCH] feat: init Layout and main component without style

---
 src/App.tsx                              |   9 ++++---
 src/assets/icons/logo.png                | Bin 0 -> 7500 bytes
 src/components/Editing/Editing.tsx       |   7 ++++++
 src/components/Layout/Layout.tsx         |  22 +++++++++++++++++
 src/components/Layout/layout.module.scss |  14 +++++++++++
 src/components/Menu/Menu.tsx             |  22 +++++++++++++++++
 src/components/Navbar/Navbar.tsx         |  29 +++++++++++++++++++++++
 src/components/Routes/Routes.tsx         |  10 ++++----
 src/components/Settings/Settings.tsx     |   7 ++++++
 src/components/dummy/Dummy.tsx           |  15 ------------
 src/components/dummy/Dummy2.tsx          |  15 ------------
 src/components/dummy/dummy.module.scss   |   6 -----
 src/components/dummy/dummy2.module.scss  |   6 -----
 src/constants/routes.json                |  10 ++++++++
 src/styles/index.scss                    |   6 +++++
 15 files changed, 128 insertions(+), 50 deletions(-)
 create mode 100644 src/assets/icons/logo.png
 create mode 100644 src/components/Editing/Editing.tsx
 create mode 100644 src/components/Layout/Layout.tsx
 create mode 100644 src/components/Layout/layout.module.scss
 create mode 100644 src/components/Menu/Menu.tsx
 create mode 100644 src/components/Navbar/Navbar.tsx
 create mode 100644 src/components/Settings/Settings.tsx
 delete mode 100644 src/components/dummy/Dummy.tsx
 delete mode 100644 src/components/dummy/Dummy2.tsx
 delete mode 100644 src/components/dummy/dummy.module.scss
 delete mode 100644 src/components/dummy/dummy2.module.scss
 create mode 100644 src/constants/routes.json

diff --git a/src/App.tsx b/src/App.tsx
index e0306a89..ed7869cc 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,12 +1,15 @@
 import React from 'react'
 import { BrowserRouter } from 'react-router-dom'
+import Layout from './components/Layout/Layout'
 import Routes from './components/Routes/Routes'
 
 function App() {
   return (
-    <BrowserRouter>
-      <Routes />
-    </BrowserRouter>
+    <Layout>
+      <BrowserRouter>
+        <Routes />
+      </BrowserRouter>
+    </Layout>
   )
 }
 
diff --git a/src/assets/icons/logo.png b/src/assets/icons/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..6e9f08491e80c9b5b19817c83ab15140f032525a
GIT binary patch
literal 7500
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
WSUH!awdURc0000<MNUMnLSTa5-vFBc

literal 0
HcmV?d00001

diff --git a/src/components/Editing/Editing.tsx b/src/components/Editing/Editing.tsx
new file mode 100644
index 00000000..866a2515
--- /dev/null
+++ b/src/components/Editing/Editing.tsx
@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Editing: React.FC = () => {
+  return <div>Coming soon !</div>
+}
+
+export default Editing
diff --git a/src/components/Layout/Layout.tsx b/src/components/Layout/Layout.tsx
new file mode 100644
index 00000000..72e3772c
--- /dev/null
+++ b/src/components/Layout/Layout.tsx
@@ -0,0 +1,22 @@
+import React from 'react'
+import styles from './layout.module.scss'
+import Menu from '../Menu/Menu'
+import Navbar from '../Navbar/Navbar'
+
+interface LayoutProps {
+  children: React.ReactNode
+}
+
+const Layout: React.FC<LayoutProps> = ({ children }: LayoutProps) => {
+  return (
+    <div className={styles.root}>
+      <Navbar />
+      <div className={styles.wrapper}>
+        <Menu />
+        <main>{children}</main>
+      </div>
+    </div>
+  )
+}
+
+export default Layout
diff --git a/src/components/Layout/layout.module.scss b/src/components/Layout/layout.module.scss
new file mode 100644
index 00000000..3f0e2345
--- /dev/null
+++ b/src/components/Layout/layout.module.scss
@@ -0,0 +1,14 @@
+.root {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+.wrapper {
+  display: flex;
+  flex-direction: row;
+  flex: 1;
+  main {
+    flex: 1;
+  }
+}
diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
new file mode 100644
index 00000000..1013998c
--- /dev/null
+++ b/src/components/Menu/Menu.tsx
@@ -0,0 +1,22 @@
+import React from 'react'
+import routes from '../../constants/routes.json'
+
+const Menu: React.FC = () => {
+  // TODO class is-active if link is activated
+
+  return (
+    <aside className="menu">
+      <ul className="menu-list">
+        {routes.map((route: any, index: number) => {
+          return (
+            <li key={index}>
+              <a href={route.path}>{route.label}</a>
+            </li>
+          )
+        })}
+      </ul>
+    </aside>
+  )
+}
+
+export default Menu
diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx
new file mode 100644
index 00000000..d57154af
--- /dev/null
+++ b/src/components/Navbar/Navbar.tsx
@@ -0,0 +1,29 @@
+import React from 'react'
+import logo from '../../assets/icons/logo.png'
+
+const Navbar: React.FC = () => {
+  return (
+    <nav className="navbar" role="navigation" aria-label="main navigation">
+      <div className="navbar-brand">
+        <img src={logo} alt="Ecolyo logo" />
+        <div className="navbar-menu">
+          <div className="navbar-start"></div>
+          <div className="navbar-end">
+            <div className="navbar-item">
+              <div className="buttons">
+                <a href="/" className="button is-primary">
+                  <strong>Sign up</strong>
+                </a>
+                <a href="/" className="button is-light">
+                  Log in
+                </a>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </nav>
+  )
+}
+
+export default Navbar
diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx
index 21ba5f88..99bb4c66 100644
--- a/src/components/Routes/Routes.tsx
+++ b/src/components/Routes/Routes.tsx
@@ -1,14 +1,14 @@
 import React from 'react'
 import { Redirect, Route, Switch } from 'react-router-dom'
-import Dummy from '../dummy/Dummy'
-import Dummy2 from '../dummy/Dummy2'
+import Editing from '../Editing/Editing'
+import Settings from '../Settings/Settings'
 
 const Routes: React.FC = () => {
   return (
     <Switch>
-      <Route path="/dummy" component={Dummy} />
-      <Route path="/dummy2" component={Dummy2} />
-      <Redirect path="*" to="/dummy" />
+      <Route path="/editing" component={Editing} />
+      <Route path="/settings" component={Settings} />
+      <Redirect path="*" to="/editing" />
     </Switch>
   )
 }
diff --git a/src/components/Settings/Settings.tsx b/src/components/Settings/Settings.tsx
new file mode 100644
index 00000000..30cfca08
--- /dev/null
+++ b/src/components/Settings/Settings.tsx
@@ -0,0 +1,7 @@
+import React from 'react'
+
+const Settings: React.FC = () => {
+  return <div>A venir</div>
+}
+
+export default Settings
diff --git a/src/components/dummy/Dummy.tsx b/src/components/dummy/Dummy.tsx
deleted file mode 100644
index e5a7480c..00000000
--- a/src/components/dummy/Dummy.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import React from 'react'
-import styles from './dummy.module.scss'
-
-const Dummy: React.FC = () => {
-  return (
-    <div className={styles.root}>
-      <section>
-        <article>It is a dummy article</article>
-        <article>It is a second dummy article</article>
-      </section>
-    </div>
-  )
-}
-
-export default Dummy
diff --git a/src/components/dummy/Dummy2.tsx b/src/components/dummy/Dummy2.tsx
deleted file mode 100644
index c8df1362..00000000
--- a/src/components/dummy/Dummy2.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import React from 'react'
-import styles from './dummy2.module.scss'
-
-const Dummy2: React.FC = () => {
-  return (
-    <div className={styles.root}>
-      <section>
-        <article>It is a dummy article</article>
-        <article>It is a second dummy article</article>
-      </section>
-    </div>
-  )
-}
-
-export default Dummy2
diff --git a/src/components/dummy/dummy.module.scss b/src/components/dummy/dummy.module.scss
deleted file mode 100644
index fa413ce0..00000000
--- a/src/components/dummy/dummy.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-.root {
-  display: flex;
-  section {
-    color: aqua;
-  }
-}
diff --git a/src/components/dummy/dummy2.module.scss b/src/components/dummy/dummy2.module.scss
deleted file mode 100644
index f718c348..00000000
--- a/src/components/dummy/dummy2.module.scss
+++ /dev/null
@@ -1,6 +0,0 @@
-.root {
-  display: flex;
-  section {
-    color: yellow;
-  }
-}
diff --git a/src/constants/routes.json b/src/constants/routes.json
new file mode 100644
index 00000000..21414496
--- /dev/null
+++ b/src/constants/routes.json
@@ -0,0 +1,10 @@
+[
+  {
+    "label": "Edition",
+    "path": "/editing"
+  },
+  {
+    "label": "Paramètres",
+    "path": "/settings"
+  }
+]
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 8740006a..69bb90e0 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -4,3 +4,9 @@
 
 // To customize bulma variables, we set them before importing bulma
 @import 'bulma/bulma.sass';
+
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
-- 
GitLab