diff options
Diffstat (limited to 'web/src/js')
8 files changed, 203 insertions, 3 deletions
diff --git a/web/src/js/__tests__/components/Modal/OptionModalSpec.js b/web/src/js/__tests__/components/Modal/OptionModalSpec.js new file mode 100644 index 00000000..dd4e70a2 --- /dev/null +++ b/web/src/js/__tests__/components/Modal/OptionModalSpec.js @@ -0,0 +1,54 @@ +import React from 'react' +import renderer from 'react-test-renderer' +import { PureOptionDefault } from '../../../components/Modal/OptionModal' + +describe('PureOptionDefault Component', () => { + + it('should return null when the value is default', () => { + let pureOptionDefault = renderer.create( + <PureOptionDefault value="foo" defaultVal="foo"/> + ), + tree = pureOptionDefault.toJSON() + expect(tree).toMatchSnapshot() + }) + + it('should handle boolean type', () => { + let pureOptionDefault = renderer.create( + <PureOptionDefault value={true} defaultVal={false}/> + ), + tree = pureOptionDefault.toJSON() + expect(tree).toMatchSnapshot() + }) + + it('should handle array', () => { + let a = [""], b = [], c = ['c'], + pureOptionDefault = renderer.create( + <PureOptionDefault value={a} defaultVal={b}/> + ), + tree = pureOptionDefault.toJSON() + expect(tree).toMatchSnapshot() + + pureOptionDefault = renderer.create( + <PureOptionDefault value={a} defaultVal={c}/> + ) + tree = pureOptionDefault.toJSON() + expect(tree).toMatchSnapshot() + }) + + it('should handle string', () => { + let pureOptionDefault = renderer.create( + <PureOptionDefault value="foo" defaultVal=""/> + ), + tree = pureOptionDefault.toJSON() + expect(tree).toMatchSnapshot() + }) + + it('should handle null value', () => { + let pureOptionDefault = renderer.create( + <PureOptionDefault value="foo" defaultVal={null}/> + ), + tree = pureOptionDefault.toJSON() + expect(tree).toMatchSnapshot() + }) + +}) diff --git a/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap b/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap index bfd855bd..8d9271f1 100644 --- a/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap +++ b/web/src/js/__tests__/components/Modal/__snapshots__/ModalSpec.js.snap @@ -117,7 +117,7 @@ exports[`Modal Component should render correctly 2`] = ` name="choiceOption" onChange={[Function]} onKeyDown={[Function]} - selected="b" + value="b" > <option value="a" @@ -136,6 +136,17 @@ exports[`Modal Component should render correctly 2`] = ` </option> </select> </div> + <div + className="small" + > + Default: + <strong> + + a + + </strong> + + </div> </div> </div> <div @@ -170,6 +181,17 @@ exports[`Modal Component should render correctly 2`] = ` value={1} /> </div> + <div + className="small" + > + Default: + <strong> + + 0 + + </strong> + + </div> </div> </div> <div @@ -207,6 +229,17 @@ exports[`Modal Component should render correctly 2`] = ` <div className="small text-danger" /> + <div + className="small" + > + Default: + <strong> + + null + + </strong> + + </div> </div> </div> </div> diff --git a/web/src/js/__tests__/components/Modal/__snapshots__/OptionModalSpec.js.snap b/web/src/js/__tests__/components/Modal/__snapshots__/OptionModalSpec.js.snap new file mode 100644 index 00000000..68f1c9fc --- /dev/null +++ b/web/src/js/__tests__/components/Modal/__snapshots__/OptionModalSpec.js.snap @@ -0,0 +1,61 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`PureOptionDefault Component should handle array 1`] = `null`; + +exports[`PureOptionDefault Component should handle array 2`] = ` +<div + className="small" +> + Default: + <strong> + + [ ] + + </strong> + +</div> +`; + +exports[`PureOptionDefault Component should handle boolean type 1`] = ` +<div + className="small" +> + Default: + <strong> + + false + + </strong> + +</div> +`; + +exports[`PureOptionDefault Component should handle null value 1`] = ` +<div + className="small" +> + Default: + <strong> + + null + + </strong> + +</div> +`; + +exports[`PureOptionDefault Component should handle string 1`] = ` +<div + className="small" +> + Default: + <strong> + + "" + + </strong> + +</div> +`; + +exports[`PureOptionDefault Component should return null when the value is default 1`] = `null`; diff --git a/web/src/js/__tests__/components/Modal/__snapshots__/OptionSpec.js.snap b/web/src/js/__tests__/components/Modal/__snapshots__/OptionSpec.js.snap index 514e0eb5..257bddce 100644 --- a/web/src/js/__tests__/components/Modal/__snapshots__/OptionSpec.js.snap +++ b/web/src/js/__tests__/components/Modal/__snapshots__/OptionSpec.js.snap @@ -18,7 +18,7 @@ exports[`BooleanOption Component should render correctly 1`] = ` exports[`ChoiceOption Component should render correctly 1`] = ` <select onChange={[Function]} - selected="a" + value="a" > <option value="a" diff --git a/web/src/js/__tests__/ducks/optionsSpec.js b/web/src/js/__tests__/ducks/optionsSpec.js index 0925fcc1..9178c14e 100644 --- a/web/src/js/__tests__/ducks/optionsSpec.js +++ b/web/src/js/__tests__/ducks/optionsSpec.js @@ -49,3 +49,18 @@ describe('sendUpdate', () => { ]) }) }) + +describe('save', () => { + + it('should dump options', () => { + global.fetch = jest.fn() + store.dispatch(OptionsActions.save()) + expect(fetch).toBeCalledWith( + '/options/save?_xsrf=undefined', + { + credentials: "same-origin", + method: "POST" + } + ) + }) +}) diff --git a/web/src/js/components/Modal/Option.jsx b/web/src/js/components/Modal/Option.jsx index 58b863d1..38e2f239 100644 --- a/web/src/js/components/Modal/Option.jsx +++ b/web/src/js/components/Modal/Option.jsx @@ -74,7 +74,7 @@ export function ChoicesOption({ value, onChange, choices, ...props }) { return ( <select onChange={(e) => onChange(e.target.value)} - selected={value} + value={value} {...props} > { choices.map( diff --git a/web/src/js/components/Modal/OptionModal.jsx b/web/src/js/components/Modal/OptionModal.jsx index 5741ee8c..82ef8350 100644 --- a/web/src/js/components/Modal/OptionModal.jsx +++ b/web/src/js/components/Modal/OptionModal.jsx @@ -1,7 +1,9 @@ import React, { Component } from "react" import { connect } from "react-redux" import * as modalAction from "../../ducks/ui/modal" +import * as optionAction from "../../ducks/options" import Option from "./Option" +import _ from "lodash" function PureOptionHelp({help}){ return <div className="help-block small">{help}</div>; @@ -18,6 +20,31 @@ const OptionError = connect((state, {name}) => ({ error: state.ui.optionsEditor[name] && state.ui.optionsEditor[name].error }))(PureOptionError); +export function PureOptionDefault({value, defaultVal}){ + if( value === defaultVal ) { + return null + } else { + if (typeof(defaultVal) === 'boolean') { + defaultVal = defaultVal ? 'true' : 'false' + } else if (Array.isArray(defaultVal)){ + if (_.isEmpty(_.compact(value)) && // filter the empty string in array + _.isEmpty(defaultVal)){ + return null + } + defaultVal = '[ ]' + } else if (defaultVal === ''){ + defaultVal = '\"\"' + } else if (defaultVal === null){ + defaultVal = 'null' + } + return <div className="small">Default: <strong> {defaultVal} </strong> </div> + } +} +const OptionDefault = connect((state, {name}) => ({ + value: state.options[name].value, + defaultVal: state.options[name].default +}))(PureOptionDefault) + class PureOptionModal extends Component { constructor(props, context) { @@ -25,6 +52,10 @@ class PureOptionModal extends Component { this.state = { title: 'Options' } } + componentWillUnmount(){ + this.props.save() + } + render() { const { hideModal, options } = this.props const { title } = this.state @@ -53,6 +84,7 @@ class PureOptionModal extends Component { <div className="col-xs-6"> <Option name={name}/> <OptionError name={name}/> + <OptionDefault name={name}/> </div> </div> ) @@ -73,5 +105,6 @@ export default connect( }), { hideModal: modalAction.hideModal, + save: optionAction.save, } )(PureOptionModal) diff --git a/web/src/js/ducks/options.js b/web/src/js/ducks/options.js index 06144a3c..0da0fb8c 100644 --- a/web/src/js/ducks/options.js +++ b/web/src/js/ducks/options.js @@ -44,3 +44,7 @@ export function update(option, value) { sendUpdate(option, value, dispatch); } } + +export function save() { + return dispatch => fetchApi('/options/save', { method: 'POST' }) +} |