creation of main container logic

src/createMainContainer.js

@@ -0,0 +1,72 @@
+import React, {Component, PropTypes} from 'react'
+import {Router, Route, browserHistory} from 'react-router'
+
+const createMainContainer = (MainRoute, apps, MainContainer) =>{
+  const Container = (props) =>{
+    for (let appName in apps) {
+      const app = apps[appName]
+      if (app.appDef) {
+	//	console.log(`app ${appName}`, apps[appName])
+	for (let component of apps[appName].appDef.components) {
+	  //	  console.log('components', component)
+	  const componentName = component.componentName
+	  const appPath = `/${apps[appName].appDef.appRoute}/`
+	  const editName = `${componentName}Edit`
+	  const listName = `${componentName}List`
+	  const displayName = `${componentName}Display`
+//	  const relationDisplayName = `${componentName}RelationDisplay`
+	  const editPath = `${appPath}${componentName}/edit`
+	  const listPath = `${appPath}${componentName}/list`
+	  const displayPath = `${appPath}${componentName}/display`
+	  const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
+	  const setRoute = `setRoute${componentProperName}`
+	  const setTemplate = `setTemplate${componentProperName}`
+	  const templates= apps[appName].components[componentName]
+	  props[setRoute]({name: editName, path: editPath})
+	  props[`setComponentDef${componentProperName}`](component)
+	  props[setRoute]({name: listName, path: listPath})
+	  props[setRoute]({name: displayName, path: displayPath})
+	  props[setTemplate]({name: editName,
+				   template: templates[`edit${componentProperName}`]})
+	  props[setTemplate]({name: displayName,
+				   template: templates[`display${componentProperName}`]})
+	  // 	  props[setTemplate]({name: relationDisplayName,
+// 				   template: templates[`relationDisplay${componentProperName}`]})
+ 	  props[setTemplate]({name: listName,
+				   template: templates[`list${componentProperName}`]})
+	}
+      }
+    }
+    return <div>
+      <Router>
+      <Route path="/" component={MainContainer}>
+      {MainRoute}
+    </Route>
+      </Router>
+      </div>
+    }
+    Container.propTypes = {}
+
+    for (let appName in apps) {
+      const app = apps[appName]
+      if (app.appDef) {
+	//console.log('app', apps[appName].appDef)
+	const components = apps[appName].appDef.components
+    for (let component of components) {
+      // console.log('CCCCCCCC', component)
+      const componentName = component.componentName
+      const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
+      const setRoute = `setRoute${componentProperName}`
+      const setTemplate = `setTemplate${componentProperName}`
+      //const setComponentDef = `setComponentDef${componentProperName}`
+      Container.propTypes[`setComponentDef${componentProperName}`] = PropTypes.func
+      Container.propTypes[setRoute] = PropTypes.func
+      Container.propTypes[setTemplate] = PropTypes.func
+    }
+  }
+}
+
+  return Container
+}
+
+export {createMainContainer}

src/edit.js

@@ -1,8 +1,5 @@
 import React, {PropTypes} from 'react'
 import {List, ListItem,ListSubHeader, Button, Input} from 'react-toolbox'
-//import relationDisplayCreator from './relationDisplay'
-// console.log('relationDisplay',relationDisplay)
-// relationDisplay({component:{}, componentDef:{}})
 
 export default function (compDef) {
   const {componentName,
@@ -25,13 +22,13 @@ export default function (compDef) {
     }
   })
   const ComponentEdit = (props) =>{
-    //    console.log('props', props)
-    const component = props[componentName]
     const 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 = fieldNames.map((fieldName)=>{
       let label = fields[fieldName].label
       if (!label || label === '') {
@@ -45,24 +42,21 @@ export default function (compDef) {
       }
       if (fields[fieldName].relation) {
 	const relation = fields[fieldName].relation
-	//console.log(`selected ${relation}`, props[relation].uuid)
+	console.log('relation',props[relation])
 	const relationList = props[`${relation}List`]
 	const relationComponentDef = props[`${relation}ComponentDef`]
 	const relationProperName = relation.toUpperCase() + relation.substring(1)
 	const routes = `${relation}Routes`
 	const listRoute = props[routes][`${relation}List`]
 
-	//console.log(`relation ${relation} is `, next[relation])
-	//console.log('is selecting?', next[`${relation}Selecting`])
-	//console.log('relationList', relationList)
 	if (next[relation]===undefined) {next[relation]=[]}
 	if (next[`${relation}Selecting`]) {
 	  if (next[relation].indexOf(props[relation].uuid)===-1) {
+	    console.log('adding', props[relation].uuid)
 	    next[relation].push(props[relation].uuid)
 	  }
 	  delete next[`${relation}Selecting`]
 	}
-	//ahora a crear los items para el render
 	const relListFields= relationList.filter(comp =>{
 	  if (next[relation].indexOf(comp.uuid)) {
 	    return true
@@ -71,7 +65,6 @@ export default function (compDef) {
 	}).map(comp=>{
 	  let thisComp = []
 	  for (let key in comp) {
-	    //console.log(`rendering ${key}`, comp[key])
 	    thisComp.push(<div key={key}>{key}: {comp[key]}</div>)
 	  }
 	  return <div key={comp.uuid}>{thisComp}
@@ -127,32 +120,3 @@ export default function (compDef) {
   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 (

src/index.js

@@ -5,6 +5,8 @@ import provideComponentCrud from './providers'
 import routeCreator from './routes'
 import menuCreator from './menu'
 
+export {createMainContainer} from './createMainContainer'
+
 export default function (appDef) {
   const components = {}
   const providers = {}