now uses provideModel

ivanflorentin · Sep 8, 2016 · 0e31236 · 0e31236
1 parent 70fedc4
commit 0e31236
Show file tree

Hide file tree

Showing 8 changed files with 132 additions and 148 deletions.
diff --git a/src/components.js b/src/components.js
@@ -4,12 +4,12 @@ import displayCreator from './display'
 //import relationDisplayCreator from './relationDisplay'
 
 export default function (compDef) {
-  const componentProperName = compDef.componentName[0].toUpperCase() +
-	compDef.componentName.substring(1)
-  const components = {}
-  components[`edit${componentProperName}`] = editCreator(compDef)
-  components[`list${componentProperName}`] = listCreator(compDef)
-  components[`display${componentProperName}`] = displayCreator(compDef)
-//  components[`relationDisplay${componentProperName}`] = relationDisplayCreator(compDef)
-  return components
+  const modelProperName = compDef.modelName[0].toUpperCase() +
+	compDef.modelName.substring(1)
+  const models = {}
+  models[`edit${modelProperName}`] = editCreator(compDef)
+  models[`list${modelProperName}`] = listCreator(compDef)
+  models[`display${modelProperName}`] = displayCreator(compDef)
+//  models[`relationDisplay${modelProperName}`] = relationDisplayCreator(compDef)
+  return models
 }
diff --git a/src/createMainContainer.js b/src/createMainContainer.js
@@ -1,40 +1,40 @@
-import React, {Component, PropTypes} from 'react'
-import {Router, Route, browserHistory} from 'react-router'
+import React, {PropTypes} from 'react'
+import {Router, Route} from 'react-router'
 
 const createMainContainer = (MainRoute, apps, MainContainer) =>{
   const Container = (props) =>{
     for (let appName in apps) {
       const app = apps[appName]
       if (app.appDef) {
-	for (let component of apps[appName].appDef.components) {
-	  const componentName = component.componentName
+	for (let model of apps[appName].appDef.models) {
+	  const modelName = model.modelName
 	  const appPath = `/${apps[appName].appDef.appRoute}/`
-	  const editName = `${componentName}Edit`
-	  const listName = `${componentName}List`
-	  const displayName = `${componentName}Display`
-	  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]
+	  const editName = `${modelName}Edit`
+	  const listName = `${modelName}List`
+	  const displayName = `${modelName}Display`
+	  const editPath = `${appPath}${modelName}/edit`
+	  const listPath = `${appPath}${modelName}/list`
+	  const displayPath = `${appPath}${modelName}/display`
+	  const modelProperName = modelName[0].toUpperCase() + modelName.substring(1)
+	  const setRoute = `setRoute${modelProperName}`
+	  const setTemplate = `setTemplate${modelProperName}`
+	  const templates= apps[appName].components[modelName]
 	  props[setRoute]({name: editName, path: editPath})
-	  props[`setComponentDef${componentProperName}`](component)
+	  props[`setModelDef${modelProperName}`](model)
 	  props[setRoute]({name: listName, path: listPath})
 	  props[setRoute]({name: displayName, path: displayPath})
 	  props[setTemplate]({name: editName,
-			      template: templates[`edit${componentProperName}`]})
+			      template: templates[`edit${modelProperName}`]})
 	  props[setTemplate]({name: displayName,
-			      template: templates[`display${componentProperName}`]})
+			      template: templates[`display${modelProperName}`]})
  	  props[setTemplate]({name: listName,
-			      template: templates[`list${componentProperName}`]})
+			      template: templates[`list${modelProperName}`]})
 	}
       }
     }
     return <div>
       <Router>
-      <Route path="/" component={MainContainer}>
+      <Route path="/" model={MainContainer}>
       {MainRoute}
     </Route>
       </Router>
