From 5b480258322682fdc4fa987770df9e719315f167 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Tue, 2 Jun 2020 16:39:00 +0200
Subject: editing graph meta works

---
 cli/app/sql/models/graph.py                    |  2 +-
 cli/app/sql/models/page.py                     |  2 +-
 frontend/common/app.css                        |  5 ++++-
 frontend/views/index/containers/graph.edit.js  |  2 +-
 frontend/views/index/containers/graph.index.js | 19 ++++++++++++++++---
 frontend/views/index/graph.reducer.js          |  2 +-
 frontend/views/index/index.container.js        |  2 ++
 frontend/views/index/index.css                 | 24 ++++++++++++++++++++++--
 8 files changed, 48 insertions(+), 10 deletions(-)

diff --git a/cli/app/sql/models/graph.py b/cli/app/sql/models/graph.py
index 0d3fdab..129ce6e 100644
--- a/cli/app/sql/models/graph.py
+++ b/cli/app/sql/models/graph.py
@@ -23,7 +23,7 @@ class Graph(Base):
   created_at = Column(UtcDateTime(), default=utcnow())
   updated_at = Column(UtcDateTime(), onupdate=utcnow())
 
-  # pages = relationship('Page', lazy='dynamic')
+  pages = relationship('Page', lazy='dynamic')
 
   def toJSON(self):
     return {
diff --git a/cli/app/sql/models/page.py b/cli/app/sql/models/page.py
index 22fcc96..2e6bbad 100644
--- a/cli/app/sql/models/page.py
+++ b/cli/app/sql/models/page.py
@@ -22,7 +22,7 @@ class Page(Base):
   created_at = Column(UtcDateTime(), default=utcnow())
   updated_at = Column(UtcDateTime(), onupdate=utcnow())
 
-  # tiles = relationship("Tile", lazy='dynamic')
+  tiles = relationship("Tile", foreign_keys="Tile.page_id", lazy='dynamic')
 
   def toJSON(self):
     return {
diff --git a/frontend/common/app.css b/frontend/common/app.css
index 41aa54e..08b2408 100644
--- a/frontend/common/app.css
+++ b/frontend/common/app.css
@@ -74,7 +74,7 @@ header {
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  background: rgba(64,64,64,0.5);
+  background: rgba(16,32,64,0.5);
   color: white;
 }
 header b {
@@ -135,6 +135,7 @@ header .username {
 /* headings */
 
 h1 {
+  color: #eee;
   margin-bottom: 1.25rem;
   font-size: 1.5rem;
   font-weight: normal;
@@ -144,10 +145,12 @@ div:first-child > h1:first-child,
   margin-top: 0;
 }
 h2 {
+  color: #eee;
   font-size: 1.25rem;
   font-weight: normal;
 }
 h3 {
+  color: #eee;
   margin-top: 0;
   margin-bottom: 1.25rem;
   font-size: 1.0rem;
diff --git a/frontend/views/index/containers/graph.edit.js b/frontend/views/index/containers/graph.edit.js
index fadcabc..ce1b404 100644
--- a/frontend/views/index/containers/graph.edit.js
+++ b/frontend/views/index/containers/graph.edit.js
@@ -11,6 +11,7 @@ import GraphForm from '../components/graph.form'
 
 class GraphEdit extends Component {
   componentDidMount() {
+    console.log(this.props.match.params.id)
     actions.graph.show(this.props.match.params.id)
   }
 
@@ -28,7 +29,6 @@ class GraphEdit extends Component {
     if (show.loading || !show.res) {
       return (
         <div className='form'>
-          <h1>Loading...</h1>
           <Loader />
         </div>
       )
diff --git a/frontend/views/index/containers/graph.index.js b/frontend/views/index/containers/graph.index.js
index 7ac31da..c02ad79 100644
--- a/frontend/views/index/containers/graph.index.js
+++ b/frontend/views/index/containers/graph.index.js
@@ -13,17 +13,30 @@ class GraphIndex extends Component {
   }
   render() {
     const { index } = this.props
-    if (index.loading) {
+    console.log(this.props)
+    if (!index.order) {
       return (
         <div className='graphIndex'>
           <Loader />
         </div>
       )      
     }
+    // console.log(state)
     return (
       <div className='graphIndex'>
-        <b>welcome, swimmer</b>
-        <Link to='/index/new'>+ new project</Link>
+        <div>
+          <b>welcome, swimmer</b>
+          <Link to='/index/new'>+ new project</Link>
+        </div>
+        {index.order.map(id => {
+          const graph = index.lookup[id]
+          return (
+            <div key={id}>
+              <Link to={'/' + graph.path}>{graph.title}</Link>
+              <Link to={'/index/' + id + '/edit'}>{'edit project'}</Link>
+            </div>
+          )
+        })}
       </div>
     )
   }
diff --git a/frontend/views/index/graph.reducer.js b/frontend/views/index/graph.reducer.js
index 612ac14..20aed8e 100644
--- a/frontend/views/index/graph.reducer.js
+++ b/frontend/views/index/graph.reducer.js
@@ -11,7 +11,7 @@ const initialState = crudState('graph', {
 const reducer = crudReducer('graph')
 
 export default function graphReducer(state = initialState, action) {
-  // console.log(action.type, action)
+  console.log(action.type, action)
   state = reducer(state, action)
   switch (action.type) {
     default:
diff --git a/frontend/views/index/index.container.js b/frontend/views/index/index.container.js
index 7805e83..0e7127a 100644
--- a/frontend/views/index/index.container.js
+++ b/frontend/views/index/index.container.js
@@ -10,12 +10,14 @@ import './index.css'
 
 import GraphIndex from './containers/graph.index'
 import GraphNew from './containers/graph.new'
+import GraphEdit from './containers/graph.edit'
 
 class Container extends Component {
   render() {
     return (
       <div className='index'>
         <Route exact path='/index/new' component={GraphNew} />
+        <Route exact path='/index/:id/edit' component={GraphEdit} />
         <Route exact path='/index' component={GraphIndex} />
       </div>
     )
diff --git a/frontend/views/index/index.css b/frontend/views/index/index.css
index 48c5abc..028f6c2 100644
--- a/frontend/views/index/index.css
+++ b/frontend/views/index/index.css
@@ -1,18 +1,38 @@
 * {
 
 }
-
+.index {
+  width: 100%;
+  height: 100%;
+  background: linear-gradient(
+      -45deg,
+      rgba(0, 0, 64, 0.5),
+      rgba(128, 0, 64, 0.5)
+    );
+  padding: 1rem;
+}
 .index > div {
-  margin: 1rem;
+  display: inline-block;
   padding: 1rem;
   max-height: calc(100% - 2rem);
   overflow: scroll;
   background: rgba(64,12,64,0.9);
+  box-shadow: 3px 3px 6px rgba(0,0,0,0.4),
+    inset 0 0 60px rgba(128,255,255,0.1);
 }
 .graphIndex {
+  min-width: 20rem;
   display: flex;
   flex-direction: column;
 }
 .graphIndex > * {
   margin-bottom: 0.5rem;
+}
+.graphIndex > div {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between
+}
+.graphIndex > div > a:first-child {
+  color: #fff;
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2