From 791217e9c49e9b5f84fcf1d19e8d8c44433314d1 Mon Sep 17 00:00:00 2001
From: Ivan Florentin <ivan@sinergetica.com>
Date: Thu, 18 Aug 2016 01:31:30 -0400
Subject: [PATCH] updated to latest react and react-toolbox relations starting
 to appear

---
 package.json     |  8 +++-
 src/edit.js      | 96 +++++++++++++++++++++++++++++++-----------------
 src/list.js      | 31 ++++++++++++----
 src/providers.js |  5 ++-
 4 files changed, 97 insertions(+), 43 deletions(-)

diff --git a/package.json b/package.json
index 2b2dac2..a76fb45 100644
--- a/package.json
+++ b/package.json
@@ -20,10 +20,16 @@
     "babel-preset-react": "^6.1.4",
     "babel-preset-stage-2": "^6.5.0",
     "node-uuid": "^1.4.7",
+    "normalize.css": "^4.2.0",
     "react": "^15.3.0",
+    "react-addons-css-transition-group": "^15.3.0",
+    "react-addons-update": "^15.3.0",
+    "react-dom": "^15.3.0",
     "react-redux-provide": "^6.0.0-rc.56",
+    "react-toolbox": "^1.1.2",
     "redux-replicate": "^2.0.0-rc.6",
