beda-software / baobab-react-schemabranchmixin Goto Github PK
View Code? Open in Web Editor NEWSchemaBranchMixin based on baobab-react
License: MIT License
SchemaBranchMixin based on baobab-react
License: MIT License
In my opinion application data layer belongs to tree and schema layer of the application.
It will be great if we can use special schema value type to remote loading content.
It should work like baobab's monkey works now.
The API should look like this
const SomeComponent = React.createClass({
mixins:[SchemaBranchMixin],
schema:{
someValue: someDefault,
someApiData: resolve({...})
}
render(){
return <p>{{this.state.someApiData}}</p>
}
});
But there are some problems.
What is an API for resolve
function?
What should it pass? Maybe it should be a kind of service, which have all necessary information. API access token, API endpoint URL, transform function, etc.
How should reusable components work?
The schema is internal property, so we can't change it outside of the component. But we are needing to pass some API data.
const ContentTable = {} => {
return <ReusableTable
service={TableService}
row={RowComponent} />
}
where TableService
should be pass to the schema param of ReusableTable component.
@ruscoder @temrdm I want to know your opinion about this idea.
If somebody use getInitialState
or setState
it should fires warning.
Now we have support of nested shema, for example
let FirstStep = React.createClass({
displayName: 'FirstStep',
mixins: [SchemaBranchMixin],
schema: {
firstStep: {
collapsed: false,
},
secondStep: {},
form: {},
rootEntityTags: {
data: {},
},
},
...
})
We will get only first level cursors such as
We need to do select
operation manually to access nested field for example
const rootEntityTagsCursor = this.cursors.rootEntityTags.select('data');
But we already have all necessary information to implement this cursors.
After this idea will be implemented I would like to have API like this
this.cursors.rootEntityTags.data
So nested cursors will be embed to parent cursor as fields. It caused possibility of name clash,
but we can apply some limitation to schema filed to prevent the creation of fields which have already existed at cursor.
React Mixins are going to be deprecated, baobab-react dropped cursor support.
So consider to start working on version 2 with new API for schema component.
@cursors(props => ({
modal: ['modal']
}))
@schema(props => ({
loanData: null,
selectedCar: CarSelect.getSchema(),
selectedLoan: {},
isDisclaimerShown: false,
}))
@resolve(props => [
{
cursor: props.cursors.loanData,
getPromise: loanService,
},
])
@renderCache
export default class MyComponent extends React.Compponent {
render() {
return (
<div>
{JSON.stringify(this.props)}
</div>
);
}
};
Remove webpack, use babel with isparta
When I define cursors, such as:
cursors(props) {
return {form: props.formCursor};
}
schemabranchmixin clones resolved cursors
, and new cursors are different to source cursors.
We need to prepare tutorial with exercises. It is important to share knowledge of our architecture with other persons.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.