@@ -45,13 +45,13 @@ const createMainContainer = (MainRoute, apps, MainContainer) =>{
   for (let appName in apps) {
     const app = apps[appName]
     if (app.appDef) {
-      const components = apps[appName].appDef.components
-      for (let component of components) {
-	const componentName = component.componentName
-	const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
-	const setRoute = `setRoute${componentProperName}`
-	const setTemplate = `setTemplate${componentProperName}`
-	Container.propTypes[`setComponentDef${componentProperName}`] = PropTypes.func
+      const models = apps[appName].appDef.models
+      for (let model of models) {
+	const modelName = model.modelName
+	const modelProperName = modelName[0].toUpperCase() + modelName.substring(1)
+	const setRoute = `setRoute${modelProperName}`
+	const setTemplate = `setTemplate${modelProperName}`
+	Container.propTypes[`setModelDef${modelProperName}`] = PropTypes.func
 	Container.propTypes[setRoute] = PropTypes.func
 	Container.propTypes[setTemplate] = PropTypes.func
       }

diff --git a/src/display.js b/src/display.js
@@ -1,66 +1,61 @@
 import React, {PropTypes} from 'react'
 import {List, ListItem, ListSubHeader, Button} from 'react-toolbox'
 
-export default function (compDef) {
-  const {componentName,
+export default function (modelDef) {
+  const {modelName,
 	 fields
-	} = compDef
+	} = modelDef
   let propTypes = {}
 
-  const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
+  const modelProperName = modelName[0].toUpperCase() + modelName.substring(1)
   const fieldNames = Object.keys(fields)
   fieldNames.map((fieldName)=>{
     if (fields[fieldName].relation) {
       const relation = fields[fieldName].relation
       const relationProperName = relation[0].toUpperCase() + relation.substring(1)
       propTypes[`${relation}Routes`] = PropTypes.object
       propTypes[`${relation}Templates`] = PropTypes.object
-      propTypes[`save${componentProperName}${relationProperName}`] = PropTypes.func
-      propTypes[`delete${componentProperName}${relationProperName}`] = PropTypes.func
-      propTypes[`${relation}ComponentDef`] = PropTypes.object
+      propTypes[`save${modelProperName}${relationProperName}`] = PropTypes.func
+      propTypes[`delete${modelProperName}${relationProperName}`] = PropTypes.func
+      propTypes[`${relation}ModelDef`] = PropTypes.object
       propTypes[`${relation}List`] = PropTypes.object
       propTypes[relation] = PropTypes.object
     }
   })
 
 
-  const ComponentDisplay = (props) =>{
-    console.log('in display', props)
-    let state = Object.assign({}, props[componentName])
+  const ModelDisplay = (props) =>{
+    let state = Object.assign({}, props[modelName])
     const url = props.routing.locationBeforeTransitions.pathname
     const editURL = `${url.slice(0, url.lastIndexOf('/')+1)}edit`
     const {goBack} = props
-    const listCaption = `Datos de ${componentProperName}`
+    const listCaption = `Datos de ${modelProperName}`
     const listFields = []
     const relationFields = []
 
     for (let fieldName of fieldNames) {
-      console.log('field', state[fieldName])
-      const componentField = compDef.fields[fieldName]
-      if (componentField.relation) {
-	const relComponents = []
-	const relation = componentField.relation
+      const modelField = modelDef.fields[fieldName]
+      if (modelField.relation) {
+	const relModels = []
+	const relation = modelField.relation
 	const relationList = props[`${relation}List`]
-	console.log('Props relationList', `${relation}List`, relationList)
-	console.log(`relation, ${componentField.relation}`, state[fieldName])
  	if (state[fieldName]) {
 	  const ids = Object.keys(state[fieldName])
-  	  ids.map((id, index) => {
- 	    console.log('rel id', relationList[id])
+  	  ids.map((id) => {
 	    const relComp = []
 	    const relCompKeys = Object.keys(relationList[id])
 	    relCompKeys.map((name) =>{
 	      relComp.push(<div>{name}: {relationList[id][name]}</div>)
 	    })
- 	    relComponents.push(relComp)
+ 	    relModels.push(relComp)
  	  })
-	relationFields.push(<div key={componentField.relation}>
-			    {componentField.relation}, {relComponents}</div>)
+	relationFields.push(<div key={modelField.relation}>
+			    {modelField.relation}, {relModels}</div>)
 	}
       } else {
 	const field = <div key={fieldName}>
 	    <ListItem caption={state[fieldName] ||''}
-	legend={componentField.label} righticon={componentField.icon}/>
+	legend={modelField.label} righticon={modelField.icon}/>
 	  </div>
 	  listFields.push(field)
       }
@@ -72,22 +67,22 @@ export default function (compDef) {
 	{listFields}
 	<div>Relaciones: {relationFields} </div>
       </List>
-	<Button icon='edit' floating disabled={!state.isValid} accent mini onClick={(e)=>{
+	<Button icon='edit' floating disabled={!state.isValid} accent mini onClick={()=>{
 	  props.pushRoute(editURL)
 	}}/>
 	<Button icon='undo' floating accent mini onClick={()=>{goBack()}}/>
 	</div>
     )
   }
 
-  ComponentDisplay.propTypes = propTypes
-  ComponentDisplay.propTypes.pushRoute = PropTypes.func
-  ComponentDisplay.propTypes.goBack = PropTypes.func
-  ComponentDisplay.propTypes.routing = PropTypes.object
-  ComponentDisplay.propTypes[`${componentName}`] = PropTypes.object
-  ComponentDisplay.propTypes[`save${componentProperName}`] = PropTypes.func
-  ComponentDisplay.propTypes[`store${componentProperName}`] = PropTypes.func
-  return ComponentDisplay
+  ModelDisplay.propTypes = propTypes
+  ModelDisplay.propTypes.pushRoute = PropTypes.func
+  ModelDisplay.propTypes.goBack = PropTypes.func
+  ModelDisplay.propTypes.routing = PropTypes.object
+  ModelDisplay.propTypes[`${modelName}`] = PropTypes.object
+  ModelDisplay.propTypes[`save${modelProperName}`] = PropTypes.func
+  ModelDisplay.propTypes[`store${modelProperName}`] = PropTypes.func
+  return ModelDisplay
 }
 
 
diff --git a/src/edit.js b/src/edit.js
@@ -1,50 +1,46 @@
 import React, {Component, PropTypes} from 'react'
 import {List, ListSubHeader, Button, Input} from 'react-toolbox'
 
-export default function (compDef) {
-  const {componentName,
+export default function (modelDef) {
+  const {modelName,
 	 fields
-	} = compDef
+	} = modelDef
   let propTypes = {}
 
-  const componentProperName = componentName[0].toUpperCase() + componentName.substring(1)
+  const modelProperName = modelName[0].toUpperCase() + modelName.substring(1)
   const fieldNames = Object.keys(fields)
   fieldNames.map((fieldName)=>{
     if (fields[fieldName].relation) {
       const relation = fields[fieldName].relation
       const relationProperName = relation[0].toUpperCase() + relation.substring(1)
       propTypes[`${relation}Routes`] = PropTypes.object
       propTypes[`${relation}Templates`] = PropTypes.object
-      propTypes[`save${componentProperName}${relationProperName}`] = PropTypes.func
-      propTypes[`delete${componentProperName}${relationProperName}`] = PropTypes.func
-      propTypes[`${relation}ComponentDef`] = PropTypes.object
+      propTypes[`save${modelProperName}${relationProperName}`] = PropTypes.func
+      propTypes[`delete${modelProperName}${relationProperName}`] = PropTypes.func
+      propTypes[`${relation}ModelDef`] = PropTypes.object
       propTypes[`${relation}List`] = PropTypes.object
       propTypes[relation] = PropTypes.object
     }
   })
-  class ComponentEdit extends Component {
+  class ModelEdit extends Component {
     constructor(props) {
       super(props)
-      this.state = JSON.parse(JSON.stringify(this.props[componentName]))
-      console.log('isValid?', this.state.isValid)
-      console.log('\n in constructor, props', this.props[componentName], 'state', this.state)
-      this.save = () =>{this.props[`save${componentProperName}`](this.state)}
-      this.store = () =>{this.props[`store${componentProperName}`](this.state)}
+      this.state = JSON.parse(JSON.stringify(this.props[modelName]))
+      this.save = () =>{this.props[`save${modelProperName}`](this.state)}
+      this.store = () =>{this.props[`store${modelProperName}`](this.state)}
       this.goBack = this.props.goBack
     }
 
-    componentWillMount() {
-      console.log('\n in mount, props', this.props[componentName], 'state', this.state)
+    modelWillMount() {
       this.relations = {}
       fieldNames.map((fieldName) =>{
 	const field = fields[fieldName]
 	const relation = field.relation
 	if (this.state[relation]) {this.state[relation]={}}
 	if (relation) {
 // 	  const relationProperName = relation[0].toUpperCase() + relation.substring(1)
-// 	  const saveRelation = this.props[`save${componentProperName}${relationProperName}`]
+// 	  const saveRelation = this.props[`save${modelProperName}${relationProperName}`]
 	  if (this.state[`${relation}Selecting`]) {
-	    console.log(`${relation}Selecting`)
 	    const id = this.props[relation].uuid
 	    if (!this.state[relation]) {this.state[relation] = []}
 	    this.state[relation][id] = id
@@ -55,36 +51,36 @@ export default function (compDef) {
       })
     }
 
-    componentDidMount() {}
-    shouldComponentUpdate() {
+    modelDidMount() {}
+    shouldModelUpdate() {
       return true
     }
 
-    componentWillReceiveProps() {
-//       this.state = JSON.parse(JSON.stringify(this.props[componentName]))
+    modelWillReceiveProps() {
+//       this.state = JSON.parse(JSON.stringify(this.props[modelName]))
 //       console.log('receiveProps == isValid?', this.state.isValid)
     }
 
-    componentWillUpdate() {
-      console.log('componentWillUpdate')
+    modelWillUpdate() {
+      console.log('modelWillUpdate')
     }
-    componentDidUpdate() {console.log('componentDidUpdate')}
+    modelDidUpdate() {console.log('modelDidUpdate')}
 
-    componentWillUnmount() {
+    modelWillUnmount() {
       this.save()
     }
 
     render() {
       console.log('Render')
-      this.state = JSON.parse(JSON.stringify(this.props[componentName]))
+      this.state = JSON.parse(JSON.stringify(this.props[modelName]))
       console.log('in Update == isValid?', this.state.isValid)
-      const listCaption = `Ingrese datos de ${componentProperName}`
+      const listCaption = `Ingrese datos de ${modelProperName}`
       const listFields = fieldNames.map((fieldName)=>{
 	let label = fields[fieldName].label
 	if (!label || label === '') {
 	  label = fieldName
 	}
-	const componentField = compDef.fields[fieldName]
+	const modelField = modelDef.fields[fieldName]
 	const fieldError = `${fieldName}Error`
 	let error = []
 	console.log('errors', this.state[fieldError])
@@ -94,10 +90,10 @@ export default function (compDef) {
 	if (fields[fieldName].relation) {
 	  const relation = fields[fieldName].relation
 	  const relationList = this.props[`${relation}List`]
-//	  const relationComponentDef = this.props[`${relation}ComponentDef`]
+//	  const relationModelDef = this.props[`${relation}ModelDef`]
 //	  const relationProperName = relation[0].toUpperCase() + relation.substring(1)
-//	  const saveRelation = this.props[`save${componentProperName}${relationProperName}`]
-//	  const deleteRelation = this.props[`delete${componentProperName}${relationProperName}`]
+//	  const saveRelation = this.props[`save${modelProperName}${relationProperName}`]
+//	  const deleteRelation = this.props[`delete${modelProperName}${relationProperName}`]
 	  const routes = `${relation}Routes`
 	  const listRoute = this.props[routes][`${relation}List`]
 	  let relListFields= []
@@ -133,8 +129,8 @@ export default function (compDef) {
 	}
 	return <div key={fieldName}>
 	  <Input value={this.state[fieldName] ||''}
-	type={componentField.uiType} label={label} name='name' icon={componentField.icon}
-	hint={componentField.hint}
+	type={modelField.uiType} label={label} name='name' icon={modelField.icon}
+	hint={modelField.hint}
 	onChange={(e) => {
 	  this.state[fieldName] = e
 	  this.save()
@@ -154,11 +150,11 @@ export default function (compDef) {
     }
   }
 
-  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
+  ModelEdit.propTypes = propTypes
+  ModelEdit.propTypes[`${modelName}`] = PropTypes.object
+  ModelEdit.propTypes[`save${modelProperName}`] = PropTypes.func
+  ModelEdit.propTypes[`store${modelProperName}`] = PropTypes.func
+  ModelEdit.propTypes.goBack = PropTypes.func
+  ModelEdit.propTypes.pushRoute = PropTypes.func
+  return ModelEdit
 }
diff --git a/src/index.js b/src/index.js
@@ -1,7 +1,7 @@
 import {Route} from 'react-router'
 import React from 'react'
 import componentCreator from './components'
-import provideComponentCrud from './providers'
+import provideModel from 'provideModel'
 import routeCreator from './routes'
 import menuCreator from './menu'
 
@@ -11,10 +11,10 @@ export default function (appDef) {
   const components = {}
   const providers = {}
   const componentRoutes = []
-  appDef.components.map((compDef) =>{
-    components[compDef.componentName] = componentCreator(compDef)
-    providers[compDef.componentName] = provideComponentCrud(compDef)
-    componentRoutes.push(routeCreator(compDef, components[compDef.componentName]))
+  appDef.models.map((modelDef) =>{
+    components[modelDef.modelName] = componentCreator(modelDef)
+    providers[modelDef.modelName] = provideModel(modelDef)
+    componentRoutes.push(routeCreator(modelDef, components[modelDef.modelName]))
   })
   const menu = menuCreator(appDef)
   const MainRoute =