diff options
author | Shin'ya Ueoka <ueokande@i-beam.org> | 2019-04-30 14:00:07 +0900 |
---|---|---|
committer | Shin'ya Ueoka <ueokande@i-beam.org> | 2019-05-02 11:14:19 +0900 |
commit | c60d0e7392fc708e961614d6b756a045de74f458 (patch) | |
tree | 0b9a5fce1879e38a92d5dbb2915779aee0ad22d6 /src/settings/components/form/SearchForm.jsx | |
parent | 257162e5b6b4993e1dff0d705ffa6f0d809033eb (diff) |
Rename .js/.jsx to .ts/.tsx
Diffstat (limited to 'src/settings/components/form/SearchForm.jsx')
-rw-r--r-- | src/settings/components/form/SearchForm.jsx | 92 |
1 files changed, 0 insertions, 92 deletions
diff --git a/src/settings/components/form/SearchForm.jsx b/src/settings/components/form/SearchForm.jsx deleted file mode 100644 index 6b0bd01..0000000 --- a/src/settings/components/form/SearchForm.jsx +++ /dev/null @@ -1,92 +0,0 @@ -import './SearchForm.scss'; -import React from 'react'; -import PropTypes from 'prop-types'; -import AddButton from '../ui/AddButton'; -import DeleteButton from '../ui/DeleteButton'; - -class SearchForm extends React.Component { - - render() { - let value = this.props.value; - if (!value.engines) { - value.engines = []; - } - - return <div className='form-search-form'> - <div className='form-search-form-header'> - <div className='column-name'>Name</div> - <div className='column-url'>URL</div> - <div className='column-option'>Default</div> - </div> - { - value.engines.map((engine, index) => { - return <div key={index} className='form-search-form-row'> - <input data-index={index} type='text' name='name' - className='column-name' value={engine[0]} - onChange={this.bindValue.bind(this)} - onBlur={this.props.onBlur} - /> - <input data-index={index} type='text' name='url' - placeholder='http://example.com/?q={}' - className='column-url' value={engine[1]} - onChange={this.bindValue.bind(this)} - onBlur={this.props.onBlur} - /> - <div className='column-option'> - <input data-index={index} type='radio' name='default' - checked={value.default === engine[0]} - onChange={this.bindValue.bind(this)} /> - <DeleteButton data-index={index} name='delete' - onClick={this.bindValue.bind(this)} /> - </div> - </div>; - }) - } - <AddButton name='add' style={{ float: 'right' }} - onClick={this.bindValue.bind(this)} /> - </div>; - } - - bindValue(e) { - let value = this.props.value; - let name = e.target.name; - let index = e.target.getAttribute('data-index'); - let next = { - default: value.default, - engines: value.engines ? value.engines.slice() : [], - }; - - if (name === 'name') { - next.engines[index][0] = e.target.value; - next.default = this.props.value.engines[index][0]; - } else if (name === 'url') { - next.engines[index][1] = e.target.value; - } else if (name === 'default') { - next.default = this.props.value.engines[index][0]; - } else if (name === 'add') { - next.engines.push(['', '']); - } else if (name === 'delete') { - next.engines.splice(index, 1); - } - - this.props.onChange(next); - if (name === 'delete' || name === 'default') { - this.props.onBlur(); - } - } -} - -SearchForm.propTypes = { - value: PropTypes.shape({ - default: PropTypes.string, - engines: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.string)), - }), - onChange: PropTypes.func, -}; - -SearchForm.defaultProps = { - value: { default: '', engines: []}, - onChange: () => {}, -}; - -export default SearchForm; |