-    "validator": "^5.5.0"
+    "validator": "^5.5.0",
+    "webpack": "^1.13.1"
   },
   "babel": {
     "plugins": [
diff --git a/src/edit.js b/src/edit.js
index 1ca13ca..af04d50 100644
--- a/src/edit.js
+++ b/src/edit.js
@@ -9,29 +9,22 @@ export default function (compDef) {
 
   const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
   const fieldNames = Object.keys(fields)
+  fieldNames.map((fieldName)=>{
+    if (fields[fieldName].relation) {
+      const relation = fields[fieldName].relation
+      propTypes[`${relation}Routes`] = PropTypes.object
+      //console.log(fieldName, relation)
+    }
+  })
   const ComponentEdit = (props) =>{
     let next = Object.assign({}, props[componentName])
     const save = () =>{props[`save${componentProperName}`](next)}
     const store = () =>{props[`store${componentProperName}`](next)}
     const {goBack} = props
     const listCaption = `Ingrese datos de ${componentProperName}`
-    const listFields = []
-
-    for (let fieldName of fieldNames) {
-      if (fields[fieldName].relation && fields[fieldName].relation === 'oneToMany') {
-	console.log('oneToMany', fields[fieldName].component, fields[fieldName].remoteField)
-	const remoteField = fields[fieldName].remoteField
-      }
-      if (fields[fieldName].relation && fields[fieldName].relation === 'manyToOne') {
-	console.log('manyToOne', fields[fieldName].component, fields[fieldName].remoteField)
-      }
-      if (fields[fieldName].relation && fields[fieldName].relation === 'manyToMany') {
-  console.log('manyToMany', fields[fieldName].component, fields[fieldName].remoteField)
-      }
-      if (fields[fieldName].relation && fields[fieldName].relation === 'oneToOne') {
-  console.log('oneToOne', fields[fieldName].component, fields[fieldName].remoteField)
-      }
-	let label = fields[fieldName].label
+    // const listFields = []
+    const listFields = fieldNames.map((fieldName)=>{
+      let label = fields[fieldName].label
       if (!label || label === '') {
 	  label = fieldName
 	}
@@ -41,35 +34,72 @@ export default function (compDef) {
       if (next[fieldError]) {
 	error = <span>{next[fieldError]}</span>
       }
-      const field = <div key={fieldName}>
-	    <Input value={next[fieldName] ||''}
+      if (fields[fieldName].relation) {
+	const relation = fields[fieldName].relation
+	console.log('relation:', relation)
+	const routes = `${relation}Routes`
+	const listRoute = props[routes][`${relation}List`]
+	return <div key={fieldName}><Button icon='add' onClick={(e) => {
+	  console.log('go to ', props[routes], props.pushRoute)
+	  props.pushRoute(listRoute)
+	}}
+	  /></div>
+      }
+      return <div key={fieldName}>
+	<Input value={next[fieldName] ||''}
       type={componentField.uiType} label={label} name='name' icon={componentField.icon}
       hint={componentField.hint}
       onChange={(e) => {
 	next[fieldName] = e
 	save()
       }}/>
-	      {error}
+	{error}
+      </div>
+    })
+    return <div>
+      <ListSubHeader caption={listCaption}/>
+      {listFields}
+      <Button icon='done' floating disabled={!next.isValid} accent mini onClick={(e)=>{
+	store()
+	goBack()
+      }}/>
+      <Button icon='undo' floating accent mini onClick={()=>{goBack()}}/>
       </div>
-	listFields.push(field)
-    }
-    return (
-	<div>
-	<ListSubHeader caption={listCaption}/>
-	{listFields}
-	<Button icon='done' floating disabled={!next.isValid} accent mini onClick={(e)=>{
-	  store()
-	  goBack()
-	}}/>
-	<Button icon='undo' floating accent mini onClick={()=>{goBack()}}/>
-	</div>
-    )
   }
   ComponentEdit.propTypes = propTypes
   ComponentEdit.propTypes[`${componentName}`] = PropTypes.object
   ComponentEdit.propTypes[`save${componentProperName}`] = PropTypes.func
   ComponentEdit.propTypes[`store${componentProperName}`] = PropTypes.func
   ComponentEdit.propTypes.goBack = PropTypes.func
+  ComponentEdit.propTypes.pushRoute = PropTypes.func
   return ComponentEdit
 }
 //create a separate parser
+//     for (let fieldName of fieldNames) {
+//       if (fields[fieldName].relation) {
+// 	const relation = fields[fieldName].relation
+// 	console.log('relation:', relation)
+//       }
+//       let label = fields[fieldName].label
+//       if (!label || label === '') {
+// 	  label = fieldName
+// 	}
+//       const componentField = compDef.fields[fieldName]
+//       const fieldError = `${fieldName}Error`
+//       let error = ''
+//       if (next[fieldError]) {
+// 	error = <span>{next[fieldError]}</span>
+//       }
+//       const field = <div key={fieldName}>
+// 	    <Input value={next[fieldName] ||''}
+//       type={componentField.uiType} label={label} name='name' icon={componentField.icon}
+//       hint={componentField.hint}
+//       onChange={(e) => {
+// 	next[fieldName] = e
+// 	save()
+//       }}/>
+// 	      {error}
+//       </div>
+// 	listFields.push(field)
+//     }
+//     return (
diff --git a/src/list.js b/src/list.js
index 5937e5b..5d77d1b 100644
--- a/src/list.js
+++ b/src/list.js
@@ -12,6 +12,7 @@ export default function (compDef) {
     const displayURL = `${url.slice(0, url.lastIndexOf('/')+1)}display`
     const editURL = `${url.slice(0, url.lastIndexOf('/')+1)}edit`
     const list = props[listName]
+    console.log('list', list)
     const Items = list.map((item, index) =>{
       let itemLegend = ''
       for (let field in fields) {
@@ -24,13 +25,24 @@ export default function (compDef) {
 	}
       }
       return <ListItem key={index} legend={itemLegend} leftIcon={compDef.icon}
-      onClick={() =>{
-	props[`select${componentProperName}`](props[listName][index])
-	props.pushRoute(displayURL)
-      }
-	      }>
-	this is a child
-	</ListItem>
+      rightActions={[
+	  <Button key='edit' icon='edit' floating accent mini
+	onClick={() =>{
+	  props[`select${componentProperName}`](props[listName][index])
+	  props.pushRoute(editURL)
+	}}
+	  />,
+	  <Button key='display' icon='description' floating accent mini
+	  	onClick={() =>{
+	  props[`select${componentProperName}`](props[listName][index])
+		  props.pushRoute(displayURL)
+	}}/>,
+          <Button key='select' icon='done' floating accent mini
+	onClick={() =>{
+	  props[`select${componentProperName}`](props[listName][index])
+	  props.goBack()
+	}}/>]}
+	/>
     })
 
     return <div>
@@ -38,6 +50,11 @@ export default function (compDef) {
       <center><ListSubHeader caption={compDef.listTitle} /></center>
       {Items}
     </List>
+      <Button icon='undo'
+    floating accent mini onClick={()=>{
+      props.goBack()
+    }}/>
+
       <Button icon='add'
     floating accent mini onClick={()=>{
       props[`deselect${componentProperName}`]()
diff --git a/src/providers.js b/src/providers.js
index e7366b5..5d46d10 100644
--- a/src/providers.js
+++ b/src/providers.js
@@ -7,7 +7,6 @@ export default function (compDef) {
        replication
 	} = compDef
 
-  console.log('replicator', replication)
   const listProperName = listName[0].toUpperCase() + listName.substring(1)
   const listCapitalName = listName.toUpperCase()
   const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
@@ -63,7 +62,9 @@ export default function (compDef) {
     switch (action.type) {
     case SET_ROUTE: {
       const {name, path} = action
-      return Object.assign({}, state, {name, path})
+      let route = {}
+      route[name] = path
+      return Object.assign({}, state, route)
     }
     case DELETE_ROUTE: {
       const {name} = action