Commit 89b211ad authored by Jaden DIEFENBAUGH's avatar Jaden DIEFENBAUGH

[js][db] refactored db editor & tests, reenabled creation test

parent ac831105
......@@ -35,6 +35,7 @@ import type { BeatObject } from '@helpers/beat';
import * as Selectors from '@store/selectors.js';
import * as Actions from '@store/actions.js';
import ValidSchemaBadge from '../ValidSchemaBadge.jsx';
import CacheInput from '../CacheInput.jsx';
import DeleteInputBtn from '../DeleteInputBtn.jsx';
......@@ -48,10 +49,10 @@ type Props = {
saveFunc: (BeatObject) => any,
databases: BeatObject[],
dataformats: BeatObject[],
updateFunc: (BeatObject) => any,
};
type State = {
cache: any,
activeProtocol: number,
};
......@@ -80,24 +81,15 @@ export class DatabaseEditor extends React.Component<Props, State> {
}
state = {
cache: getValidObj(this.props.data),
activeProtocol: 0,
}
componentWillReceiveProps (nextProps: Props) {
this.setState({
cache: getValidObj(nextProps.data),
});
}
setContents = (newContents: any) => {
this.setState({
cache: {
...this.state.cache,
contents: {
'description': this.state.cache.contents['description'],
...newContents,
}
this.props.updateFunc({
...this.props.data,
contents: {
'description': this.props.data.contents['description'],
...newContents,
}
});
}
......@@ -108,13 +100,13 @@ export class DatabaseEditor extends React.Component<Props, State> {
updateProtocol = (index: number, obj: Protocol) => {
this.setContents({
...this.state.cache.contents,
protocols: this.state.cache.contents.protocols.map((o, i) => i === index ? obj : o)
...this.props.data.contents,
protocols: this.props.data.contents.protocols.map((o, i) => i === index ? obj : o)
});
}
updateSet = (idxProtocol: number, idxSet: number, obj: Set) => {
const protocol = this.state.cache.contents.protocols[idxProtocol];
const protocol = this.props.data.contents.protocols[idxProtocol];
this.updateProtocol(
idxProtocol,
{
......@@ -507,7 +499,7 @@ export class DatabaseEditor extends React.Component<Props, State> {
render = () => {
const protocolIdx = this.state.activeProtocol;
const protocol = protocolIdx > -1 ? this.state.cache.contents.protocols[protocolIdx] || undefined : undefined;
const protocol = protocolIdx > -1 ? this.props.data.contents.protocols[protocolIdx] || undefined : undefined;
return (
<div className='databaseEditor'>
......@@ -516,12 +508,12 @@ export class DatabaseEditor extends React.Component<Props, State> {
className='mx-auto'
outline
color='secondary'
onClick={() => this.props.saveFunc(this.state.cache)}
onClick={() => this.props.saveFunc(this.props.data)}
>
Save Changes (Changes are <ValidSchemaBadge entity='database' obj={this.state.cache} />)
Save Changes (Changes are <ValidSchemaBadge entity='database' obj={this.props.data} />)
</Button>
<TemplateButton
data={this.state.cache}
data={this.props.data}
entity={'database'}
/>
</div>
......@@ -533,8 +525,8 @@ export class DatabaseEditor extends React.Component<Props, State> {
type='text'
name='description'
placeholder='Database description...'
value={this.state.cache.contents['description']}
onChange={e => this.setContents({ ...this.state.cache.contents, 'description': e.target.value})}
value={this.props.data.contents['description']}
onChange={e => this.setContents({ ...this.props.data.contents, 'description': e.target.value})}
/>
</FormGroup>
<FormGroup>
......@@ -543,8 +535,8 @@ export class DatabaseEditor extends React.Component<Props, State> {
type='text'
name='rootFolder'
placeholder='Valid system path...'
value={this.state.cache.contents['root_folder']}
onChange={e => this.setContents({ ...this.state.cache.contents, 'root_folder': e.target.value})}
value={this.props.data.contents['root_folder']}
onChange={e => this.setContents({ ...this.props.data.contents, 'root_folder': e.target.value})}
/>
</FormGroup>
</FormGroup>
......@@ -563,15 +555,15 @@ export class DatabaseEditor extends React.Component<Props, State> {
</DropdownToggle>
<DropdownMenu>
{
this.state.cache.contents.protocols
this.props.data.contents.protocols
.map((p, i) =>
<DropdownItem
id={`protocolChoice${ i }`}
key={i}
onClick={() => this.activateProtocol(i)}
>
{ this.state.cache.contents.protocols[i].name }{' '}
({ this.state.cache.contents.protocols[i].template })
{ this.props.data.contents.protocols[i].name }{' '}
({ this.props.data.contents.protocols[i].template })
</DropdownItem>
)
}
......@@ -580,11 +572,11 @@ export class DatabaseEditor extends React.Component<Props, State> {
<ButtonGroup>
<Button outline color='danger'
onClick={e => {
const protocols = this.state.cache.contents.protocols
const protocols = this.props.data.contents.protocols
.filter((p, i) => i !== protocolIdx);
this.setContents({
...this.state.cache.contents,
...this.props.data.contents,
protocols
});
......@@ -595,7 +587,7 @@ export class DatabaseEditor extends React.Component<Props, State> {
</Button>
<Button outline color='secondary'
onClick={e => {
const protocols = [...this.state.cache.contents.protocols];
const protocols = [...this.props.data.contents.protocols];
protocols.splice(
protocolIdx + 1,
0,
......@@ -603,7 +595,7 @@ export class DatabaseEditor extends React.Component<Props, State> {
);
this.setContents({
...this.state.cache.contents,
...this.props.data.contents,
protocols
});
......@@ -618,14 +610,14 @@ export class DatabaseEditor extends React.Component<Props, State> {
color='success'
id='newProtocol'
onClick={e => {
const protocols = [...this.state.cache.contents.protocols, {
const protocols = [...this.props.data.contents.protocols, {
name: '',
template: '',
sets: [],
}];
this.setContents({
...this.state.cache.contents,
...this.props.data.contents,
protocols
});
......@@ -644,7 +636,7 @@ export class DatabaseEditor extends React.Component<Props, State> {
<h4>Quick Jump:</h4>
<ListGroup>
{
this.state.cache.contents.protocols.map((p, i) => {
this.props.data.contents.protocols.map((p, i) => {
const setList = (
<ListGroup className='mt-1'>
{
......@@ -744,11 +736,11 @@ export class DatabaseEditor extends React.Component<Props, State> {
<ButtonGroup className='float-right'>
<Button size='sm' outline color='danger'
onClick={e => {
const protocols = this.state.cache.contents.protocols
const protocols = this.props.data.contents.protocols
.filter((p, i) => i !== protocolIdx);
this.setContents({
...this.state.cache.contents,
...this.props.data.contents,
protocols
});
......@@ -759,7 +751,7 @@ export class DatabaseEditor extends React.Component<Props, State> {
</Button>
<Button size='sm' outline color='secondary'
onClick={e => {
const protocols = [...this.state.cache.contents.protocols];
const protocols = [...this.props.data.contents.protocols];
protocols.splice(
protocolIdx + 1,
0,
......@@ -767,7 +759,7 @@ export class DatabaseEditor extends React.Component<Props, State> {
);
this.setContents({
...this.state.cache.contents,
...this.props.data.contents,
protocols
});
......@@ -785,14 +777,14 @@ export class DatabaseEditor extends React.Component<Props, State> {
}
<ListGroupItem tag='button' action className='text-primary'
onClick={e => {
const protocols = [...this.state.cache.contents.protocols, {
const protocols = [...this.props.data.contents.protocols, {
name: '',
template: '',
sets: [],
}];
this.setContents({
...this.state.cache.contents,
...this.props.data.contents,
protocols
});
......@@ -809,11 +801,21 @@ export class DatabaseEditor extends React.Component<Props, State> {
}
const mapStateToProps = (state, ownProps) => {
const dbs = Selectors.databaseGet(state);
const obj = {
databases: Selectors.databaseGet(state),
databases: dbs,
dataformats: Selectors.dataformatGet(state),
data: dbs[ownProps.index] || getValidObj()
};
return obj;
};
export default connect(mapStateToProps)(DatabaseEditor);
const mapDispatchToProps = (dispatch, ownProps) => ({
// replace the obj in the Redux store with the new object
updateFunc: (obj) => {
console.log(`dispatching for ${ obj.name }`);
dispatch(Actions[`databaseUpdate`](obj.name, obj));
},
});
export default connect(mapStateToProps, mapDispatchToProps)(DatabaseEditor);
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment